让广告代码不再影响你的网页加载速度

要不想让统计或广告之类的外部代码或页面拖慢网站的速度,就只能让他们在本站页面的所有内容下载完成之后再下载外部代码,而在此之前应该在网页指定的位置显示载入中或是用图片标示该位置有内容正在下载。


这样,要实现该功能的代码就分为三个部分:
一、在页面中提示载入中的代码;
二、页面所有内容之后,需要下载的外部代码;
三、外部代码下载之后,把代码置换到页面中指定位置的代码。(网建的那篇贴子就少了这部分代码,所以不成功)。


下面举例说明,相信大家举一反三,能很容易掌握。


在这个例子里,我们在外部代码载入前用/images/proimg.gif这个图片来提示正在下载内容。我们要调用的外部代码是某个广告代码。


首先看下演示:
1. http://travel.97079.com/html/heilongjiang/index.html
2. http://www.2ky.cn/index.html 中部广告

在网络条件比较好的时候,代码调用的速度较快,可能不太明显。但是在外部服务器出问题的时候,它的作用就显示出来了,防范于未然吧!

第一部分的代码为:

以下是代码片段:
<span id=ad_01><img src="/templets/images/proimg.gif"></span>
 
这部分很好懂,注意这里span的ID,在这里是ad_01。记下它,后面要用到。
这部分的代码应该是在页面中你为广告或统计预留的位置。


第二部分代码也很简单:

以下是代码片段:
<SPAN class=spanclass id=span_ad_01><script type="text/javascript"><!--
将你的广告代码完整粘贴到这里
//--></script>
</SPAN>

 

与上面一样,也要记下这里span的ID,在这里是span_ad_01,这个ID不能跟上面的ID相同。为了不让这部分外部代码拖慢你的网页显示速度,这部分应该放在页面所有正文的内容之后。事实上,完全可以把这部分代码放在</html>标签的外面,我在IE6下测试过。

第三部分代码比较重要,也稍微难记一些,是用来把后来载入的代码替换到页面内容中:
此代码为站长2007年6月更新,你可选择A或B任意一项。

A方法.仅支持IE浏览器的代码片段:
<SCRIPT>ad_01.innerHTML=span_ad_01.innerHTML;span_ad_01.innerHTML="";</SCRIPT>

B方法.支持IE和Firefox2个浏览器的代码片段(本站推荐):
<script language="javascript">document.getElementById("ad_01").innerHTML=document.getElementById("span_ad_01").innerHTML;
document.getElementById("span_ad_01").innerHTML="";</script>

这段代码有两句,第一句中=前是第一部分代码中指定的span的ID加.innerHTML,=后是第二部分代码中指定的span id加.innerHTML。第二句是将第二部分的spanid内容清空。


注意:这部分的代码要放在第二部分代码之后,最好紧跟在第二部分代码的后面。
三部分代码添加之后,再看下你的网站,再也不会因为要调用外部代码拖慢网页的显示速度了。

posted @ 2007-09-13 19:08  jay-c  阅读(276)  评论(0)    收藏  举报