Board logo

标题: CSS手动屏蔽Theworld Chrome广告教程 [打印本页]
作者: jfjj007    时间: 2011-5-17 00:24     标题: CSS手动屏蔽Theworld Chrome广告教程

本帖最后由 jfjj007 于 2011-5-18 00:50 编辑

1， 首先找到这个CSS文件。

“Theworld_Chrome\User Data\Default\User StyleSheets\Custom.css”，这个文件就是chrome的CSS设置文件，默认为空。某些设置都可以在这里进行，例如，如果想使用微软雅黑作为全局的字体，那么添加一行
—————————————————————————————————————————————————————————————
* {font-family: "WenQuanYi Micro Hei Mono", "WenQuanYi Micro Hei", "Microsoft Yahei Mono", "Microsoft Yahei", sans-serif !important;}
—————————————————————————————————————————————————————————————
即可。

2，定位元素位置。新建书签收藏，名字随意，地址为：
  1. javascript:function(){if(window.navigator.ujs_AdBlock){return}else{window.navigator.ujs_AdBlock=true};var ele='',outline='',title='',bgColor='',frameBorder='';var doc=((window.document.body instanceof HTMLFrameSetElement)?window.frames[0]:window).document;var createStyle=function(css){var s=doc.createElement('style');s.setAttribute('type','text/css');s.appendChild(doc.createTextNode(css));return doc.documentElement.appendChild(s)};var getAtt=function(ele){var r='';for(var i=0,a;a=ele.attributes;i++){var n=a.nodeName.toLowerCase();if(/^(id|class|height|width|color|bgcolor|align|href|src)$/.test(n))r+='['+n+'=\x22'+a.nodeValue+'\x22]'};return r};var getNth=function(ele){if(/^(html|body|iframe|img|a)$/i.test(ele.nodeName)||!window.postMessage)return'';var nth,n=0;var p=ele.parentNode;for(var i=0,c;c=p.childNodes;i++){if(c.nodeType==1){n++;if(c==ele)nth=n}};return(!nth||n<2)?'':':nth-child('+nth+')'};var block=function(ele){var css='';if(ele.hasAttribute('src')){css=ele.nodeName+'[src=\x22'+ele.getAttribute('src')+'\x22]'}else{var rez=[];while(ele){if(ele.nodeType==1)rez.unshift(ele.nodeName+getAtt(ele)+getNth(ele));ele=ele.parentNode};css=rez.join(' > ')};var tmp=createStyle(css+'{background-color: #FF5555 !important; outline: 1px solid #FF1111 !important; opacity: 0.7 !important;}');css=prompt('%E9%98%BB%E6%AD%A2%E8%BF%99%E4%B8%AA%E5%85%83%E7%B4%A0?',css);if(css){createStyle(css+'{display: none !important;}');location.href='data:text/adblock;charset=UTF-8,'+encodeURIComponent(css)};tmp.parentNode.removeChild(tmp)};var remove=function(){doc.removeEventListener('mouseover',over,false);doc.removeEventListener('mouseout',out,false);doc.removeEventListener('click',click,false);doc.removeEventListener('keyup',press,false);delete window.navigator.ujs_AdBlock};var over=function(ev){ele=ev.target;outline=ele.style.outline;title=ele.title;bgColor=ele.style.backgroundColor;frameBorder=ele.frameBorder;if(frameBorder)ele.frameBorder=1;ele.style.outline='1px solid #306EFF';ele.style.backgroundColor='#C6DEFF';ele.title='Tag: '+ele.tagName+(ele.id?', ID: '+ele.id:'')+(ele.className?', Class: '+ele.className:'')};var out=function(){if(ele){ele.style.outline=outline;ele.title=title;ele.style.backgroundColor=bgColor;if(frameBorder)ele.frameBorder=frameBorder}};var click=function(ev){if(ele){ev.preventDefault();out();remove();block(ele)}};var press=function(ev){if(ev.keyCode==27){out();remove()}};doc.addEventListener('mouseover',over,false);doc.addEventListener('mouseout',out,false);doc.addEventListener('click',click,false);doc.addEventListener('keyup',press,false)})()
复制代码
将该地址保存为书签后，打开一个页面，点击该书签，将会弹出对话框，让你选择要过滤的元素。某些网站的图片或flash无法点击，或是点击后就自动跳转，那么请使用chrome的右键-“审查元素”功能进行定位。当然，也可以先使用该脚本，查看该flash的元素ID，再通过审查元素中的查找进行定位，更快速。

