提高页面载入速度(广告版)

网络博客 郑永 7558℃ 14评论 单栏模式

昨天刚刚写完获取腾讯微博信息到wordpress(含免插件版),放到侧边栏发现还是影响速度,因为我不喜欢用缓存版的,于是想起当年我的网站载入广告的方法,其实很多大型网站都是用这个方法来提高网站的页面载入速度,每次修改代码,我总会用不同的浏览器打开看看效果,结果发现在firefox下出问题,查找了一下Innerhtml用法,才发现原来问题是代码没有正规写好,没有正规的代码在iE和google浏览器下均正常显示,火狐狸浏览器之所以不兼容,是为了要求代码员能规范代码。本站使用这个加载腾讯的微博信息,具体效果可以看本站侧边。

下面我们来解决Firefox不支持Js的InnerHtml,让Firefox支持InnerHtml,错误的代码如下(很多网站可能都还没注意到):

插入位置代码:<span id="txwb">广告载入中。。</span>

网页底部执行代码:

<span id="span_txwb">
广告代码
</span>
<script type="text/javascript">
myads.innerHTML=span_myads.innerHTML;
span_myads.innerHTML="";
</script>

把上面的:
myads.innerHTML=span_myads.innerHTML;
span_myads.innerHTML="";

替换成下面的就可以了:
document.getElementById("txwb").innerHTML=document.getElementById("span_txwb").innerHTML;
document.getElementById("span_txwb").innerHTML="";

正确的完整代码写法是:

插入位置代码:<span id="txwb">腾讯微博载入中。。</span>

网页底部执行代码:

<span id="span_txwb">
广告代码
</span>
<script type="text/javascript">
document.getElementById("txwb").innerHTML=document.getElementById("span_txwb").innerHTML;
document.getElementById("span_txwb").innerHTML="";
</script>

好了,解决了firefox的InnerHtml这个问题,大家可以尽情的加入广告了,上面的代码完全可以多加几个span来显示不同的广告,不过可别加载太多广告,因为页面终究是要执行那些代码的,这样做的好处是,让页面载入的时候可以完全显示,而不会卡在那里,影响阅读。

转载请注明:郑永博客 » 提高页面载入速度(广告版)

历史上的今天:

(14)个小伙伴在吐槽
Loading...
  1. mice2011-02-12 02:37 GreenBrowser Windows XP 回复

    不知道 是谁发明的这种伪延迟加载js..
    就算你把那个放js的span的display属性设置为none,
    其实js还是在那里执行了,
    这种所谓的延迟加载,只是一种障眼法而已..

    沙发!
    • 郑 永2011-02-13 04:37 Google Chrome 9 Windows XP 回复

      只要能让侧边栏早点出来,就好了,呵呵 :) 加载那是肯定要的。

  2. 死大葱2011-02-12 02:18 Google Chrome 9 Windows XP 回复

    对这我不懂,底部指的是哪里呢?如果一个侧边栏放多个怎么办?>

    板凳!
    • 郑 永2011-02-13 04:38 Google Chrome 9 Windows XP 回复

      也可以多方啊,只要定义一下 ad1 ad2 ad3 等等。

  3. 死大葱2011-02-12 03:43 Google Chrome 9 Windows XP 回复

    现在有问题困扰着我,我只想在首页放置广告,但是由于网页底部执行代码加在了模版的footer.php里所以内页也是有广告显示在页底,这个咋办,主要是不想再内页放置广告

    地板!
    • 郑 永2011-02-13 04:36 Google Chrome 9 Windows XP 回复

      可以用判断语句。

    • 死大葱2011-02-13 12:03 Google Chrome 9 Windows XP 回复

      首页的知道在哪里加了,但是内页不知道.咱什么也不懂..

  4. 竹下无为梦2011-02-12 13:43 Firefox 3 Windows XP 回复

    这个可以用。

    4楼
    • 郑 永2011-02-13 04:36 Google Chrome 9 Windows XP 回复

      呵呵,能用就好,之前评论被屏蔽,所以。。。回复迟了。

    • 郑 永2011-02-13 04:40 Google Chrome 9 Windows XP 回复

      你这头像严重影响了市貌~~ 汗。换个有图片吧,哈哈。

  5. 万戈2011-02-14 07:17 Firefox 3 Windows 7 回复

    InnerHtml和language=”javascript”一样,是种不合格的写法,应该被淘汰

    5楼
    • 郑 永2011-02-14 12:45 Firefox 4 Windows XP 回复

      是啊,对你们代码狂的应该多注意了,哈哈。

  6. 林木木2011-12-06 06:13 Google Chrome 12 Windows XP 回复

    这样真好,不会卡着了。

    6楼
gravatar
发表我的评论
取消评论


Hi,请填写昵称和邮箱!

  • 昵称 (必填)
  • 邮箱 (必填)
  • 网址