[TheWorld 3] 过滤扩展进阶应用笔记(2009.12.28 更新) 进阶, 笔记, 应用

elkay

这个帖子本来就准备写的，前几天没能定下心来，就拖了几天

广告过滤功能，其实不仅仅是为了过滤广告，更重要的是为了改善我们的网页浏览体验，所以，过滤功能所能做到的也不仅仅是过滤广告，还有其他很多很多东西，这个需要大家慢慢发掘

这个帖子可以看做是教程贴的延续，在教程贴中我已经介绍了tw3过滤的最基本用法，以及tw3过滤规则里所有的参数，因为教程贴比较简单，很多参数都没有用上，所以才有了这个帖子，这个帖子的内容也只是对教程贴的补充，所以，对于已经掌握了教程贴的朋友，就可以更加深入的了解tw3的过滤，由于内容较多较杂，所以我会不定期的更新不同的内容。

_________________________________________________________________________________________

第一节：多重过滤
多重过滤是tw3的最大特色之一，有了多重过滤，使tw3的过滤相对于tw2来说有了质的飞跃

相信大家在教程贴里看到过多重过滤字样，但是在那个帖子里却没有任何说明，主要是因为基本的过滤应用对多重过滤的需求不是太大。作为进阶应用的第一节，我就给大家介绍一下多重过滤；
多重过滤，实际上对这个功能最直白的描述应该是多重匹配；在教程贴里，我用实例介绍了如果过滤掉页面中指定的区域，而在实际情况下，有些时候我们会遇到想要过滤的区域并不是唯一，或者没有很明显的标示，这个时候多重过滤就派上用场了，我们可以利用多重匹配功能，来准确定位我们想要过滤的内容，下面我举个例子；

本版昨天有位朋友发了个帖子，要过滤论坛签名，尤其是要过滤带图片的签名，我就拿这个做个列子介绍一下如何只过滤带图片的签名，而不过滤只有文字的签名

首先，我们看一下论坛签名部分的代码(这里以Discuz! 7为例)

1. <div class="signatures" style="">
   
2. <table cellpadding="0" cellspacing="0">
   
3. <tbody><tr>
   
4. <td>签名内容</td>
   
5. </tr>
   
6. </tbody></table>
   
7. </div>

复制代码

我们可以看到，不管签名里是文字还是图片，代码都是这样的，不同的是签名内容部分，文字或者是图片，或者两者皆有
按照教程贴里的方法，我们很容易就能过滤整个签名部分，不区分文字还是图片，只要过滤掉属性为class="signatures"的div即可

但是那位朋友的理想目标是只过滤带有图片的签名，于是，我们看一下带有图片的签名代码

1. <div class="signatures" style="">
   
2. <table cellpadding="0" cellspacing="0">
   
3. <tbody><tr>
   
4. <td><img src=图片地址></td>
   
5. </tr>
   
6. </tbody></table>
   
7. </div>

复制代码

很明显，有图片的签名代码中含有<img src=图片地址>这样的内容，于是我们知道，只要过滤带有<img src=图片地址>内容的属性为class="signatures"的div就能实现过滤掉带有图片的签名
这个时候就可以利用多重过滤的多层匹配功能，第一层我们匹配属性为class="signatures"的div标签，然后在这个基础上我们继续匹配含有<img src=图片地址>内容的标签，将它过滤掉
我们可以得出这样的规则(规则中所使用的方式跟教程贴有所不同，具体参数请参考教程贴一楼的文档说明)：

1. <pattern type="1">
   
2.                                 <targets>
   
3.                                         <param>
   
4.                                                 <![CDATA[div]]>
   
5.                                         </param>
   
6.                                         <paramex>
   
7.                                                 <![CDATA[signatures]]>
   
8.                                         </paramex>
   
9.                                 </targets>
   
10.                                 <pattern type="3">
    
11.                                         <targets>
    
12.                                                 <param>
    
13.                                                         <![CDATA[<img]]>
    
14.                                                 </param>
    
15.                                                 <replace>
    
16.                                                         <![CDATA[<!--signatures with image-->]]>
    
