Adblock Plus根据标签内容过滤示例

假设我们有个页面源码如下：

<div class="contentxxxxx">
    <div class="col-md4 col-sm6">
        <span>要过滤的子元素</span>
    </div>
    <div class="col-md4 col-sm6">
        <div class="box">
            <div class="col-md4 col-sm6">
            内容1
            </div>
            <div class="col-md7 col-sm6">
                内容2
            </div>
        </div>
    </div>
</div>

展示出来呢，就是下面这样：

我们的预期是要过滤掉“要过滤的子元素”所在的col-md4 col-sm6，这个时候，普通的adblock规则会是这样的：

example.com##.col-md4.col-sm6

一旦你添加后，会发现内容1和内容2也都被过滤掉了……

然后你会考虑，你只需要过滤第一个.col-md4.col-sm6，那么规则改成：

example.com##.col-md4.col-sm6:nth-child(1)

= =实际情况会是，内容1这种相似class的也会被隐藏掉，变成下面这个样子：

那么为了达到目的，应该如何写规则呢？自动生成肯定是不行了，翻翻Adblock Plus的手册，发现有-abp-has等特别的规则，所以研究后，规则如下：

example.com# #.col-md4:-abp-has(span:-abp-contains(/子元素/))

即可达到预期。核心的规则是-abp-has来判定是否存在，-abp-contains来判定HTML文本是否包含指定字符。合理利用这些过滤符，可以在class相同的情况下，达成元素隐藏过滤的目标。

未经允许不得转载：阿藏博客 » Adblock Plus根据标签内容过滤示例