正则替换HTML里的style属性

一个网友问:

<p class="a" style="font-size: 12pt;  font-family: ""; color: red;">a</p>

如何替换成:

<p class="a" >a</p>

以为So easy,写个正则匹配一下就OK了,

/style="[^"]*?"/g

结果生成结果如下:

<p class="a" "; color: red;">a</p>

原来忽略了style="中间有双引号"

琢磨后,

改进了正则表达式:

var a=`<p class="a" style="font-size: 12pt;  font-family: ""; color: red;">a</p>`

var reg4 = /style="[^=]*?"([(\s+\w+=)|>])/g

a.replace(reg4,'$1')

最终生成结果:

<p class="a" >a</p>

"和>之间还多了一个空格。基本上达到了要求。

 

原理,style后的内容非贪婪匹配,以一个=号或是>号结尾,后面那部分要用分组($1)替换回来

 

20190107,反馈有问题,改进:

 var a=` <span style="font-family: "Times New Roman";" class="abc">`
var reg4 = /style="[^=>]*"([(\s+\w+=)|>])/g
a.replace(reg4,'$1') 

 把非贪婪匹配改为了贪婪匹配。

posted on 2019-01-04 17:16  阿提  阅读(3133)  评论(0编辑  收藏  举报

导航