让广告代码不再影响网页加载速度
作者： 来源： 日期：2009/6/24 23:35:28 人气：
标签：
第一步：把这段代码放在你要放广告的网页位置：以下是代码片段：<SPANid=ad_01>广告载入中...</SPAN>第二步：把这段代码放到页底:<SPANclass=spanclassid=span_ad_01>这里放广告的JS代码或其他加载速度比较慢的内容都…
第一步：把这段代码放在你要放广告的网页位置：
以下是代码片段：<SPAN id=ad_01>广告载入中...</SPAN>
第二步：把这段代码放到页底:
<SPAN class=spanclass id=span_ad_01>
这里放广告的JS代码或其他加载速度比较慢的内容都可以.
</SPAN>
<SCRIPT>ad_01.innerHTML=span_ad_01.innerHTML;span_ad_01.innerHTML="";</SCRIPT>
|
程序代码
在同一页面有多个广告需要调用时，您只要修改代码中的红色部分，令每个广告的ID不同即可。
以下是引用片段：
…………
<SPAN id=ad_01>广告载入中...</SPAN>
…………
<SPAN id=ad_02>广告载入中...</SPAN>
…………
<SPAN class=spanclass id=span_ad_01>
/***** 广告内容一 *****/
</SPAN>
<SCRIPT>ad_01.innerHTML=span_ad_01.innerHTML;span_ad_01.innerHTML="";</SCRIPT>
<SPAN class=spanclass id=span_ad_02>
/***** 广告内容二 *****/
</SPAN>
<SCRIPT>ad_02.innerHTML=span_ad_02.innerHTML;span_ad_02.innerHTML="";</SCRIPT>
|
原理知其然，也要知其所以然，为什么上述代码会加快速度呢？
其实很简单，我们利用一个<span>标签取代了<table>与</table>中的广告代码。由于这个<span>标签只是十来个字节的普通HTML本地代码，不会影响网页下载的速度。等整个表格下载完后，网站的内容已经显示出来了。再利用另一个<span>标签包住广告代码，等广告内容下载完成后，再利用JavaScript把下面包有广告内容的<span>标签中的内容，传递给上面那个取代原广告条位置<span>里面。再把下面的<span>内容清空。这样一来，“先显示网站内容再显示广告内容”就不会让网页速度减慢了。