Question

如何删除以'font - '开头的所有内联样式属性？

INPUT

<div style="font-size:3px;color:red;">
  <p style="font-size:5px;"></p>
</div>

输出

<div style="color:red;">
  <p style=""></p>
</div>

Answer 1

虽然HtmlAgilityPack的答案看起来令人印象深刻，但请尝试这个更简单的代码：

var elements = document.querySelectorAll("[style*='font-']"),
    l = elements.length, i;
for( i=0; i<l; i++) {
    elements[i].style.cssText =
      elements[i].style.cssText.replace(/(^|;)\s*font-[^;]+/g,"");
}

Answer 2

A no-library solution：

var pattern = /^\s*font-/;
var styled = document.querySelectorAll('[style]');
[].forEach.call(styled, function(element) {
    var css = element.getAttribute('style');
    css = css.split(';').filter(function(rule) {
        return !pattern.test(rule);
    }).join(';');
    element.setAttribute('style', css);
});

基本上，使用style属性循环遍历每个标记，将其拆分为单独的规则以最大限度地减少出血（仍有一些可能：background: url('boo;font-weight.png');被破坏;但实现正确的解析器真的很难在几行中，这里的危险可以忽略不计），然后只选择不以font-开头的规则，并重建style属性。

编辑：Niet打了我1分钟，代码更紧。 1。

Answer 3

我们无法使用正则表达式解析html，但是我会尝试一下。

搜索：style=(.*)font-[^;]+;

替换为：style=\1

演示：http://regex101.com/r/gB6nF7/3

在这种情况下，正则表达式可以帮助你，但不会走得太远。

在其他情况下，您可以使用hjpotter建议的内容：

将font-[^;]+;替换为''

Answer 4

我建议使用HtmlAgilityPack而不是正则表达式。它真棒！

正则表达式不是html解析器的好习惯。

删除以'font-'开头的所有内联样式属性

4 个答案: