网站地图    收藏   

主页 > 前端 > javascript >

js 广告延迟加载代码(百度 Google 淘宝)

来源:自学PHP网    时间:2014-09-19 14:47 作者: 阅读:

[导读] 现在我们网站的广告有时太多了,会导入打开时有点卡了,解决办法就是利用广告延迟加载方法,下面我来给大家介绍我自己常用的广告延迟加载代码(百度 Google 淘宝),有需要了解的朋...

方法一,最简单的把广告放在最网页最后面,然后利用替换即可。

 代码如下 复制代码

//前面加载广告的地方代码:
<div id="dy_01">广告代码1调用ing(可以改成其他的第二世界整理发布话)</div>
<div id="dy_02">广告代码2调用ing(可以改成其他的话)</div>
//<div>可以用<span>代替

//放在最后面(如放在</body>上面)代码:
<div style="display:none;" id="div_dy_01">广告代码1</div>
<div style="display:none;" id="div_dy_02">广告代码2</div>
//style="display:none;"为防止页面底部出现空白,可有可无
<script>
document.getElementById("dy_01").innerHTML=document.getElementById("div_dy_01").innerHTML;document.getElementById("div_dy_01").innerHTML="";
</script>
<script>
document.getElementById("dy_02").innerHTML=document.getElementById("div_dy_02").innerHTML;document.getElementById("div_dy_02").innerHTML="";
</script>

如果我们要做得更高级有就可以使用jquery延时广告加载

 

 代码如下 复制代码

<!DOCTYPE html>
<html lang="zh-CN" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>jQuery 广告延迟加载 支持 百度 Google 淘宝 等广告</title>
<script type="text/javascript" src="/jquery.min.js"  media="all"></script>
<script type="text/javascript"  media="all">

;(function($){
 var ad = [], old = [document.write,document.writeln], run = false, load = false;
 
 var handle = function(){
  run = true;
  if ( !ad.length ) {
   run = false;
   return false;
  }
  var a = ad.shift(), s = [];
  
  // 执行 init
  a[2].apply();
  
  // 修改2个函数
  document.write = function(){
   var g = arguments, j = [], k, v;
   // 处理 里面带有的 js
   
   $.buildFragment( g, document, j );
   for( k in j ) {
    v = j[k];
    if( j[k].src ) {
     s.push( j[k].src );
    }
    if ( j[k].innerHTML ) {
     eval( j[k].innerHTML );
    }
   }
   // 遍历添加 值
   $.each( g,function( kk, vv ){
    $(a[0]).each(function() {
     this.innerHTML += vv;
    })
   });
  }
  document.writeln = function() {
   var g = [];
   $.each( arguments,function( k, v ){
    g[k] = v + "n";
   });
   document.write.apply( this, g );
  }
  
  
  // 执行函数
  forcall = function(){
   if ( !a[1].length ) {
    document.write = old[0];
    document.writeln = old[1];
    
    // 执行 complete
    a[3].apply();
    
    // 运行 下一个 ad
    handle.apply();
    
    return false;
   }
   
   
   var complete = function(){
    a[1] = s.concat( a[1] );
    s = [];
    forcall.apply();
   };
   var e = $('<script></script>').attr({ type: 'text/javascript', src: a[1].shift() })[0];
   if( e.readyState ) {
    e.onreadystatechange = function() {
     if( $.inArray( e.readyState, ['loaded', 'complete'] ) != -1 ) {
      complete.apply();
     }
    };
   } else {
    e.onload = function() {
     complete.apply();
    };
   }
            $('head')[0].appendChild(e);
   
   
  };
  
  // 回调
  forcall.apply();
  
  
 };
 $(function(){
  $(window).load(function(){
   load = true;
   // 执行 ad
   handle.apply();
  });
 });
 
 
 $.fn.extend({
  'ad':function( a, b, c ) {
   a = a || [];
   a = typeof( a ) == 'string' ? [a] : a;
   b = b || function(){};
   c = c || function(){};
   ad.push([this,a,b,c]);
   if ( !run && load ) {
    handle.apply();
   }
  }
 });
})(jQuery);
</script>
</head>
<body>

<h1>请自己修改广告id等 否则是不显示广告的</h1>
<div id="google"><h3>Google 的广告</h3><br/><br/></div>
<div id="baidu"><h3>Baidu 的广告</h3><br/><br/></div>
<div id="taobao"><h3>Taobao 的广告</h3><br/><br/></div>
<div id="sogou"><h3>Sogou 的广告</h3><br/><br/></div>


<script type="text/javascript">
$(function(){
    // Google 的
    $('#google').ad('http://pagead2.googlesyndication.com/pagead/show_ads.js', function(){
        google_ad_client = "pub-12312312312";
        google_ad_slot = "12312312";
        google_ad_width = 728;
        google_ad_height = 90;
    });

    // 百度的
    $('#baidu').ad('http://cpro.baidu.com/cpro/ui/c.js',function(){
        window.cpro_id = 'u123';
    });

    // 淘宝的
    $('#taobao').ad('http://a.alimama.cn/inf.js',function(){
        alimama_pid="mm_123_123_123";
        alimama_width=336;
        alimama_height=280;
    });
       
    // 搜狗的
    $('#sogou').ad('http://images.sohu.com/cs/jsfile/js/c.js',function(){
        window.sogou_ad_id=123;
        window.sogou_ad_height=60;
        window.sogou_ad_width=468;
    });

})
</script>


</body>
</html>

自学PHP网专注网站建设学习,PHP程序学习,平面设计学习,以及操作系统学习

京ICP备14009008号-1@版权所有www.zixuephp.com

网站声明:本站所有视频,教程都由网友上传,站长收集和分享给大家学习使用,如由牵扯版权问题请联系站长邮箱904561283@qq.com

添加评论