Home  >  Article  >  Web Front-end  >  利用JS延迟加载百度分享代码,提高网页速度_javascript技巧

利用JS延迟加载百度分享代码,提高网页速度_javascript技巧

WBOY
WBOYOriginal
2016-05-16 17:30:451438browse

发现很多网站在放置百度分享代码的时候,简单的将分享代码放置到固定的网页位置就完事了,这是非常致命的方式。因为,我经常打开一个网页的时候,发现在网页加载到分享代码的时候,有时候花上几秒的时候来请求百度的服务器,最后展示分享按钮。

其实,像这样对网页来说不是非常重要的功能,我们大可以用JS来延迟加载,从而提高网页主要内容的快速加载显示。
这里分享下我的放置方式。
一、copy百度分享代码,如下:

复制代码 代码如下:
















二、放置代码
认真分析上面的分享代码,我们可以发现,其中有3个js脚本标签,这些都是有可能影响网页呈现速度的,最后发现,其实,只有最后一个<script>标签的作用是请求百度服务器,展示分享图片和链接。那么,这条JS我们大可放到最后加载。<BR><STRONG>下面是我做的一个demo:<BR><div class="codetitle"><span><a style="CURSOR: pointer" data="25629" class="copybut" id="copybut25629" onclick="doCopy('code25629')"><U>复制代码 代码如下:<div class="codebody" id="code25629"><BR><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <BR><html> <BR> <head> <BR> <title>JS延迟加载百度分享代码,提高网页速度 <BR> <meta http-equiv="Content-Type" content="text/html;charset=gb2312" /> <BR> <style type="text/css"> <BR> body{margin:0px;padding:0px;font-size:12px;} <BR> #copyright{clear:both;} <BR> <BR> <br><br> <body> <BR> <div id="baidu-share"> <BR> <!-- Baidu Button BEGIN --><BR> <div id="bdshare" class="bdshare_t bds_tools_32 get-codes-bdshare"> <BR> <a class="bds_tsina"> <BR> <a class="bds_qzone"> <BR> <a class="bds_tqq"> <BR> <a class="bds_renren"> <BR> <a class="bds_douban"> <BR> <span class="bds_more"> <BR> <a class="shareCount"> <BR> <BR> <script type="text/javascript" id="bdshare_js" data="type=tools&uid=0" ></script>
           
           
       
       

       
   
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn