隨筆-7  評論-24  文章-102  trackbacks-0

          1、Script的 defer屬性
          2、為body添加腳本
          3、CDATA小節
          4、null和undefined變量
          5、縮減JavaScript代碼



          1、Script的 defer屬性

               如果將defer屬性設置為"defer",那么表示該腳本不會生成任何文檔內容,于是瀏覽器可以提前處理頁面的剩余部分,在頁面處理結束并做好顯示準備時才處理腳本部分。defer屬性可以提高頁面載入的速度,特別是那些引用了大量的JavaScript代碼或者龐大的JavaScript程序庫的頁面。

          <script type="text/javascript" defer="defer"> 
           no content being generated  
          </script> 



          2、為body添加腳本

               前面我們曾經說過,因為對script元素進行集中管理有利于網頁的可維護性,所以script元素通常將添加在網頁上的head元素中。然而,在body元素中添加腳本的原因往往是出于性能的考慮。

               因為瀏覽器從同一個域名并發載入的資源是有限制的,所以,當把腳本添加到head元素中時,首先載入的將是腳本,其次才是文檔的剩余部分。此外,瀏覽器可能會延遲頁面剩余部分的顯示,因為腳本中可能會調用document.write方法修改document對象。如果JavaScript文件很龐大,那么網頁中的圖片以及其他重要的信息將會被延遲顯示,這所帶來的問題遠比可維護性更加重要。

               即使在script元素中使用defer屬性也不一定能完全解決該問題,特別是并發資源訪問和頁面顯示的限制。
           
               在High Performance Web Sites(中譯版《高性能網站建設指南》一書中,作者推薦將script元素放在文檔的最末尾處,這樣網頁的其他部分就可以優先載入。大多數復雜網站的開發人員更傾向于這種方法。這種方法帶來的負面影響是腳本不容易查找,網頁的可維護性也較差。
           
               那么什么才是最佳方法呢?我發現大多數網站并不引用龐大的JavaScript程序庫,在保證較好性能的前提下,將腳本放在head元素中,也確保網頁可維護性的優勢。不過,如果的確需要使用龐大的JavaScript程序庫,那么可以考慮將腳本放在頁面的最末尾處。 

               不論采用何種方法,請確保腳本位置的一致性,要么全部放在head元素中,要么全部在body元素的最末尾處。

          3、CDATA小節
           
          <script type="text/javascript">  
          //<![CDATA[   

          function hello() {
             
          var msg = "Hello, <em>World!</em>";
             document.open();
             document.write(msg);
             document.close();
          }

          //]]>
          </script> 

               之所以使用CDATA小節,是因為XHTML處理器在解釋標記型語言時會識別出所有的開始標簽和結束標簽。
           
               在頁面文件中通過script元素的src屬性引用的JavaScript,是XHTML標準所兼容的,并且不要求使用CDATA小節。如果是嵌入的JavaScript代碼,那么就需要使用CDATA小節,特別是包含在body元素中的代碼。對于大多數瀏覽器而言,還需要用JavaScript注釋符(//)來隱藏CDATA小節,如示例1.3所示,否則將會出現JavaScript錯誤。
           
               當然,保持頁面整潔的最佳方式是將JavaScript代碼從頁面中徹底移去,改成使用鏈接JavaScript文件的方式。

               在本書的大多數示例中,JavaScript代碼是直接嵌入在頁面里的,這樣可以提高代碼的可讀性且易于檢查。然而,Mozilla推薦將所有嵌入的JavaScript代碼都從頁面中移去,放在獨立的JavaScript文件中。使用獨立的JavaScript文件,可以避免校驗以及文本解釋錯誤等問題,而不用擔心頁面是以HTML還是XHTML的方式進行處理。

          提示
               使用JavaScript文件往往也能提高網頁載入的效率,因為瀏覽器會在第一次載入文件的時候進行緩存,引用相同文件時則會從緩存中獲取。



          4、null和undefined變量

          null變量是已定義的、值為null的變量。以下是一個null變量的示例:
          var nullString = null;

          如果變量已經聲明但是還沒有初始化,那么就是undefined變量:
          var undefString;

          如果聲明了變量并且賦予了初始值,那么該變量就不是null或undefined:
          var sValue = ""; 

               當你使用JavaScript程序庫時,或者在一些復雜的代碼中,某些變量有可能還沒有初始化;如果嘗試在表達式中使用這樣的變量,那么就有可能得到出乎意料的結果,通常會導致JavaScript錯誤。如果不確定變量的狀態,那么可以在條件表達式中測試該變量,例如: 
          if (sValue) ...     // 如果變量是null或undefined,那么結果為true,否則是false 

               在第3章中將詳細介紹條件語句,現在你只需要知道該表達式會判斷變量sValue是否已經聲明并初始化,如果已聲明并初始化則該表達式的值為true,否則,該表達式的值為false。
          if (unknownVariable)     // false,變量沒有聲明或賦值  
          if (undefinedString)     // false,變量沒有賦值  
          if (nullString)           // false,變量已經聲明并且賦值,但是所賦的值是null  
          if (sValue)                // true,變量已經聲明并且賦值(包括空字符串) 使用null關鍵字,可以判斷數值是否為null:

          if (sValue == null) 
               在JavaScript中,即使變量已經聲明,但只要還沒有初始化就是undefined變量。如果變量已經聲明并初始化,那么變量就不是null或undefined。然而,在該示例中它是一個全局變量,正如之前的章節所述,沒有以var關鍵字聲明的變量可能會引起各種各樣的問題。

           

          5、縮減JavaScript代碼

               空格能夠提高代碼的可讀性,但同時也會增加文件的大小。通常情況下,這沒什么影響,因為大多數JavaScript文件都非常小。然而,對于某些大型Ajax應用,或者復雜的JavaScript程序庫來說,太大的JavaScript文件會影響載入JavaScript的速度。
           
               如果要盡可能壓縮JavaScript文件,那么可以選用一些免費的工具,例如Dean Edward的Packer(http://dean.edwards.name/packer/),它能夠在線壓縮JavaScript代碼。或者使用Wikipedia中"minify"條目(http://en.wikipedia.org/wiki/Minify)中所列舉的工具,這些工具可以在桌面或者服務器上使用。
           
               另一類工具是用來保護JavaScript代碼版權的。這些工具不僅僅會壓縮JavaScript代碼,甚至還會對代碼進行加密,從而使代碼難以閱讀。
          posted on 2010-05-24 17:13 黃小二 閱讀(370) 評論(0)  編輯  收藏 所屬分類: Ajax
          主站蜘蛛池模板: 泰来县| 陇南市| 永年县| 兴安盟| 二连浩特市| 四会市| 铁岭市| 南和县| 博客| 彭泽县| 长寿区| 西和县| 扎兰屯市| 灌云县| 易门县| 普格县| 五台县| 雷州市| 广丰县| 桦川县| 天镇县| 宽城| 龙州县| 石门县| 江山市| 新竹县| 彩票| 深圳市| 抚顺县| 崇信县| 奎屯市| 武宣县| 新乡县| 甘孜| 开封市| 修文县| 滨海县| 中卫市| 湖口县| 随州市| 布尔津县|