以CnBeta为例，点击后，选择要过滤的元素，弹出对话框如图。

其中地址为：
—————————————————————————————————————————————————————————————
HTML > BODY > DIV[id="wrapper"]:nth-child(1) > DIV[id="main"]:nth-child(2) > DIV[id="content"]:nth-child(1) > DIV[id="active"]:nth-child(5) > DIV[id="ADcon0"]:nth-child(1) > DIV[class="newslist"]:nth-child(1) > DL:nth-child(2) > DD[class="detail"] > SPAN:nth-child(1)
—————————————————————————————————————————————————————————————
（1）基本隐藏规则：
该地址中，HTML,BODY,DIV,SPAN都是页面CSS元素，DIV是最常用的页面元素布局块，通过该书签，定位到要过滤的页面元素，该操作也可以通过“右键——审查元素“方法得到。可以看到，要过滤的元素按照节点位置，逐层定位，每个元素后使用id和class来区分，其中”.“表示class属性，”#“表示id属性。通过层级定位与属性区分，基本可以定位到需要的元素。基本隐藏规则中不需要nth-child(n)子元素选择器，因为某些网站中广告元素在多个区块出现，不使用子选择器可以将相同属性的广告块全部过滤掉。
（2）高级隐藏规则：
某些元素没有id或class区分，例如同一个div下，分别有三个div，其中有一个div是广告块，其他两块是正文块，且都没有id和class属性。那么按照基本过则的话只能或三个全部显示，或三个全部隐藏。这里需要使用子元素选择器“:nth-child(n) “。在子元素后，添加“:nth-child(n) “表示该元素位于所有子元素中的第n个，如DIV[id="active"]>DIV:nth-child(3)表示id为active的母div块的第三个子div块，加入这个属性后就可以定位任何页面元素，也就可以对付所有静态广告了。
某些网页会加入一些广告块，采用随机ID或随机CLASS，对付这类广告可以使用div[id^=”ads”]或div[id$=”ads”]，前者”^”表示以ads开头的所有div元素，后者”$”表示所有以ads结尾的div元素。
3，修改CSS文件，完成广告屏蔽。
在Custom.css文件中，添加下面代码:
—————————————————————————————————————————————————————————————
/*cnbeta*/
HTML > BODY > DIV[id="wrapper"] > DIV[id="main"]> DIV[id="content"]:nth-child(1) > DIV[id="active"]> DIV[id="ADcon0"]:nth-child(1) > DIV[class="newslist"] > DL > DD[class="detail"] > EM {display: none !important;}
—————————————————————————————————————————————————————————————
中间黑色字体为上两步中提取出来的页面元素，或是修改过后的页面元素CSS位置。绿色字体为注释说明（只限英文），红色字体为屏蔽关键字。如果CSS文件没有加入其它设置的话，可以在所有元素的尾端添加一个{display: none !important;}，如果加入了其他设置，如浏览器字体设置等，则需要在每条规则后加入该关键词。保存完成后，页面会即刻响应，无需刷新。
由于使用vstart，所以我将打开Custom.css单独设置一个快捷键，并使用Editplus打开，添加将“屏蔽关键词“和”注释关键词“添加为宏代码，双击即可添加。

CSS格式语法参考http://www.ruanyifeng.com/blog/2009/03/css_selectors.html
作者: jym2005    时间: 2011-5-17 01:28

提示: 作者被禁止或删除 内容自动屏蔽
作者: fghxy    时间: 2011-5-17 07:00

javascript:function()
是不是少个标点？
作者: 小絮    时间: 2011-5-17 11:26

如果只是隐藏广告而不能阻止下载，我个人认为没必要浪费系统资源来做这种傻事。广告并非洪水猛兽，很多广告图片已不仅仅是广而告之的功能了，其镶嵌在页面中往往起到了点缀页面的效果，若强行过滤掉会使页面失去美观。
我和2楼蛐蛐的观点基本相同，只是用url拦截的模式弄几个通用的规则应付一下弹窗、漂浮、广告联盟足矣。
作者: 02223289680    时间: 2011-5-17 11:55

chrome 记得没开放内部接口..只是下载后隐藏
作者: jfjj007    时间: 2011-5-17 19:10