17.                                                 </replace>
    
18.                                         </targets>
    
19.                                 </pattern>
    
20.                         </pattern>

复制代码

将这个规则加入相应的对应url地址，导入后我们访问相应url的Discuz! 7论坛的时候就会看到带有图片的签名档被过滤掉了，只留下带有文字的签名档

小结：多重过滤理论上是可以无限匹配，如果遇到2层匹配都无法确定的情况下可以增加第三层，直到准确定位到自己想要过滤的内容
~~~~~~~~~~
外篇 1
上面介绍了如何利用多重过滤来过滤包含图片的签名档，虽然已经达到目的，但是为了更好的浏览体验，我们是不是可以只过滤签名档中的图片，而保留签名档中的其他内容呢？这样做应该是最完善的方法，结论是肯定可以的，我首先提供一个可行的方法思路，tw3的过滤扩展相比tw2除了多重过滤以外，还有个很大的改进是正则引擎，对正则表达式有一定了解的朋友可以利用positive lookbehind准确定位到只在签名档中的图片代码，将这个图片代码过滤就完成了对签名档图片部分的过滤，而不会过滤掉其他内容，如果签名档中同时包含文字和图片，文字依然会保留，而图片会被过滤

~~~~~以上内容写于 2009.12.02~~~~~

elkay

第二节：反向匹配
反向匹配也是tw3过滤扩展一个非常重要的特色，据我说知，能提供反向匹配的过滤软件很少，因为有了反向匹配，tw3过滤扩展的适用性也大大增强

反向匹配的参数是 reverse，在教程贴一楼的文档里也简单介绍了参数，但是没有详细的用法，这一节就对反向匹配做个简单的介绍；
首先，反向匹配从名字上就能知道是什么意思，就是说针对我们在过滤规则中匹配到的内容取反，也许有人不理解这么做有什么意义，下面简单介绍一下，通过教程贴和第一节多重过滤的介绍，相信大家已经基本知道过滤扩展的使用方法和过滤规则的基本写法，其中最关键的就是准确匹配到我们需要过滤的内容，教程贴中是最简单的匹配方式；而第一节多重过滤介绍了如何在比较复杂的情况下利用多层匹配的方式准确定位到我们需要过滤的内容，然而现实中还有更加复杂的，比如说相似性实在太多，导致要使用更多层的匹配才能定位，又或者我们要过滤的内容根本没有唯一性，这个时候我们就可以利用反向匹配了。

首先要做的是转变思维方式，我们之前一直思考如何匹配到我们想要过滤的内容，然而如果实在找不到想要过滤的内容的匹配关键词的时候，很多人就会觉得无从下手，其实这个时候转变一下我们可以去找我们不需要过滤需要保留在页面中的内容呢？一般情况下，网页的正文都会有固定的格式，也就是说我们找不需要过滤的比找需要过滤的内容来的简单方便，针对不需要过滤的内容编写规则，然后利用反向匹配，将匹配到的不需要过滤的内容取反，结果就是我们需要过滤的内容，举个简单的例子，还是以第一节中过滤签名档的例子，第一节我们是要过滤带有图片的签名档，那假如我们是要过滤只有文字不带图片的签名档呢？利用反向匹配，将第一节中匹配带图片的签名档的规则取反就能达到这个目的，加上反向匹配的规则如下：

1. <pattern type="1">
   
2.         <targets>
   
3.                 <param>
   
4.                         <![CDATA[div]]>
   
5.                 </param>
   
6.                 <paramex>
   
7.                 <![CDATA[signatures]]>
   
8.                 </paramex>
   
9.         </targets>
   
10.         <pattern type="3">
    
11.                 <targets>
    
12.                         <param>
    
13.                                 <![CDATA[<img]]>
    
14.                         </param>
    
15.                         <reverse>
    
16.                                 <![CDATA[1]]>
    
17.                         </reverse>
    
18.                         <replace>
    
19.                         <![CDATA[<!--signatures without image-->]]>
    
20.                         </replace>
    
21.                 </targets>
    
22.         </pattern>
    
