javascript 广告后加载,加载完页面再加载广告_Javascript教程-查字典教程网
javascript 广告后加载,加载完页面再加载广告
javascript 广告后加载,加载完页面再加载广告
发布时间:2016-12-30 来源:查字典编辑
摘要:先加载完页面再加载广告的原理:网页打开的顺序都是按页面从上到下的顺序加载完成的,所以要想使广告不影响页面打开速度,就要等页面全部打开完成后,...

先加载完页面再加载广告的原理:

网页打开的顺序都是按页面从上到下的顺序加载完成的,所以要想使广告不影响页面打开速度,就要等页面全部打开完成后,再加载JS代码。等页面加载完再加载广告其实就是将广告的 JS 代码放在页面的底部,等页面内容打开完成后再加载到广告代码,再用页面上预留好的的 DIV 输出广告。

使用方法:

1、将以下代码放置页面中想要放广告的地方

复制代码 代码如下:

<div id="myads">载入中…</div>

2、将一下代码放置页面底部,也就是footer,php文件的底部。

复制代码 代码如下:

<div id="span_myads">这里放广告代码</div>

<script type="text/javascript">

document.getElementById("myads").innerHTML = document.getElementById("span_myads").innerHTML;

document.getElementById("span_myads").innerHTML = "";

</script>

OK,这样就实现了先加载完页面再加载广告了,怎么样不影响大家阅读吧.

上面的方法可以加载任何方式的广告,但现在百度与google的都不让使用了,容易造成广告的二次加载,点击率也会降低。下面查字典教程网小编为大家分享下,比较新的加载广告的方式:

1、可以加载字符串类型与google类型的

<div id="logo_m"></div> <script> function doad(datastr,id){ //getid(id).innerHTML = datastr; 这个是原生js的写法 $("#"+id).html(datastr); //这个是jquery写法 } /* 上面的都是直接的字符串写入,不能是js代码 下面的代码利用的是jquery的append加载google广告不错,百度的好像不能用。后加载百度的可以是用百度管家自带的函数。 */ function doad2(datastr,id){ $("#"+id).append(datastr); } var logo_m='<a href="http://www.danhw.com/" target="_blank"><img src="http://files.jb51.net/image/kongbao_370.gif" width=370 height=60 /></a>'; doad(logo_m,'logo_m'); </script>

2、可以加载google广告的代码

$(document).ready(function(){ $('#google_ads_1').append("" + "<script src="//pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>"+ "<>"+ "<ins"+ " "+ " data-ad-client="ca-pub-345345345345""+ " data-ad-slot="345345345"></ins>"+ "<script>"+ " (adsbygoogle = window.adsbygoogle || []).push({});"+ "</script>"); });

一般都是页面完全加载完,再加的广告,当然现在google现在新出的异步加载广告的代码也是挺快的,不会卡网页了。

上面的都是后加载google的异步广告代码。

对于这样的字符加载方法,个人不太喜欢,我还是比较喜欢这样的,代码如下

var botad='<script async src="http://www.jb51.net/pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>'; botad+='<ins data-ad-client="ca-pub-343534534" data-ad-slot="6343459"></ins><script>(adsbygoogle = window.adsbygoogle || []).push({});</script>'; $(document).ready(function(){ $('#google_ads_1').append(); });

3、可以加载百度广告联盟的代码

百度管家自带的后加载广告的代码,基于jquery

<div id="tonglanbd"></div> <script type="text/javascript"> $.getScript("http://cbjs.baidu.com/js/m.js", function() { BAIDU_CLB_fillSlotAsync("广告id,不能带u","tonglanbd"); }); </script>

相关阅读
推荐文章
猜你喜欢
附近的人在看
推荐阅读
拓展阅读
  • 大家都在看
  • 小编推荐
  • 猜你喜欢
  • 最新Javascript教程学习
    热门Javascript教程学习
    编程开发子分类