懂CSS就去广告~传统方式去的缺点ad解决看到的广告内容最简单的方法就是使用浏览器插件，比如大名鼎鼎的AdBlock插件和国内各种广告拦截助手。然而，这些插件的拦截能力并不是高度可定制的。例如，AdBlock需要通过它通过CSS选择器定义的一套语法规则来屏蔽一些DOM元素，而在某些特殊情况下就无能为力了。比如页面上的一些重要元素绑定了事件，点击后会跳转到广告页面。这时候就不能通过简单的阻塞DOM元素来实现了。简单高效的定制方式针对这些情况，我们可以使用一款功能强大的浏览器插件——Greasemonkey，简称GM，中文俗称“油猴”，支持Firefox和Chrome浏览器。油腻猴子并不是专门用来去除广告的插件，而是一种在页面中植入JavaScript代码来修改页面或者增加一些功能的工具，比如自动填表、显示网盘文件下载链接等。开发功能非常简单，只需要通过js调用相应的API函数即可。只需几行代码，即可去除大部分页面广告。快速启动GM脚本油猴的使用很简单，我们写一个js脚本，然后配置相应的URL。这样当浏览器访问匹配的URL时，油猴就会加载我们写的js脚本，运行里面的代码。简而言之，有两个步骤。配置脚本。大约有20个配置项。下面我们介绍三个最重要的配置项。写一个脚本。调用插件提供的API函数为页面添加CSS样式或执行js代码。@include脚本匹配的URL，支持星号“*”匹配任意字符。可以多次使用，匹配多个网址。@grant声明了需要使用的API函数。@run-at脚本执行时，有5个可选值，CSS样式我们选择“document-start”在页面渲染前加载，js脚本可以选择“document-end”在页面渲染后加载。需要注意的是，配置参数在以==UserScript==开头，以==/UserScript==结尾的注释中。完整示例如下：//==UserScript==//@nameXXAdFilter//@version0.1//@iconhttps://www.xxx.com/favicon.ico//@description尽量取overtheworld!//@authorYou//@includehttp*://xx.com/*//@grantGM_addStyle//@run-atdocument-start//==/UserScript==具体说明请参考官方文档：https://www.tampermonkey.net/documentation.php?ext=dhdg&show=dhdg2修改样式的常见场景及相应操作这是最简单的屏蔽广告的方法，只要配置规则就可以了，它可以屏蔽80%以上的广告。以论坛广告为例。这个论坛的广告直接夹在帖子里，最下面还有个小字标明是广告，不小心点开了。而且帖子中间还有无关紧要的广告，非常影响体验。屏蔽这种广告很简单，写一个style规则，把它的display属性设置为none就可以了。.home-place-item{display:none!important;}如果它被覆盖，我们可以添加!important来提升权限。通过上面的cssselector+display属性可以屏蔽大部分广告。但是有些广告处理起来比较麻烦。例如，搜索引擎广告使用一些方法来“保护”。如果在搜索引擎上搜索“机票”，可以看到下面的广告信息。可以看出ad元素的style属性使用了权重最高的display和visibility这两个属性，所以上面的hidden方法肯定是无效的。所以只能选择其他方式，这里需要考验一下大家的css基础功底。隐藏元素的方法有哪些？下面是一个实现方法：[cmatchid]{height:0;overflow:hidden;}防止加载js文件还有一种广告不是静态元素呈现的，在页面上根本看不到，只有第一次点击某个功能时才会弹出时间。这种处理比较麻烦，因为直接修改元素可能会影响正常的功能使用。但是这种广告的事件绑定一般是单独写在某个js文件中的。仔细搜索，然后阻止加载相应的js文件，从根本上解决问题。浏览器其实为插件提供了防止资源加载的API，但是油猴并没有主动提供。后来在issue中发现了一个隐藏的API来实现这个功能。以https://xx.com下的拦截文件为例，可以参考脚本开头的webRequest函数：//@webRequest[{"selector":"https://xx.com/*""action":"cancel"}]更多只要你懂web前端，只要你肯去做，你的网页就能变成你想象中的样子。安装插件并自定义您的页面！示例脚本地址：https://github.com/yalishizhude/block-ad-scripts