23. </pattern>

复制代码

将规则加入对应url的domain节导入，访问相应url的Discuz! 7论坛就会看到，没有图片的签名档被过滤了，留下了带有图片的签名档

小结：反向匹配提供了另外一种过滤指定内容的思路，可以说是针对过滤的逆向思维，两种方式的混合对过滤页面内容有着很大的用处
~~~~~~~~~~
外篇 2
反向匹配的用处有很多，我给大家提供一个方向，现在页面中的flash内容越来越多，同时网络视频也是基于flash，有些时候我们只需要看视频而不想看到其他flash内容，这个时候就可以利用反向匹配，找到视频内容比找到其他flash要简单的多，而且视频内容的时效性要大于其他flash比如广告，只要针对视频内容取反，我们就可以完成对视频页面上非视频flash内容的过滤

~~~~~以上内容写于 2009.12.03~~~~~

elkay

第三节：变量
变量是个很有用的功能，教程贴一楼的文档中介绍了变量的使用方法，replacevar可以将匹配到的内容输出到一个变量，replace则可以引用变量；变量在整个rule中都有效，rule中的任意一条规则都可以引用

这一节我稍微介绍一下变量在过滤广告时候的作用，变量对于很多人来说相对比较陌生，所以后面我会用图片说明；
首先我们先回顾一下过滤页面广告，在过滤很多网页的时候会发现广告是去掉了，但是页面上却留下了大大小小的空白，很是难看，大多数时候我们可以通过过滤掉空白处的内容去掉这个空白，但是有些时候却无法做到，这个跟html本身有关系，大多数的网页中内容都是固定位置的，即使你过滤掉页面中某一部分内容，下面部分的内容也不能自动填补上来，具体原因这里就不说了，大家只要知道并不是说过滤掉广告之后广告部分的空白就一定会自动消失的就可以了；

下面我们用一个简单的例子来说明一下遇到这种无法过滤掉的空白的时候变量的作用，请结合图片和注释一起看
示例网址是泡泡网首页(www.pcpop.com)
首先看一下第一幅图片:

下载 (182.28 KB)

2009-12-4 14:42

图片中我做了简单的注释，“空白”就是我们在过滤掉广告以后留下的大片空白，一般情况下我们没有办法单独过滤掉这一片空白，除非连最右边的“变量”框框里的内容一起过滤；
但是“变量”框框中的不是广告，是正常的页面内容，虽然并不一定有多大用处，但是从最佳浏览体验上来说我们应该尽量保证留下页面中正常的内容，所以我们就可以把这个部分先输出到一个变量，然后再连同空白处把整个部分过滤掉。
我们输出的“变量”会在后面引用使得这部分内容重新出现在页面上，不同的是换了个地方，“目标”就是我们可以找到的一个引用这个变量的地方，因为这里正好是一片空白，大小也正合适我们先前输出的变量中的内容。这样我们就有了完整的输出变量并且引用的一个过程。

我们先来看成果的图片

下载 (199.61 KB)

2009-12-4 14:42

我们的“变量”已经到了“目标”位置，而顶部的空白也没有了，显然这样的页面要比我们仅仅过滤掉广告以后的页面要整齐的多。
有兴趣的朋友可以去下载我的泡泡网过滤规则参考示例中变量的使用方法

小结：变量不仅仅是用来过滤广告，更多的是改善我们的浏览体验；另外，善用变量还可以做很多其他的事情
~~~~~~~~~~
外篇 3
对正则表达式有一定了解的朋友会发现，变量跟正则表达式中的捕获很相似，只是变量要比正则捕获更加容易使用；
另外，目前的tw3过滤扩展是不支持正则表达式的捕获功能的，这样一来可能有一个问题，那就是假如我们在某些时候只需要引用匹配到的内容中的一部分而不是全部内容，这个时候好像变量就无法满足了，这里提供一个变通的方法：利用正则表达式的positive lookahead、positive lookbehind等功能可以让变量只输出匹配到的内容中的一部分而非全部内容

~~~~~以上内容写于 2009.12.04 | 未完待续~~~~~

elkay

