第一章 認識jQuery

一、常見的JS庫

1. PRototype 最早的js庫之一。把好用JS方法組合，缺點結構松散。
2. Dojo 離線存儲API、生成圖標組件、矢量圖形庫、Comet支持。企業級JS庫，缺點文檔不全、API不穩定。
3. YUI 雅虎開發的富交互網頁程序工具集。
4. Exit JS側重界面
5. MooTools 模塊化思想的輕量級JS框架
6. jQuery 輕量級、強大選擇器等。

二、jQuery優勢

1. 輕量級 30K左右
2. 強大選擇器
3. 出色DOM封裝
4. 可靠的事件處理機制
5. Ajax完善
6. 不污染頂級變量
7. 瀏覽器兼容
8. 鏈式調用
9. 隱式迭代
10. 行為結構分離
11. 插件豐富
12. 文檔完善
13. 開源

三、編寫注意事項

鏈式調用是應該注意:

• 同一對象不超過3個操作，直接寫為一行
• 同一對象較多操作，每行寫一個操作
• 多個對象的少量操作，每對象寫一行（子元素縮進）

四、jQuery對象和DOM對象

DOM對象是直接從DOM樹獲取的對象，可以使用JS方法，不可以使用jQuery方法。jQuery對象是指jQuery包裝后的DOM對象，可以使用jQuery方法，不可以使用JS方法（通過jQuery對象獲取的變量在前面加$以作區分）。

兩者相互轉換：

• jQuery對象轉換為DOM對象：

1. [index]        var dom=$("div")[0];
2. get(index)   var dom=$("div").get(0);

• DOM對象轉換為jQuery對象： 直接使用$()打包DOM對象即可。

五、jQuery與其他JS庫沖突解決（$的讓渡問題）

對于jQuery，全局變量被存儲在自己的命名空間中一般與其他庫沒有沖突

• jQuery庫在其他庫后引入

1.      

   jQuery.noConflict();  //將變量$控制權讓給其他庫jQuery(function(){   //使用jQuery      // 書寫jQuery程序；});

      2.

var $j=jQuery.noConflict();  //自定義一個快捷方式$j(function(){                    //使用jQery，利用自定義的快捷方式——$j         //書寫jQuery程序；});

          如果不想自定義還想使用$()，不管其他庫$()方法，又不想與其他庫沖突。使用：

1.  jQuery.noConflict();  //將變量$控制權讓給其他庫 jQuery(function($){   //使用jQery設定頁面加載時執行的函，在函數內部繼續使用$()         //書寫jQuery程序；});

    

2. jQuery.noConflict();  //將變量$控制權讓給其他庫（function($){         //定義匿名函數并設置形參為$,匿名函數內部的$均為jQery，在函數內部繼續使用$()     $(function(){              // 書寫jQuery程序；      });})(jQuery) ;

• jQuery庫在其他庫前引入

        無需調用jQuery.noConflict()，直接使用jQuery做jQuery的是，其他函數庫使用$()。