Maison > interface Web > js tutoriel > le corps du texte

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

WBOY
Libérer: 2016-05-16 17:30:45
original
1502 Les gens l'ont consulté

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

其实,像这样对网页来说不是非常重要的功能,我们大可以用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>
           
           
       
       

       
   
Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal