JavaScript实现检查页面上的广告是否被AdBlock屏蔽了的方法


Posted in Javascript onNovember 03, 2014

每个人都讨厌广告。看电视、看电影、看优酷、看网页时,对满天飞的广告也是深恶痛绝。广告是一个不招人喜欢的东西。但是,对一个中小网站站长/博客主来说,广告几乎是唯一的能成支持网站/博客正常运转的资金来源。如果一个博客主,只是无私发布稿件,能坚持几年的,很少。大多数慢慢失去了热情。

火狐浏览器和谷歌浏览器里都有能够屏蔽页面给广告的插件,最有名的是AdBlock和AdBlock Plus。前几天,我做一个统计,看看浏览网站的用户中有多少人使用了AdBlock插件,发现这个数目竟然有总浏览人数的1/5。

1/5是一个不小的数目。如何能让广告位在这1/5的使用了AdBlock插件的用户的页面上用其它图片代替呢?要想做到这一点,首先是要有个办法知道当前浏览器中使用了AdBlock插件。经过一些测试,我发现,AdBlock对“Ad”或“Google AD”这样的词非常敏感,只要是某个页面元素的ID或css class名中有“Ad”字样的,这个元素基本上都会被AdBlock插件屏蔽掉,也就是 display:none:

<div class='google-ad testAd'> 这个div将会被屏蔽掉 </div>

有了这个规律,我就能够使用JavaScript发现当前浏览器是否开启了AdBlock插件。首先,我们将Google广告代码放到一个div里,并且将div的css class name里放入一个很明显的表示google AD的类名:

<div class='google-ad testAd'> 这里放置Google广告代码</div>

然后在页面的底部用Js检测,:

if ($('.google-ad').height() == 0) showOtherImage();

这里还有一个问题,Google的广告通常是指Dom加载完毕后显示的,为了保证在Google广告加载完成后再进行探测,要给js代码加入延迟执行特征,这样避免了误检测:

$(function(){

   setTimeout(function(){

  if ($('.google-ad').height() == 0)

   showOtherImage();

  },3000);

});

这里的showOtherImage();方法里我们能做些什么呢?我们可以放一些京东、当当、亚马逊会其它网站的促销图片和链接,通过获取佣金,多少算是对损失的一点弥补。

Javascript 相关文章推荐
Jquery Ajax学习实例7 Ajax所有过程事件分析示例
Mar 23 Javascript
Jquery在指定DIV加载HTML示例代码
Feb 17 Javascript
使用jquery获取url以及jquery获取url参数的实现方法
May 25 Javascript
AngularJS中的DOM操作用法分析
Nov 04 Javascript
js仿微信语音播放实现思路
Dec 12 Javascript
node.js基于mongodb的搜索分页示例
Jan 22 Javascript
解决微信内置浏览器返回上一页强制刷新问题方法
Feb 05 Javascript
jQuery实用密码强度检测
Mar 02 Javascript
JavaScript装饰器函数(Decorator)实例详解
Mar 30 Javascript
JS的函数调用栈stack size的计算方法
Jun 24 Javascript
详解如何给React-Router添加路由页面切换时的过渡动画
Apr 25 Javascript
electron 安装,调试,打包的具体使用
Nov 06 Javascript
网页中表单按回车就自动提交的问题的解决方案
Nov 03 #Javascript
详解jquery中$.ajax方法提交表单
Nov 03 #Javascript
jquery处理json对象
Nov 03 #Javascript
js格式化时间小结
Nov 03 #Javascript
解决js下referer兼容各大浏览器的方法
Nov 03 #Javascript
jQuery修改li下的样式以及li下的img的src的值的方法
Nov 02 #Javascript
jQuery中ajax和post处理json的不同示例对比
Nov 02 #Javascript
You might like
PHP与C#分别格式化文件大小的代码
2011/05/14 PHP
smarty获得当前url的方法分享
2014/02/14 PHP
JavaScript 放大镜 放大倍率和视窗尺寸
2011/05/09 Javascript
JQuery扩展插件Validate 3通过参数设置错误信息
2011/09/05 Javascript
为EasyUI的Tab标签添加右键菜单的方法
2012/07/14 Javascript
jQuery 关于伪类选择符的使用说明
2013/04/24 Javascript
Javascript 鼠标移动上去 滑块跟随效果代码分享
2013/11/23 Javascript
谷歌地图打不开的解决办法
2014/08/07 Javascript
轻松创建nodejs服务器(10):处理上传图片
2014/12/18 NodeJs
基于javascript显示当前时间以及倒计时功能
2016/03/18 Javascript
Javascript 跨域知识详细介绍
2016/10/30 Javascript
浅谈vue 单文件探索
2018/09/05 Javascript
vue.js循环radio的实例
2019/11/07 Javascript
js判断在哪个浏览器打开项目的方法
2020/01/21 Javascript
[01:00:54]TI4正赛第二日开场
2014/07/20 DOTA
9种python web 程序的部署方式小结
2014/06/30 Python
Python中用pycurl监控http响应时间脚本分享
2015/02/02 Python
使用Python绘制图表大全总结
2017/02/11 Python
python enumerate函数的使用方法总结
2017/11/15 Python
mac PyCharm添加Python解释器及添加package路径的方法
2018/10/29 Python
Python3网络爬虫开发实战之极验滑动验证码的识别
2019/08/02 Python
opencv python Canny边缘提取实现过程解析
2020/02/03 Python
python 已知平行四边形三个点,求第四个点的案例
2020/04/12 Python
python小程序之4名牌手洗牌发牌问题解析
2020/05/15 Python
python使用matplotlib的savefig保存时图片保存不完整的问题
2021/01/08 Python
Canvas制作旋转的太极的示例
2018/03/09 HTML / CSS
Uber Eats台湾:寻找附近提供送餐服务的餐厅
2018/05/07 全球购物
北京RT科技有限公司.net工程师面试题
2013/02/15 面试题
超市促销实习自我鉴定
2013/09/23 职场文书
领导证婚人证婚词
2014/01/13 职场文书
护士岗位求职应聘自荐书范文
2014/02/12 职场文书
蓝颜请假条
2014/04/11 职场文书
心理咨询专业自荐信
2014/07/07 职场文书
2019销售早会主持词
2019/06/27 职场文书
小学生作文写作技巧100例,非常实用!
2019/07/08 职场文书
python面向对象版学生信息管理系统
2021/06/24 Python