怎么对页面中javascript进行优化

发布时间:2022-03-24 16:17:04 作者:iii
来源:亿速云 阅读:88

今天小编给大家分享一下怎么对页面中javascript进行优化的相关知识点,内容详细,逻辑清晰,相信大部分人都还太了解这方面的知识,所以分享这篇文章给大家参考一下,希望大家阅读完这篇文章后有所收获,下面我们一起来了解一下吧。

       1. JavaScript简介
       不管是对于普通用户还是搜索引擎,JavaScript都是极不友好的,目前大部分搜索引擎是不解析JavaScript生成内容(即JavaScript生成的内容对于搜索引擎来说是不可见的),在规划页面时要尽量避免使用JavaScript。 
       目前为止,搜索引擎并不解析JavaScript生成的页面或者内容。 
       JavaScript代码冗长,执行效率远低于HTML,导致打开页面时间过长。 
       2. JavaScript优化

在搜索引擎优化里,JavaScript优化并非为了提高JavaScript代码的执行效率,而是为了避免JavaScript代码占用页面空间及重要位置。为此,只需改变JavaScript代码出现的位置及调用方式即可。另外,JavaScript优化的另一个目的就是利用JavaScript对于搜索引擎不可见的特性,调用那些不想让搜索引擎抓取的内容3,例如Flash等。 
       利用JavaScript内容对搜索引擎的不可见性,我们可以用JavaScript生成一些只面对用户可见的内容。 
       3. JavaScript调用方式
        JavaScript的调用分为内部调用和外部调用两种,其中内部调用又分为头部调用和底部调用。 
       头部调用 
       头部调用就是把JavaScript代码放到页面的头部。但巨量的JavaScript代码放到页面的头部不但会增加页面体积,还会占用页面顶部重要的位置,使得页面中相对重要的内容不能优先向搜索引擎展示,如下代码所示:
<html>     
       <head>   
         <TITLE>南昌网站建设公司|南昌APP开发公司|亿速云</TITLE>    
        <meta name="description" content="创始于2006年,专业专注于APP开发,网站建设!">   
         <meta name="keywords" content="亿速云-www.jxbh.cn">     
       <LINK href="/templets/img/css.css" type=text/css rel=stylesheet>         
       <script language="javascript" type="text/javascript">
       <!--             var FRIENDLY_URLS='true';            
        function sortFocus(obj){                
               if(isIE){                     
              obj.value ='';                 
       }                 
       else{                     
              o=new Option('','-1');                     
              obj.options.add(o);                     
              obj.value ='-1';                
        }            
        }             
       function sortBlur(obj, value){                
        if(isIE){                     
       obj.value ='value';                
        }             
       }
//--></script>            
        <!--[if IE 6]><script>            
        document.execCommand("BackgroundImageCache", false, true);         
       </script>    
        </head> </html>
底部调用
        底部调用就是把JavaScript代码放在页面的底部(即</body>标签之前)。这样就不会占用页面顶部重要的位置,但还是会占用页面空间,加大页面体积,如下代码所示: 
       <script language="javascript"    type="text/javascript">
       <!--     var FRIENDLY_URLS='true';    
        function sortFocus(obj){       
                if(isIE){            
               obj.value ='';         
       }        
        else{            
               o=new Option('','-1');            
               obj.options.add(o);             
              obj.value ='-1';         
       }    
        }     
       function sortBlur(obj, value){        
               if(isIE){            
               obj.value ='value';         
       }     
       }
//--></script>     
       <!--[if IE 6]><script>     
       document.execCommand("BackgroundImageCache", false, true); </script> 
       外部调用 
       外部调用就是把JavaScript内容存放到一个JavaScript文件里,再在页面中进行调用。这样做既不占用页面重要的位置,又可以精简大量代码,加快页面显示的速度,如下代码所示。 
       <head>   
         <TITLE>亿速云</TITLE>    
        <meta name="description" content="创始于2006年,专业专注于APP开发,网站建设!">   
         <meta name="keywords" content="亿速云-www.jxbh.cn">     
       <script language="JavaScript" src="/include/login.js"></script>

以上就是“怎么对页面中javascript进行优化”这篇文章的所有内容,感谢各位的阅读!相信大家阅读完这篇文章都有很大的收获,小编每天都会为大家更新不同的知识,如果还想学习更多的知识,请关注亿速云行业资讯频道。

推荐阅读:
  1. 如何对JavaScript的性能进行优化?
  2. 如何对Nginx服务进行优化

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

javascript

上一篇:javascript中鼠标按钮事件判断怎么实现

下一篇:javascript中常见的焦点事件有哪些

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》