用JavaScript探测页面上的广告是否被AdBlock屏蔽了的方法

标签: 技术技巧 adblock 广告 | 发表时间:2014-11-03 03:03 | 作者:歪脖骇客
出处:http://www.webhek.com

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

火狐浏览器和谷歌浏览器里都有能够屏蔽页面给广告的插件,最有名的是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 页面 广告] 推荐:

用JavaScript探测页面上的广告是否被AdBlock屏蔽了的方法

- - Web骇客
看电视、看电影、看优酷、看网页时,对满天飞的广告也是深恶痛绝. 但是,对一个中小网站站长/博客主来说,广告几乎是唯一的能成支持网站/博客正常运转的资金来源. 如果一个博客主,只是无私发布稿件,能坚持几年的,很少. 火狐浏览器和谷歌浏览器里都有能够屏蔽页面给广告的插件,最有名的是AdBlock和AdBlock Plus.

Javascript高性能动画与页面渲染

- - 极客521 | 极客521
如果你不得不使用setTimeout或者setInterval来实现动画,那么原因只能是你需要精确的控制动画. 但我认为至少在现在这个时间点,高级浏览器、甚至手机浏览器的普及程度足够让你有理由有条件在实现动画时使用更高效的方式. 页面是每一帧变化都是系统绘制出来的(GPU或者CPU). 但这种绘制又和PC游戏的绘制不同,它的最高绘制频率受限于显示器的刷新频率(而非显卡),所以大多数情况下最高的绘制频率只能是每秒60帧(frame per second,以下用fps简称),对应于显示器的60Hz.

使用原生 JavaScript 在页面加载完成后处理多个函数

- - 我爱水煮鱼
网页中的 JavaScript 脚本运行是需要通过事件去触发的. 一般的做法就是在网页中,直接编写几个函数,有的在代码被加载的时候就被浏览器处理,或者使用类似下面的代码来触发实现函数的相关功能. 上面代码的意思就是,当鼠标点击 id 为 link 的元素的时候,就触发了它的 onclick 事件,然后执行使用 JavaScript 定义的 fun 函数.

javascript 获取滚动条高度+常用js页面宽度与高度

- - Web前端 - ITeye博客
javascript 获取滚动条高度+常用js页面宽度与高度 / ******************** * 取窗口滚动条高度 ****************** / function getScrollTop() {. return scrollTop; } / ******************** * 取窗口可视范围的高度 ******************* / function getClientHeight() {.

谷歌搜索广告大改版:右侧广告挪至页面顶部

- - 疯狂简报·MADBRIEF
谷歌最重要的收入来源,仍然是传统的电脑端搜索广告. 近日,谷歌对搜索广告进行了公司诞生以来最大规模的调整. 在电脑端搜索结果页面,谷歌取消了右侧的广告位,改为在结果页面顶部显示搜索广告,这可能是让广告更加惹人注意的举动. 据TheSEMPost等国外科技新闻网站报道,传统上,谷歌会在搜索结果页面的顶部、底部和右侧综合显示搜索广告,但是最重要的位置是右侧,这里会列出大量文字链接广告.

jQuery参考实例 1.2 在DOM加载完毕,页面元素完全加载之前运行jQuery/JavaScript代码

- - CSDN博客推荐文章
本文翻译自jQuery Cookbook (O’Reilly 2009) 1.2 Executing jQuery/JavaScript Code After the DOM Has Loaded but Before Complete Page Load. 主流的JavaScript应用程序一般只在DOM完全加载后才运行JS代码.

Javascript诞生记

- Milido - 阮一峰的网络日志
二周前,我谈了一点Javascript的历史. 今天把这部分补全,从历史的角度,说明Javascript到底是如何设计出来的. 只有了解这段历史,才能明白Javascript为什么是现在的样子. 我依据的资料,主要是Brendan Eich的自述. "1994年,网景公司(Netscape)发布了Navigator浏览器0.9版.

JavaScript,你懂的

- dylan - keakon的涂鸦馆
经常有人问我,JavaScript应该怎么学. 先学基本语法,如果曾学过C等语言,应该1小时内就能掌握了. 再去使用内置的函数、方法和DOM API,熟悉它能干什么;而在学习DOM API的过程中,你还不得不与HTML和CSS打交道. 然后弄懂匿名函数和闭包,学会至少一个常用的JavaScript库(例如jQuery).

Javascript 里跑Linux

- rockmaple - Shellex&#39;s Blog
牛逼到暴的大拿 Fabrice Bellard,用Javascript实现了一个x86 PC 模拟器,然后成功在这个模拟器里面跑Linux(请用Firefox 4 / Google Chrome 11打开,Chome 12有BUG). 关于这个东西… 伊说 “I did it for fun“,大大啊大大啊….

高效 JavaScript

- xtps - ITeye论坛最新讨论
传统上,网页中不会有大量的脚本,至少脚本很少会影响网页的性能. 但随着网页越来越像 Web 应用程序,脚本的效率对网页性能影响越来越大. 而且使用 Web 技术开发的应用程序现在越来越多,因此提高脚本的性能变得很重要. 对于桌面应用程序,通常使用编译器将源代码转换为二进制程序. 编译器可以花费大量时间优化最终二进制程序的效率.