正则表达式：从任何HTML标记中删除HTML属性（style =“”）？

Question

正则表达式：从任何HTML标记中删除HTML属性（style =“”）？

16

我正在寻找一个正则表达式模式，以查找 HTML 标记内的属性。具体而言，我想查找所有的......

style=""

... 并将其从包含它的 HTML 标签中删除。显然，这也包括双引号中包含的任何内容。

我正在使用 Classic ASP 完成此操作。我已经设置了一个用于查找字符串中所有 HTML 标签并删除它们的不同正则表达式模式的函数。它运行得很好。但现在我只需要另一个模式，专门用于删除所有样式属性。

任何帮助都将不胜感激。

- jkupczak

你不应该尝试使用正则表达式解析HTML。 - Bohemian

1

使用解析器。 “HTML”中的“L”是线索 - “语言”。如果您的HTML很严格，那么您可能会很幸运，但为了安全起见，您需要像处理语言一样逐个标记地解析它。 - Bohemian

使用解析器，明白了。不幸的是，我对解析器的了解比正则表达式还要少。我将进行一些研究，但与此同时，Jason Gennaro提供了一个可以完成工作的正则表达式。谢谢。 - jkupczak

通常情况下，你不需要自己实现解析器，你只需要使用一个库。当你使用一个写得好的库时，这样做会更容易。 - d33tah

9个回答

25

我觉得这可能行：

/style="[a-zA-Z0-9:;\.\s\(\)\-\,]*"/gi

如果你只想替换其中某些部分，也可以将它们放在捕获组中

/(style=")([a-zA-Z0-9:;\.\s\(\)\-\,]*)(")/gi

示例: http://regexr.com?2up30

- Jason Gennaro

非常好！不过我注意到它在逗号上也会出现问题。比如font-family: Arial, Helvtica;但是我知道足够的正则表达式知识来解决这个问题。谢谢！ - jkupczak

太棒了@jimmykup！很高兴它起作用了。我已经编辑了答案，包括逗号的修复。感谢你的发现。 - Jason Gennaro

2

我还建议添加\#来捕获包含颜色相关规则的样式，例如background: #ff0000。 - ThoughtProcess

style="[a-zA-Z0-9:;\.\s\(\)\-\,\'\#]*" 这个对我有用，它缺少了单引号和#符号。 - Peter

在我的情况下（尝试从使用CSS内联器的电子邮件通讯中剥离样式），我发现这更有帮助，因为它还捕获了一些常用的内联CSS符号（＃，％，'等）：/(style=")([a-zA-Z0-9:;\.\s\(\)\-\,\!\#\'\%]*)(")/gi - Nicholas Byfleet

显示剩余3条评论

5

尝试一下，这将完全替换style属性及其值

const regex = /style="(.*?)"/gm;
const str = `<div class="frame" style="font-family: Monaco, Consolas, &quot;Courier New&quot;, monospace; font-size: 12px; background-color: rgb(245, 245, 245);">some text</div>`;
const subst = ``;

// The substituted value will be contained in the result variable
const result = str.replace(regex, subst);

console.log('Substitution result: ', result);

- Sachin Gaur

3

执行 /\s*style=(["'])(.*?)\1/gmi 可以更加灵活 - 支持单引号，去除额外的空格，忽略大小写。 - xmedeko

4

在Visual Studio的查找和替换中，这是我用来删除样式和类属性的方法：

\s*style|class="[^"]*\n*"

这将删除开头的空格、样式和类属性。它查找除双引号之外的任何内容，然后查找换行符（如果它扩展到新行），最后添加闭合的双引号。

- PersyJack

1

我尝试了Jason Gennaro的正则表达式，并进行了轻微修改。

/style="[a-zA-Z0-9:;&\."\s\(\)\-\,]*|\\/ig

这个正则表达式可以捕获字符串中出现&quot的特殊情况，例如：

 <div class="frame" style="font-family: Monaco, Consolas, &quot;Courier New&quot;, monospace; font-size: 12px; background-color: rgb(245, 245, 245);">some text</div>

- Nataly S'omka

我通过一个简单的更改使其在我的电脑上运行：style ="[a-zA-Z0-9:;&\."\s\(\)\-\,]*"|\\\。 - Joaquin Marcher

0

这适用于Perl。也许您需要稍微更改正则表达式以匹配ASP规则，但它应该适用于任何标记。

$file=~ s/(<\s*[a-z][a-z0-9]*.*\s)(style\s*=\s*".*?")([^<>]*>)/$1 $3/sig;

其中line是一个HTML文件。

此外，这是使用.NET C#编写的。

      string resultString = null;
      string subjectString = "<html style=\"something\"> ";

      resultString = Regex.Replace(subjectString, @"(<\s*[a-z][a-z0-9]*.*\s)(style\s*=\s*"".*?"")([^<>]*>)", "$1 $3", RegexOptions.Singleline | RegexOptions.IgnoreCase);

结果：

<html >

- FailedDev

0

这个表达式对我起作用：

style=".+"/ig

- Dmitry Matrosov

在字符匹配中应该排除双引号，例如 style="[^"]+"/ig。 - IanB

0

试一下：

(style|class)=(["'])(.*?)(["'])

- foad abdollahi

0

以下表达式应该删除 style 属性中的 任何内容（包括属性本身）；关键是这包括属性使用双引号或单引号：

/style=("|')(?:[^\1\\]|\\.)+?\1/gi

这将拆分捕获组，以便它们可以在单引号或双引号上匹配，并捕获之间的任何内容，包括URL编码字符和换行符，同时保留其他属性（如类或名称）。

在此处进行了测试：https://regexr.com/4rovf

- indextwo

在JavaScript中，反向引用不能在字符类内部使用，\1 === \x01。尝试交换顺序：/style=("|')(?:\\\1|.)+?\1/gi。 - Lauri

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- CpILL · Accepted Answer

也许一个更简单的表达方式是

 style="[^\"]*"

所以双引号之间的所有内容，除了双引号。