附录 1 ：过滤真的那么难么？

自从过滤扩展发布以来，自己尝试写规则的朋友越来越多了，最近有几个朋友问我，为什么按照教程贴里的方式无法过滤，或者找不到教程贴里的内容，后来我去看了他们要过滤的网站，其实是可以过滤的，问题就在于这些网站跟教程贴提供的不一样，这里我就稍微说一下过滤需要注意的问题

现在很多网站的页面都是DIV+CSS的，而教程贴里用的示例就是本论坛，也是这样，只要找到需要过滤的内容对应的div即可，问题是还有其他的广告并不是在div里的，有的是javascript脚本，有的是图片，这些都不能用div来搜索，需要换成对应的tag，比如script等等，而教程贴里提供的只是一个简单的示例，并不是一个固定的格式，不是说所有的网站都可以套用这个就能完成的，网站页面变化多端，不同的页面要用不同的方法，但是基本步骤都一样的，教程贴里提供的示例也就是给大家参考的一个基本步骤，在遇到其他情况下需要融会贯通。

tw3的过滤规则相比tw2简单，简单在不需要正则表达式基础，但是依然需要html语法基础，因为必须要清楚的知道需要过滤的内容在哪里才能在规则里写出来，好在html不需要怎么学习，多看几个页面源代码就能了解的差不多了，很多人会产生一个误解，有html基础并不是说你要非常了解或者说能自由运用，过滤功能所要求的html基础仅仅是要求对html有最基本的了解就可以了，所以不要被这些繁琐的语法吓倒，因为我们要做的不是写一个网站，而仅仅是过滤某个页面上的一小段内容而已。而过滤规则本身所使用的xml直接忽略就可以了，写规则的时候复制现成的参数拼接一下就行了。


小结：
1. 过滤不在乎你的知识多么丰富(什么正则表达式啊，html语法啊，这些都无所谓)，在乎的是你的想法，只要你想到了方法就完成了过滤的绝大部分，因为这些知识都是死的，需要用的时候再去查也来得及
2. 千万不要被复杂html和xml语法吓倒，因为我们不需要非常熟悉这些，只要稍微了解就可以了，就向上面说的，需要用的时候再去查也来得及，毕竟都是死的

~~~~~以上内容写于 2009.12.28 | 未完待续~~~~~

elkay

预留

早安晨光

管理员大大写教程辛苦，但像我等小白理解能力都很差，以后大大可以尝试以图文并茂的方式来写教程虽然麻烦点但更直观便于理解。

下载 (59.59 KB)

2009-12-2 15:41

elkay

6# 早安晨光


呵呵，其实不难理解，你可以一边看着文档一边看这个，对照着看就能加深理解效果了，如果只按照图片来写，大家还是不熟悉这些参数啊，我的目的是让大家对这些参数都有一定的了解，用的时候就方便了

904055262

不错 如果 这些XML代码 不要用户去写的话 就好多了  跟adblock plus一样
只要有特定的前缀告诉软件就行了
比如@ @ 表示白名单
       ## 表示隐藏元素
      /   / 双斜杠之间表示套用正则...

904055262

我想知道 为什么要写成这个样子
DIV[id="ad_"]
这样一句 不行么?
为什么前面要那么多  漏了一个关闭标签 不就挂了....

elkay

adblock有他的优点，但是同样缺点也很明显，adblock从功能性上来说连tw2都比不上，何况现在的tw3呢？

有人说规则的编写比较复杂，其实这个是观看角度的问题，就拿教程贴中的例子，那么长一段代码中用户仅仅只需要修改其中的很少的一部分。在大多数情况下，用户只要复制粘贴就能完成规则编写的大部分工作，剩下的只是修改其中很少的一部分字符串而已

最后我想说的是，广告过滤的易用性是指规则使用上的便捷，而不是规则编写上的便捷，很多人推崇mt的过滤，难道mt的过滤包会比tw3的规则简单么？

clock

有时间一定得认真学习才行了

smile16888

先去研究下怎么利用positive lookbehind准确定位到只在签名档中的图片代码
期待E版的续