javascript 廣告后加載,加載完頁(yè)面再加載廣告
先加載完頁(yè)面再加載廣告的原理:
網(wǎng)頁(yè)打開的順序都是按頁(yè)面從上到下的順序加載完成的,所以要想使廣告不影響頁(yè)面打開速度,就要等頁(yè)面全部打開完成后,再加載JS代碼。等頁(yè)面加載完再加載廣告其實(shí)就是將廣告的 JS 代碼放在頁(yè)面的底部,等頁(yè)面內(nèi)容打開完成后再加載到廣告代碼,再用頁(yè)面上預(yù)留好的的 DIV 輸出廣告。
使用方法:
1、將以下代碼放置頁(yè)面中想要放廣告的地方
<div id="myads">載入中…</div>
2、將一下代碼放置頁(yè)面底部,也就是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,這樣就實(shí)現(xiàn)了先加載完頁(yè)面再加載廣告了,怎么樣不影響大家閱讀吧.
上面的方法可以加載任何方式的廣告,但現(xiàn)在百度與google的都不讓使用了,容易造成廣告的二次加載,點(diǎn)擊率也會(huì)降低。下面腳本之家小編為大家分享下,比較新的加載廣告的方式:
1、可以加載字符串類型與google類型的
<div id="logo_m"></div>
<script>
function doad(datastr,id){
//getid(id).innerHTML = datastr; 這個(gè)是原生js的寫法
$("#"+id).html(datastr); //這個(gè)是jquery寫法
}
/*
上面的都是直接的字符串寫入,不能是js代碼
下面的代碼利用的是jquery的append加載google廣告不錯(cuò),百度的好像不能用。后加載百度的可以是用百度管家自帶的函數(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>");
});
一般都是頁(yè)面完全加載完,再加的廣告,當(dāng)然現(xiàn)在google現(xiàn)在新出的異步加載廣告的代碼也是挺快的,不會(huì)卡網(wǎng)頁(yè)了。
上面的都是后加載google的異步廣告代碼。
對(duì)于這樣的字符加載方法,個(gè)人不太喜歡,我還是比較喜歡這樣的,代碼如下
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>
- 又一個(gè)不錯(cuò)的js浮動(dòng)廣告代碼
- 用javascript實(shí)現(xiàn)的仿Flash廣告圖片輪換效果
- js退彈 IE關(guān)閉時(shí)彈出廣告代碼,可以防止屏蔽
- 兼容多瀏覽器的JS 浮動(dòng)廣告[推薦]
- js 居中漂浮廣告
- 兼容性非常好的js右下角與漂浮廣告代碼
- js網(wǎng)頁(yè)側(cè)邊隨頁(yè)面滾動(dòng)廣告效果實(shí)現(xiàn)
- js漂浮廣告實(shí)現(xiàn)代碼(合集經(jīng)典) 符合W3C
- JS實(shí)現(xiàn)懸浮移動(dòng)窗口(懸浮廣告)的特效
- Javascript 實(shí)現(xiàn)廣告后加載 可加載百度谷歌聯(lián)盟廣告
相關(guān)文章
溫習(xí)Javascript基礎(chǔ)語(yǔ)法之詞法結(jié)構(gòu)
javascript是一門簡(jiǎn)單的語(yǔ)言,也是一門復(fù)雜的語(yǔ)言。這篇文章主要介紹了溫習(xí)Javascript基礎(chǔ)語(yǔ)法之詞法結(jié)構(gòu)的相關(guān)資料,需要的朋友可以參考下2016-05-05
從表單校驗(yàn)看JavaScript策略模式的使用詳解
這篇文章主要介紹了從表單校驗(yàn)看JavaScript策略模式的使用,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2020-10-10
uniapp基礎(chǔ)篇之上傳圖片的實(shí)戰(zhàn)步驟
應(yīng)用uni-app開發(fā)跨平臺(tái)App項(xiàng)目時(shí),上傳圖片、文檔等資源功能需求十分常見,下面這篇文章主要給大家介紹了關(guān)于uniapp基礎(chǔ)篇之上傳圖片的相關(guān)資料,需要的朋友可以參考下2022-12-12
echarts實(shí)現(xiàn)雷達(dá)圖的詳細(xì)步驟
這篇文章主要給大家介紹了關(guān)于echarts實(shí)現(xiàn)雷達(dá)圖的詳細(xì)步驟,雷達(dá)圖(Radar?Chart)是一種信息豐富的可視化工具,其中多個(gè)變量(三個(gè)或更多)在二維平面上進(jìn)行比較,文中給出了完整的代碼示例,需要的朋友可以參考下2024-01-01
three.js如何實(shí)現(xiàn)3D動(dòng)態(tài)文字效果
這篇文章主要給大家介紹了關(guān)于three.js如何實(shí)現(xiàn)3D動(dòng)態(tài)文字效果的相關(guān)資料,文中通過示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友們下面隨著小編來(lái)一起學(xué)習(xí)學(xué)習(xí)吧2021-03-03
使用javascript實(shí)現(xiàn)簡(jiǎn)單的選項(xiàng)卡切換
本文主要介紹了使用javascript實(shí)現(xiàn)簡(jiǎn)單的選項(xiàng)卡切換的效果,代碼非常的簡(jiǎn)單,兼容性十分棒,這里推薦給小伙伴們。2015-01-01
javascript實(shí)現(xiàn)可改變滾動(dòng)方向的無(wú)縫滾動(dòng)實(shí)例
無(wú)縫滾動(dòng)在制作一些圖片展示的時(shí)候還是蠻有用的,下面與大家分享下javascript實(shí)現(xiàn)的可改變滾動(dòng)方向的無(wú)縫滾動(dòng),具體實(shí)現(xiàn)如下,感興趣的朋友可以參考下哈2013-06-06

