javascript 廣告后加載,加載完頁面再加載廣告
先加載完頁面再加載廣告的原理:
網(wǎng)頁打開的順序都是按頁面從上到下的順序加載完成的,所以要想使廣告不影響頁面打開速度,就要等頁面全部打開完成后,再加載JS代碼。等頁面加載完再加載廣告其實就是將廣告的 JS 代碼放在頁面的底部,等頁面內(nèi)容打開完成后再加載到廣告代碼,再用頁面上預(yù)留好的的 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,這樣就實現(xiàn)了先加載完頁面再加載廣告了,怎么樣不影響大家閱讀吧.
上面的方法可以加載任何方式的廣告,但現(xiàn)在百度與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廣告不錯,百度的好像不能用。后加載百度的可以是用百度管家自帶的函數(shù)。 */ function doad2(datastr,id){ $("#"+id).append(datastr); } var logo_m='<a target="_blank"><img src="http://img.jbzj.com/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>"+ "<!-- question-side -->"+ "<ins class=\"adsbygoogle\""+ " style=\"display:inline-block;width:728px;height:90px\""+ " data-ad-client=\"ca-pub-345345345345\""+ " data-ad-slot=\"345345345\"></ins>"+ "<script>"+ " (adsbygoogle = window.adsbygoogle || []).push({});"+ "<\/script>"); });
一般都是頁面完全加載完,再加的廣告,當然現(xiàn)在google現(xiàn)在新出的異步加載廣告的代碼也是挺快的,不會卡網(wǎng)頁了。
上面的都是后加載google的異步廣告代碼。
對于這樣的字符加載方法,個人不太喜歡,我還是比較喜歡這樣的,代碼如下
var botad='<script async src="http://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>'; botad+='<ins class="adsbygoogle" style="display:inline-block;width:336px;height:280px" 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、可以加載百度廣告聯(lián)盟的代碼
百度管家自帶的后加載廣告的代碼,基于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>
相關(guān)文章
詳解JavaScript中關(guān)于this指向的4種情況
這篇文章主要介紹了JavaScript中關(guān)于this指向的4種情況,文中通過示例代碼介紹的非常詳細,對大家的學習或者工作具有一定的參考學習價值,需要的朋友們下面隨著小編來一起學習學習吧2019-04-04javascript HTML5文件上傳FileReader API
這篇文章主要介紹了javascript HTML5文件上傳FileReader API的相關(guān)資料,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下2016-04-04JavaScript實現(xiàn)鼠標滾輪控制頁面圖片切換功能示例
這篇文章主要介紹了JavaScript實現(xiàn)鼠標滾輪控制頁面圖片切換功能,涉及javascript事件響應(yīng)及頁面元素動態(tài)操作相關(guān)實現(xiàn)技巧,需要的朋友可以參考下2017-10-10