灵 动 生 活　　点 滴 感 悟

adblock隐藏规则中的CSS选择器

• 六月 30th, 2007
• 归类于Geek Tweak

adblock（官网、安装）是我觉得最不可或缺的几个Firefox 插件之一，除了过滤用于广告的帧、脚本、图片、flash等，加快浏览速度之外，元素隐藏则可以隐藏那些恶心的文本广告，清新整洁的互联网使人心情愉悦：），想到一句广告词：痘痘都不见了！ 然而，这次却遇到一个极想隐藏又没办法隐藏的广告。因为人家只有一个table，总不至于把所有table都隐藏了吧=_=! 我只好再次打开adblock官网，找到过滤规则写法说明，看看会不会有什么新发现。虽然早就看过，但只是草草概览了一遍，这回认真一看，果然以前漏掉了一个极重要的特性：adblock支持 CSS selector 。 也就是说，就好像自己就是这个网站的作者，像平常写style sheet一样选择元素，最后由adblock自动在后面加上{ display: none; }。比如： Click the expand button to read full text… * //匹配所有元素 A //匹配所有名为A的元素 A B //匹配名为B且包含在A中的元素（B是A的“后代”，包括儿子、孙子……） A>B /* 匹配名为B且是A的孩子的元素： <div>Hello<h1>adblock, <em>I love you!</em></h1></div> 其中，h1是div的孩子，em是div的孙子…… div>h1：匹配 div>em：不匹配 div em：匹配 */ A:first-child /* 匹配名为A且是其父母长子的元素 <h1><strong>Hello</strong><em>adblock!</em></h1> 其中，strong是长子，em不是 strong:first-child：匹配 em:first-child：不匹配 */ A + B /* 匹配名为B且是A紧挨着的弟弟的元素 <nl> <lable>for many reasons:</lable> <li>1</li> <li>2</li> <li>…</li> </nl> <h1>I love adblock</h1> <p>and, I can’t help introducing it to you</p> nl + h1：匹配 h1 + p：匹配 nl + p：不匹配 */ A[B] // 名为A且具有属性B的元素 A[B="C"] // [ 阅读全文]