在自己博客上放廣告聯盟的廣告也是一種收入來源。就我個人知道的有谷歌廣告、阿里媽媽、百度、網易游戲，還有個臺灣的BloggerAds，是從無限博客那得知的。然而放入廣告后會對網頁打開速度有一些影響，有一個致命的問題。比如你把廣告放在了網頁頂部或靠上的位置，如果不做處理的話，那要等到這個廣告加載完之后才能顯示下面的正文內容。如果這個廣告加載速度很慢，那這段時間下面的正文就會空白一片。用戶體驗非常不好。

前端組在這里提供解決方案，有需要的朋友認真看看下面的代碼，相信會對你的博客有好處。

方法一：

使用onload事件，某些廣告不支持這個方法，如BloggerAds。Google廣告是支持的。BloggerAds請看第二種方法。

HTML(代碼放在廣告位置)

<div id="sidebarAdBox"> <p>廣告正在努力加載中...</p> <textarea id="sidebarAd" style="display:none;"> 注意：此處放廣告聯盟提供的廣告代碼 </textarea> </div>

JS(放在頁面最后面)

1 var sidebarAdBox = document.getElementById('sidebarAdBox'); 2 var sidebarAd = document.getElementById('sidebarAd'); 3 window.onload = function(){ 4 sidebarAdBox.innerHTML = sidebarAd.value; 5 };

方法二：

原理是把廣告代碼放到頁面底部，則就是差不多最后加載了。先把生成的廣告隱藏，再把它拿到自己相應的位置，再顯示出來，OK！

HTML 1 (代碼放在廣告位置)

1 <div id="sidebarAdBox"> 2 <p>廣告正在努力加載中...</p> 3 </div>

HTML 2 (代碼要放在頁面最后面)

1 <div id="sidebarAd"> 2 注意：此處放廣告聯盟提供的廣告代碼 3 </div>

jQuery代碼(放在頁面最后面)（原生態JS代碼暫不提供，麻煩..）

1 var $sidebarAdBox = $('#sidebarAdBox'); 2 $('#sidebarAd').appendTo($sidebarAdBox).show(); 3 $sidebarAdBox.find('p').remove();

轉載于:https://www.cnblogs.com/qianduanzu/archive/2012/05/02/2478490.html

總結

以上是生活随笔為你收集整理的广告影响网站打开速度解决方案的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。