首页 文章

regex如何匹配单个元素（<>）中的重复属性名称

提问于
浏览 次
1

我正在尝试使用正则表达式来搜索具有重复样式或类属性的元素 . 我只能获得匹配的行，但我想更多地定义与实际元素的匹配（在<>内） . 有人有例子吗？下面是一些HTML，搜索应该只匹配顶部div，因为它有两个样式属性 .

<div style="width:100%;" style="height:100%;">
<div class="thisclass">Inner DIV</div>
<span class="thisstyle">Test Code</span>
</div>

我可以通过使用 <.+(class)=("|').+?\2.+?\1.+> 来获取具有重复属性的所有行，但如果行上有多个括号/元素，则会产生一些误报 .

regex

3 回答

  • 0

    更新 .

    以下解决方案是通用的 - 它将为您提供标记内的任何重复属性 . 我彻底测试过了：

    <[a-z]++\s++([a-z][-a-z_\d]++(?:\s*+=\s*+(?:(["'])(?:(?!(?<!\\)\2).)*+\2|[-a-z_\d{@#():,*!!\[\]}]++))?+[^-a-z_\d{@#():,*!!\[\]}>]++)*?(([a-z][-a-z_\d]++)(?:\s*+=\s*+(?:(["'])(?:(?!(?<!\\)\5).)*+\5|[-a-z_\d{@#():,*!!\[\]}]++))?+[^-a-z_\d{@#():,*!!\[\]}>]++)*([a-z][-a-z_\d]++(?:\s*+=\s*+(?:(["'])(?:(?!(?<!\\)\7).)*\7|[-a-z_\d{@#():,*!!\[\]}]++))?+[^-a-z_\d{@#():,*!!\[\]}>]++)*?(\4\b(?:\s*+=\s*+(?:(["'])(?:(?!(?<!\\)\9).)*+\9|[-a-z_\d{@#():,*!!\[\]}]++))?+[^-a-z_\d{@#():,*!!\[\]}>]*+)[^>]*>

    （对此正则表达式使用 case insensitive 模式）

    它会让你确定，你 correctly capture cases 喜欢：

    • <div style = "font-family:\"Open Sans\"" style= "font-size:2em">

    • <div class='one' width=20 class>

    • <div style="color:white" style=color:black!important>

    捕获组 $3 和 $8 将为您提供属性的第1和第2次出现及其值 .

    在这里以视觉和交互方式看一看 .

    Check regular expression online visually and interactively

    P.S.: 下面解释了正则表达式中 [\w{@#():,*!!\[\]}] 的用法：

    <div rel = {@＃（）：，* !! [[]]}> </ div>：这看起来很奇怪，但这些字符都没有问题，没有浏览器有任何问题 .

    我还在charated列表中添加了短划线“ - ”，可以解释为属性值，并且不会破坏它，因为现代浏览器会以这种方式运行 .

    回复于
  • 0

    例如，您可以在组1中使用 \sclass\s*=\s*"([^"]+)"[\s\>] ，您将找到属性的所有类名 . 只需在空格上拆分并检查所有值是否都是唯一的 .

    问题在于编写一个始终有效的正则表达式 . 因为正则表达式不是一个html解释器，所以总会出错：假设一个页面有javascript，并且在那里我做了一些奇怪的事情，不知怎的，正则表达式匹配 var class = "test test" ; 没有我的正则表达式火，但它不是一个html类属性 .

    您最好找到一个能够正确解释html的库并定期（因为它可能会慢一点）检查html是否包含双类名称 .

    回复于
  • 2

    要防止超过元素的结尾，请使用 [^>]+ 而不是 .+ . [^>] 匹配 > 以外的任何字符 .

    <[^>]+(class)=["'][^>]+?\2[^>]+?\1[^>]+>
    回复于

相关问题