Javascript saubere Tabelle style_javascript Tipps-js-Tutorial-php.cn

Heim

Web-Frontend

js-Tutorial

Javascript saubere Tabelle style_javascript Tipps

May 16, 2016 pm 03:50 PM

javascript

Ich bin im Projekt auf eine solche Anforderung gestoßen. Der HTML-Code eines großen Artikeltextes wurde auf dem Mobiltelefon nicht vollständig angezeigt. Der Grund dafür war, dass es eine Tabelle gab und alle tr/td-Stile in der Tabelle enthalten waren Aus Word eingefügt, müssen die in Tabelle, tr und td enthaltenen Stile in dieser großen Zeichenfolge gelöscht werden. Gleichzeitig kann die Tabellenstruktur, dh der Zeilenbereich in tr und der Spaltenbereich in td, nicht zerstört werden müssen beibehalten werden.

Der HTML-Teil des Codes lautet wie folgt:

&lt;p class="MsoNormal" align="left" style="text-align:left"&gt;&lt;span lang="EN-US"&gt;
 &lt;o:p&gt;文字中华人民共和国文字中华人民共和国文字中华人民共和国&lt;/o:p&gt;
 &lt;/span&gt;&lt;/p&gt;
&lt;table&gt;
 &lt;tbody&gt;
  &lt;tr style="height:13.5pt"&gt;
   &lt;td width="117" style="width:88.0pt;border:solid windowtext 1.0pt;padding:0cm 5.4pt 0cm 5.4pt;height:13.5pt"&gt;&lt;p class="MsoNormal" align="center" style="text-align:center"&gt;&lt;span style="font-family:宋体;color:#1F497D"&gt;项目&lt;span lang="EN-US"&gt;
     &lt;o:p&gt;&lt;/o:p&gt;
     &lt;/span&gt;&lt;/span&gt;&lt;/p&gt;&lt;/td&gt;
   &lt;td width="137" style="width:103.0pt;border:solid windowtext 1.0pt;border-left:none;padding:0cm 5.4pt 0cm 5.4pt;height:13.5pt"&gt;&lt;p class="MsoNormal" align="center" style="text-align:center"&gt;&lt;span style="font-family:宋体;color:#1F497D"&gt;金额&lt;span lang="EN-US"&gt;
     &lt;o:p&gt;&lt;/o:p&gt;
     &lt;/span&gt;&lt;/span&gt;&lt;/p&gt;&lt;/td&gt;
   &lt;td width="153" style="width:115.0pt;border:solid windowtext 1.0pt;border-left:none;padding:0cm 5.4pt 0cm 5.4pt;height:13.5pt"&gt;&lt;p class="MsoNormal" align="center" style="text-align:center"&gt;&lt;span style="font-family:宋体;color:#1F497D"&gt;经办人&lt;span lang="EN-US"&gt;
     &lt;o:p&gt;&lt;/o:p&gt;
     &lt;/span&gt;&lt;/span&gt;&lt;/p&gt;&lt;/td&gt;
   &lt;td width="135" style="width:101.0pt;border:solid windowtext 1.0pt;border-left:none;padding:0cm 5.4pt 0cm 5.4pt;height:13.5pt"&gt;&lt;p class="MsoNormal" align="center" style="text-align:center"&gt;&lt;span style="font-family:宋体;color:#1F497D"&gt;是否有发票&lt;span lang="EN-US"&gt;
     &lt;o:p&gt;&lt;/o:p&gt;
     &lt;/span&gt;&lt;/span&gt;&lt;/p&gt;&lt;/td&gt;
  &lt;/tr&gt;
  &lt;tr style="height:13.5pt"&gt;
   &lt;td width="117" style="width:88.0pt;border:solid windowtext 1.0pt;border-top:none;padding:0cm 5.4pt 0cm 5.4pt;height:13.5pt"&gt;&lt;p class="MsoNormal" align="center" style="text-align:center"&gt;&lt;span style="font-family:宋体;color:#1F497D"&gt;合计&lt;span lang="EN-US"&gt;
     &lt;o:p&gt;&lt;/o:p&gt;
     &lt;/span&gt;&lt;/span&gt;&lt;/p&gt;&lt;/td&gt;
   &lt;td colspan="3" valign="bottom" nowrap="" style="width:103.0pt;border-top:none;border-left:none;border-bottom:solid windowtext 1.0pt;border-right:solid windowtext 1.0pt;padding:0cm 5.4pt 0cm 5.4pt;height:13.5pt"&gt;&lt;p class="MsoNormal" align="center" style="text-align:center"&gt;&lt;span lang="EN-US" style="font-size:11.0pt;font-family:宋体;color:black"&gt;
     &lt;o:p&gt;&lt;/o:p&gt;
     &lt;/span&gt;&lt;/p&gt;&lt;/td&gt;
  &lt;/tr&gt;
 &lt;/tbody&gt;
&lt;/table&gt;
&lt;p class="MsoNormal"&gt;&lt;span style="font-family:宋体;color:#1F497D"&gt;文字中华人民共和国文字中华人民共和国文字中华人民共和国。&lt;/span&gt;&lt;span lang="EN-US" style="color:#1F497D"&gt;
 &lt;o:p&gt;&lt;/o:p&gt;
 &lt;/span&gt;&lt;/p&gt;

Nach dem Login kopieren

Das JS-Skript lautet wie folgt:

/*
 *格式化内容，str即是html格式的字符串
 */
function formatContent(str){
  str=str.replace(/&lt;\/&#63;(html|head|title|meta|body)\b[^&gt;]*&gt;/ig,"");
  str=str.replace(/&lt;table[^&gt;]*&gt;/ig,"&lt;table&gt;");
  return str;
  str=str.replace(/(&lt;tr[^&gt;]*&gt;)/ig, function (a, b) {
    if(a.indexOf('rowspan')&gt;-1){
      a=a.replace(/([a-z]+)="([^"]+)&#63;"/ig,function(c,d,e){
        return d === 'rowspan' &#63; (d + '="' + e + '"') : '';
      })
      return a;
    }else{
      return '&lt;tr&gt;';
    }
  });
  str=str.replace(/(&lt;td[^&gt;]*&gt;)/ig, function (a, b) {
    if(a.indexOf('colspan')&gt;-1){
      a=a.replace(/([a-z]+)="([^"]+)&#63;"/ig,function(c,d,e){
        return d === 'colspan' &#63; (d + '="' + e + '"') : '';
      })
      return a;
    }else{
      return '&lt;td&gt;';
    }
  });
  return str;
}

Nach dem Login kopieren

Das Obige ist der gesamte Inhalt dieses Artikels. Ich hoffe, er gefällt Ihnen allen.

Erklärung dieser Website

Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn