javascript clean table style_javascript tips

WBOY
Lepaskan: 2016-05-16 15:50:40
asal
1566 orang telah melayarinya

Saya menghadapi permintaan sedemikian dalam projek Kod html teks artikel yang besar tidak dipaparkan sepenuhnya pada telefon bimbit Sebabnya ialah terdapat jadual, dan tr/td dalam jadual jadual semuanya membawa gaya ditampal daripada perkataan , adalah perlu untuk mengosongkan gaya yang dibawa dalam jadual, tr, dan td dalam rentetan besar ini, dan pada masa yang sama, struktur jadual tidak boleh dimusnahkan, iaitu, rowspan dalam tr dan colspan dalam td. mesti dikekalkan.

Bahagian html kod adalah seperti berikut:

<p class="MsoNormal" align="left" style="text-align:left"><span lang="EN-US">
 <o:p>文字中华人民共和国文字中华人民共和国文字中华人民共和国</o:p>
 </span></p>
<table>
 <tbody>
  <tr style="height:13.5pt">
   <td width="117" style="width:88.0pt;border:solid windowtext 1.0pt;padding:0cm 5.4pt 0cm 5.4pt;height:13.5pt"><p class="MsoNormal" align="center" style="text-align:center"><span style="font-family:宋体;color:#1F497D">项目<span lang="EN-US">
     <o:p></o:p>
     </span></span></p></td>
   <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"><p class="MsoNormal" align="center" style="text-align:center"><span style="font-family:宋体;color:#1F497D">金额<span lang="EN-US">
     <o:p></o:p>
     </span></span></p></td>
   <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"><p class="MsoNormal" align="center" style="text-align:center"><span style="font-family:宋体;color:#1F497D">经办人<span lang="EN-US">
     <o:p></o:p>
     </span></span></p></td>
   <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"><p class="MsoNormal" align="center" style="text-align:center"><span style="font-family:宋体;color:#1F497D">是否有发票<span lang="EN-US">
     <o:p></o:p>
     </span></span></p></td>
  </tr>
  <tr style="height:13.5pt">
   <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"><p class="MsoNormal" align="center" style="text-align:center"><span style="font-family:宋体;color:#1F497D">合计<span lang="EN-US">
     <o:p></o:p>
     </span></span></p></td>
   <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"><p class="MsoNormal" align="center" style="text-align:center"><span lang="EN-US" style="font-size:11.0pt;font-family:宋体;color:black">
     <o:p></o:p>
     </span></p></td>
  </tr>
 </tbody>
</table>
<p class="MsoNormal"><span style="font-family:宋体;color:#1F497D">文字中华人民共和国文字中华人民共和国文字中华人民共和国。</span><span lang="EN-US" style="color:#1F497D">
 <o:p></o:p>
 </span></p>
Salin selepas log masuk

Skrip JS adalah seperti berikut:

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

Di atas adalah keseluruhan kandungan artikel ini, saya harap anda semua menyukainya.

Label berkaitan:
sumber:php.cn
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Tutorial Popular
Lagi>
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan