javascript格式化table标签内容
项目中遇到这样的需求,一大段文章正文的html代码在手机中显示不全,原因是由于其它有table,而table表格中的tr/td都携带了从word中粘贴过来的样式,需要将这一大段的字符串中的table、tr、td中携带的样式清除掉,同时还不能破坏table结构,即要保留tr中的rowspan和td中的colspan属性。
html部分代码如下:
<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>
JS脚本如下:
/* *格式化内容,str即是html格式的字符串 */
function formatContent(str){
str=str.replace(/<\/?(html|head|title|meta|body)\b[^>]*>/ig,"");
str=str.replace(/<table[^>]*>/ig,"<table>");
str=str.replace(/(<tr[^>]*>)/ig, function (a, b) {
if(a.indexOf('rowspan')>-1){
a=a.replace(/([a-z]+)="([^"]+)?"/ig,function(c,d,e){
return d === 'rowspan' ? (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]+)="([^"]+)?"/ig,function(c,d,e){
return d === 'colspan' ? (d + '="' + e + '"') : '';
})
return a;
}else{
return '<td>';
}
});
return str;
}
javascript格式化table标签内容的更多相关文章
- JavaScript之控制标签内容
function abb(a){ return document.getElementById(a); } console.log(abb('box').innerHTML); 标签.innerHTM ...
- [分享·JavaScript]提取Table中的内容到XML对象
在公司工作的时候,经常需要在前端进行这样的数据提取的操作.而之前的针对每个页面中的Table都重新写原生的JS代码效率太低,且不方便aspx对XML进行处理. 所以,在今天抽时间写了这么一个JS类,见 ...
- JavaScript和jQuery改变标签内容
HTML: <div id="mazey">content</div> JavaScript: var mazey=document.getElementB ...
- 区别CSS中display:box;inline;none以及HTML中 <frame> 标签<table> 标签的 frame 属性
区别display:box:display:inline:display:none三者的不同 display:block的特点是: block是Display默认的值.总是在新行上开始:该对象随后的内 ...
- table标签总结
一.table标签:定义一个表格简单表格由table元素以及一个或多个tr(行标签).th(表头单元格标签).td(普通单元格标签) <table border=1><tr>& ...
- ol,ul,dl,table标签的基本语法
ol,ul,dl,table标签的基本语法 有序列表: 无序列表: 自定义列表: <ol> <ul> < ...
- HTML——表格table标签,tr或者td
表格定义和用法 <tr> 标签定义 HTML 表格中的行. tr 元素包含一个或多个 th 或 td 元素. HTML 与 XHTML 之间的差异 在 HTML 4.01 中,tr 元素的 ...
- PHP自学4——通过函数将数组数据输出到html的Table标签中(使用函数的例子)
这一节其实说实话并没有什么干货,不过为了防止PO主的懒癌的复发,还是坚持放一点东西,即使是内容和长度都令人发指.这一节通过一个函数来实现将数组中的内容输出html的Table标签当中显示. 函数文件— ...
- table中内容过长,table改变的问题
在看效果时发现在Chrome中的table已经不是原来设置的宽度了,而其他浏览器是好的,经过百度发现是单元格内容过多造成的,但这时候给td设置宽度已经不适用了,此时就要给table设置 table{t ...
随机推荐
- struts2实现文件上传(多文件上传)及下载
一.要实现文件上传,需在项目中添加两个jar文件 二.上传准备的页面 注:必须植入enctype="multipart/form-data"属性,以及提交方式要设置成post &l ...
- fopen函数和fread函数、fwrite函数
fopen(打开文件) 相关函数 open,fclose 表头文件 #include<stdio.h> 定义函数 FILE * fopen(const char * path,const ...
- [No0000A1]人体排毒时间表,别再信了
经常可以看到有「人体排毒时间表」这样的说法,不同的媒体反复传播,大同小异.这些说法里,大多把人体的系统器官都给安排了一个特定的时段,认为在某时段是某器官的排毒时间,睡觉能排一切毒.事实上果真如此么?让 ...
- 杂项之使用qq邮箱发送邮件
杂项之使用qq邮箱发送邮件 本节内容 特殊设置 测试代码 1. 特殊设置 之前QQ邮箱直接可以通过smtp协议发送邮件,不需要进行一些特殊的设置,但是最近使用QQ邮箱测试的时候发现以前使用的办法无法奏 ...
- 1597: [Usaco2008 Mar]土地购买
1597: [Usaco2008 Mar]土地购买 Time Limit: 10 Sec Memory Limit: 162 MBSubmit: 4023 Solved: 1470[Submit] ...
- 单点登录改进版-使用ajax分发cookie避免重定向轮询
前言 继上一篇博文:可跨域的单点登录(SSO)实现方案[附.net代码]虽然实现了单点登录,也存在很多不合理的地方.很多热心的朋友也给出了很多指导性的意见,特别是 LoveCoder提出的意见. 在很 ...
- Snowflake 全局唯一Id 生成
/// <summary> /// From: https://github.com/twitter/snowflake /// An object that generates IDs. ...
- uva10635 LIS
Prince and PrincessInput: Standard Input Output: Standard Output Time Limit: 3 Seconds In an n x n c ...
- javascript-style-guide
/* 1.类型types 原始值:存取直接作用于它自身 string number boolean null undefined var foo=1; var bar=foo; bar=9; cons ...
- div+css:div中图片垂直居中
div中图片垂直居中 <!DOCTYPE html> <html> <head> <meta charset="utf-8"> &l ...