Adblock Plus for firefox

关于 Adblock Plus for firefox（以下简称 ABP）的一些笔记。

安装好 ABP，将如下代码保存为 html 文件，然后在 firefox 中打开：

<p id="ad-banner">Hello World</p>

页面空白，原因是 ABP 将该 DOM 元素识别为了广告元素（谁叫你 id 带上 ad 呢）。查看该元素的样式：

#ad-banner {
    -moz-binding: url("about:abp-elemhidehit?700943922222#dummy") !important;
}

这段样式定义在 elemhide.css 文中，而该 css 文件保存在本地，我本地路径如下：

C:/Users/my_user_name/AppData/Roaming/Mozilla/Firefox/Profiles/0zwen4j6.default/adblockplus/elemhide.css

ABP 工作原理似乎有些眉目了。页面载入后（一般是 dom ready 后），ABP 工作，载入 elemhide.css 这个样式文件，而该样式文件则定义了一些过滤地址，随便找一段：

@-moz-document domain("www.sina.com.cn"){
#SI_EDU_AD{-moz-binding: url(about:abp-elemhidehit?586665725907#dummy) !important;}
.mod-01{-moz-binding: url(about:abp-elemhidehit?687687809199#dummy) !important;}
.part-k-l > .mod-13{-moz-binding: url(about:abp-elemhidehit?340624987696#dummy) !important;}
.part-l{-moz-binding: url(about:abp-elemhidehit?633256127575#dummy) !important;}
}

这段代码的意思就是过滤 www.sina.com.cn 域名下的 id 为 SI_EDU_AD 的元素，class 为 mod-01 的元素，等等。elemhide.css 文件非常庞大，而 ABP 的过滤源有专人（志愿者）维护（比如 chinalist+easylist）。

为何加上这个样式，dom 元素就不可见了呢？（以下开始为个人理解）原因是 -moz-binding 属性将 DOM "私有化" 成一个 widgets（类似于 Web Components？ Flash？），跟 chrome 下的 Shadow Dom 类似，url 内为一个 XML 文件，属于 XML Binding Language（XBL），关于 XBL 更多可以参考文末链接。神奇的是，-moz-binding 属性似乎是 "可持久化" 的，以最开始的代码为例，当 ABP 作用后 id 为 ad-banner 的元素被成功屏蔽，f12 后用 firebug 将 id 修改掉，元素依然不显示，由此可见其 "可持久化" 的性质。同时对于新插入的元素，该段 css 同样生效。（比如规则是屏蔽某个 id 下的第一个子元素，如果插入一个新的子元素在第一个位置，那么先后两个子元素均被屏蔽）

Read More：

• -moz-binding
• XBL
• Introduction to XBL
• XBL Bindings
• AdBlock广告阻截插件的两种屏蔽方式
• 互联网广告过滤的小历史
• [小Tip]ABP扩展对前端开发的影响