javascript:function()
是不是少个标点？
fghxy 发表于 2011-5-17 07:00 http://bbs.ioage.com/cn/images/common/back.gif


恩  已修正  3Q
作者: jfjj007    时间: 2011-5-19 19:16

本帖最后由 jfjj007 于 2011-5-19 23:14 编辑

附上自己测试的代码
  1. * {font-family: "WenQuanYi Micro Hei Mono", "WenQuanYi Micro Hei", "Microsoft Yahei Mono", "Microsoft Yahei", sans-serif !important;}
  2. /*tongyong*/
  3. div[id^="ad_"],[id^="ads_"],[class^="wp a_"],[class="a_pr"],[id=my_search_se_wrap],
  4. /*51.la*/
  5. IMG[src="http://icon.ajiang.net/icon_0.gif"],[src="http://count28.51yes.com/count1.gif"],
  6. /* cnbeta */
  7. #AdForward,div[id^="google_ads_"],[class="gtitle"],[class^="tbox"],[id="h_right"],
  8. IMG[src="http://img.cnbeta.com/qy950.gif"],
  9. [src="http://img.cnbeta.com/oray576.gif"],
  10. [src="http://img.cnbeta.com/youdao576.gif"],
  11. [src="http://www.59.cn/test/newgg/25080-1.gif"],
  12. div#userInfo,#fm_r,#votes:nth-child(6),#votes:nth-child(11),#votes:nth-child(14),#votes:nth-child(15),
  13. DIV[id="feedback"]:nth-child(2) > CENTER:nth-child(2),
  14. DIV[id="feedback"]:nth-child(2) > CENTER:nth-child(7),
  15. DIV[class="newslist"]:nth-child(1) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  16. DIV[class="newslist"]:nth-child(2) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  17. DIV[class="newslist"]:nth-child(3) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  18. DIV[class="newslist"]:nth-child(4) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  19. DIV[class="newslist"]:nth-child(5) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  20. DIV[class="newslist"]:nth-child(6) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  21. DIV[class="newslist"]:nth-child(7) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  22. DIV[class="newslist"]:nth-child(8) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  23. DIV[class="newslist"]:nth-child(9) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  24. DIV[class="newslist"]:nth-child(10) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  25. DIV[class="newslist"]:nth-child(11) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  26. DIV[class="newslist"]:nth-child(12) > DL:nth-child(2) > DD[class="detail"] > EM:nth-child(2),
  27. DIV[id="foot"]:nth-child(4),
  28. /*Gmail*/
  29. div[class="mq nH oy8Mbf"],[class="nH OH0apf"],[class="l2 ov nH oy8Mbf"],[class="T8uMgc nH oy8Mbf"],[style^="width: 2"],
  30. /*Youku*/
  31. div[id^="ab_"],[class="caption"],[class="s_footer"],[style="margin-bottom:8px;"],
  32. /*Baidu*/
  33. p#lh,p#cp,p#lk,p.to,table.EC_mr15,a.favurl,
  34. table[class="ec_pp_f"],
  35. div[id="mCon"],[id="ec_im_container"],[class="r ec_bdtg"],[id="frs_banner_ad"],[class="tb_poptip_wrapper"],
  36. [style="width:85%"],[id^="bdfs"],[class="egg"],
  37. HTML > BODY > DIV[id="new-header"]:nth-child(9) > DIV[id="main"]:nth-child(6) > DIV[id="right"]:nth-child(5) > TABLE:nth-child(17),
  38. HTML > BODY > DIV[id="new-header"]:nth-child(9) > DIV[id="main"]:nth-child(6) > DIV:nth-child(1),
  39. HTML > BODY > DIV[id="footer"]:nth-child(7),
  40. HTML > BODY > DIV[id="out"]:nth-child(1) > DIV[id="in"] > DIV[id="wrapper"] > DIV[id="foot"]:nth-child(30)
  41. {display: none !important;}
复制代码
作者: jfjj007    时间: 2011-5-19 22:17

本帖最后由 jfjj007 于 2011-5-19 23:13 编辑

Test
作者: jym2005    时间: 2011-5-19 23:40

提示: 作者被禁止或删除 内容自动屏蔽



欢迎光临 世界之窗论坛 (http://bbs.theworld.cn./) Powered by Discuz! 7.2