=297575&extra=page%3D1当对广告过滤的效果要求较为苛刻,或者遇到一些脚滑的广告无法通过简单的点击进行过滤,这时我们需要打开“编辑站点过滤规则”对话框,进行规则的手工输入。为了便于规则编写者快速的生成规则、调试规则,我们为之搭建了一个比较便利的调试环境,典型的调试环境如下:如图中所示,分为这四部分:1)站点规则编辑器。我们通过该对话框对当前的站点规则进行编辑,输入的规则在点击“应用”或“完成”按钮后生效,页面会刷新以查看真实过滤效果。“查看原始页面”按钮可以帮助我们查看原始的网页情况,方便添加白名单规则。2)过滤日志查看器。在该对话框中我们可以得知被过滤的资源url以及它所匹配的规则。3)规则添加快捷菜单。该菜单帮助我们快速的生成黑白名单规则,大大提高我们编写规则的效率。使用方法与“手动屏蔽广告”类似,点击需要过滤的广告,选择需要添加的规则即可。4)开发者工具。如需分析网页结构,分析js脚本文件,我们还有“开发者工具”这一利器。另外两个比较典型的应用是获取资源url和删除广告上方漂浮的阻挡我们点击的遮罩元素。以上4部分共同构成了过滤规则的编写与调试环境,共同的目的只有一个:方便用户添加过滤规则,提高生成规则的效率。(3)编写过滤规则的语法。不同型号的枪需要各自特定型号的子弹,广告过滤规则亦然。当前版本支持的4种规则文本格式及其意义如下:2010/9/29更新“元素隐藏”规则描述。用户输入的规则文本格式1.一般匹配规则:按字符匹配,忽略大小写,可使用通配符*(任意数目的任意字符)和?(1个任意字符).范例:无通配符:有通配符:*.test.com/ads?/*2.正则匹配规则:符合PCRE格式的正则表达式.忽略大小写.格式符合js的inlineregexp格式:/expression/范例:/ads|ad\/.*?\.swf//180x(90|87|48).*?(jpg|gif|png|swf)/3.白名单规则:白名单规则通过在前述的一般规则前面添加@@|表示.忽略大小写,可以使用*和?通配符.范例:@@|@@|*4.注释:由!号开头的行都视为注释文本,不作为规则处理.范例:!ThefollowingisanexampleofRegExprule!/ads|ad\/.*?\.swf/5.元素隐藏规则(2010/9/29更新部分)(1)规则描述:domains##cssselector注:domains为多个域名,以逗号分隔。域名前可带~,表示例外,表示这个规则不应用在此域名上(它不会单独使用)。domains为空时,应用到整个站点。cssselector为css选择子。如:##sohuadcode##div#myid##div.myclass###myid(上面几个规则应用到整个站点)it.sohu.com##div#yyy(应用到it.sohu.com)sohu.com,~news.sohu.com##div#xxx(应用到sohu.com,但排除子域news.sohu.com)(2)URL匹配的元素隐藏规则描述url@##cssselector注:url为正则表达式或通配形式书写的URL。如:*@##sohuadcode/@##sohuadcode处理顺序:白名单始终优先,黑名单按顺序来*通过支持“通配符”及“正则表达式”,规则编写者能够写出非常漂亮的规则,有时一两条规则即可过滤整个网站的广告。*通过书写“元素隐藏”规则,可干净有效的去除页面广告且不会留白。(4)“元素隐藏”规则的网友贡献教程------------传送门---------------=369613&page=1#pid3733264如何更好的隐藏广告——元素隐藏:CSS选择器简介本帖最后由Rexaar于2011-8-517:50编辑M3的广告过滤可以使用CSS选择器过滤页面元素置顶帖介绍的比较简单这里补充一些原文:W3Ccss3-selectors水平有限,如有错漏,请指出示例会慢慢补完,如能提供好的示例,请跟帖指出0、M3元素过滤格式CSS选择器过滤页面元素的格式如下1.##a复制代码其中-##-(不包括“-”和“-”。以下相同)为元素过滤的开始标示,后面跟随的是具体的选择器其中-a-为标签选择器,匹配所有使用a标签的元素即##a的含义为过滤页面中所有使用a标签的元素其中的a可以替换为以下各种选择器,实现不同效果/*****************************************************************/1、基本选择器最基本的元素选择器,一共4个*a.a#a..测试页面:过滤讨论区-Maxthon3?建议马上加入广告过滤规则在线备份功能!....选择器:*含义:通用元素选择器,匹配任意元素,即可以选中全部元素示例:1.##*2.!选择全部元素3.!效果:屏蔽页面上所有元素复制代码..选择器:a含义:标签选择器,匹配所有标签为a的元素(常用标签:html、title、head、body、div、table、tr、td、li、form、img、script、a、p、br、h1、h2、h3、h4、h5、h6...)示例:1.##ul2.!说明:选择标签为-ul-的全部元素3.!效果:鼠标放到各种按钮上不显示菜单复制代码..选择器:.a含义:类(class)选择器,匹配所有class名为a元素示例:1.##.maxthon-header-wrapper2.!选择类名为-maxthon-header-wrapper-的全部元素3.!效果:屏蔽页面页面标题栏上黑色那条复制代码..选择器:#A含义:id选择器,匹配所有id为A的元素示例:1.###header2.!选择id名为-header-的全部元素3.!效果:屏蔽论坛页面标题栏复制代码../*****************************************************************/..2、组合选择器组合选择器通过多个元素之间的关系来指定元素组合选择器有5个a,bababa+ba~b这里测试页面依旧是过滤讨论区-Maxthon3?建议马上加入广告过滤规则在线备份功能!以下将#postlist记作p,即所有帖子列表,所有帖子的父元素将#post_3340285记做a1,即楼主贴,其他楼层以此类推..选择器:e,f含义:多元素选择器,同时匹配所有的e元素和所有的f元素,多个元素之间用半角逗号分隔示例:1.##a2,a5,a82.!说明:选中a2,a5,a83.!效果:2#、5#、8#、被屏蔽复制代码..选择器:ef含义:后代元素选择器,匹配e的所有后代中的全部f元素,e和f之间用空格隔开示例:1.##pa2.!说明:选中p的所有后代中的全部a3.!效果:1#至20#被屏蔽复制代码..选择器:ef含义:子元素选择器,匹配e的所有子元素中的全部f元素1.##pa2.!说明:选中p的所有后代中的全部a3.!效果:1#至20#被屏蔽复制代码....以下将#postlistdiv记作a,即所有的帖子,帖子列表的所有子元素....选择器:e+f含义:直接兄弟元素选择器,匹配紧跟所有e元素的与e同级的f元素(f元素最多只能为1个)示例:1.##a5+a2.!说明:匹配紧跟a5元素的与a5同级的a元素3.!效果:6#被屏蔽复制代码..选择器:e~f含义:通用兄弟元素选择器,匹配所有e元素之后的同级的f元素(f元素数量可以大于1个)示例:1.##a5~a2.!说明:匹配所有a5元素之后的与a5同级的a元素3.!效果:6#至20#被屏蔽复制代码..对父元素、子元素不清楚的可以看这里CSS继承详解/*****************************************************************/3、属性选择器属性选择器通过元素属性来选择元素属性选择器有7个,[attr]、[attr=value]、[attr~=value]、[attr^=value]、[attr$=value]、[attr*=value]、[attr|=value]测试页面同上:点击打开代码简化同上..选择器:[attr]含义:属性选择器,匹配所有包含attr属性的元素,其中attr属性值为任意值。示例:1.##a[id]2.!说明:选择所有标签为div的a元素,这些元素具有属性id3.!效果:1#至20楼被屏蔽复制代码..选择器:[attr=val]含义:属性选择器,匹配所有包含attr属性的元素,其中attr属性值等于-val-示例:1.##a[id=post_3419917]2.!说明:选择所有标签为div的a元素,这些元素具有属性id,id的值为post_3419917!(字符串post_3419917两端的引号--可不写,但是字符串以数字开头时必须写,以下相同)3.!效果:12#被屏蔽复制代码..选择器:[attr~=val]含义:属性选择器,匹配所有包含attr属性的元素,其中attr属性值为具有多个空格分隔的值,并且其中的一个值等于-val-示例:1.##div[class~=mainbox]2.!说明:选择所有标签为div的元素,这些元素具class属性,class的值为具有多个空格分隔的值,并且其中一个值等于mainbox3.!效果:1#至20#被屏蔽复制代码..选择器:[attr^=val]含义:属性选择器,匹配所有包含attr属性的元素,其中attr属性值以-val-开头示例:1.##div[id^=post_334]2.!说明:选择所有标签为div的元素,这些元素具id属性,id的值为以-post_334-开头3.!效果:1#、2#、3#、4#被屏蔽复制代码..选择器:[attr$=val]含义:属性选择器,匹配所有包含attr属性的元素,其中attr属性值以-val-结尾示例:1.##div[id$=94966]2.!说明:选择所有标签为div的元素,这些元素具id属性,id的值为以-94966-结尾3.!效果:6#被屏蔽复制代码..选择器:[attr*=val]含义:属性选择器,匹配所有包含attr属性的元素,其中attr属性值字符串中包含-val-字符串示例:1.##div[id*=4177]2.!说明:选择所有标签为div的元素,这些元素具id属性,其中id的属性值字符串中包含-4177-字符串3.!效果:8、9、10#被屏蔽复制代码..选择器:[attr|=val]含义:属性选择器,匹配所有包含attr属性的元素,其中attr属性值为具有多个连字号---分隔的值、并且其中的一个值以-val-开头说明:改选择器一般用于匹配语言元素,例如[lang|=zh]能选中alang=zh-cn/a、blang=zh-hk/b、clang=zh-tw/b/*****************************************************************/4、结构性伪类结构性伪类和根据文档树中表明的结构来选择元素、结构性伪类有14个,:root:nth-child(An+B)、:nth-of-type(An+B)、:nth-last-child(An+B)、:nth-last-of-type(An+B)、:first-child(An+B)、:first-o