JQuery入門(1)

1、jQuery的優勢：
輕量級。jQuery非常輕巧，最新的jQuery版本壓縮後，大小保持在80k左右。
強大的選擇器。jQuery允許使用從CSS1到CSS3幾乎所有的選擇器，以及jQuery自己的高階而複雜的選擇器。甚至你可以編寫屬於自己的選擇器。出色的DOM操作的封裝；jQuery封裝了大量常用的DOM操作，讓你能輕鬆地完成各種原本非常複雜的操作。可靠的事件處理機制； 完善的Ajax；jQuery將所有的Ajax操作封裝到一個函式$.ajax()裡，使得開發者處理Ajax的時候能夠專心處理業務漏極而無需關係複雜的瀏覽器相容性和XMLHttpRequest物件的建立和使用的問題。 出色的瀏覽器相容性等等。但是jQuery2.0及後續版本將不再支援IE6/7/8瀏覽器。

2、什麼是選擇器：
jQuery選擇器是jQuery庫中非常重要的部分之一。它支援網頁開發者所熟知的CSS語法快速輕鬆地對頁面進行設定。瞭解jQuery選擇器是開啟jQuery之門的鑰匙。
典型的jQuery選擇器句法形式:
$(selector).methodName();
selector是一個字串表示式，由於識別DOM中的元素，然後使用jQuery提供的方法集合加以設定。
根據所獲取頁面中元素的不同，可以將jQuery選擇器分為幾類：
1）基本選擇器
2）層次選擇器
3）過濾選擇器
– 簡單過濾選擇器
– 內容過濾選擇器
– 可見性過濾選擇器
– 屬性過濾選擇器
– 子元素過濾選擇器
– 表單物件屬性過濾選擇器
4）表單選擇器
3、基礎選擇器
基礎選擇器是jQuery中使用最頻繁的選擇器，它由元素id、class、多個選擇符組成，通過基本選擇器可以實現大多數頁面元素的查詢，如下表格：
選擇器 功能 返回值
[#id] 根據給定的id匹配一個元素 單個元素
[element] 根據給定的元素名匹配所有元素 元素集合
[.class] 根據給定的類匹配元素 元素集合
[*] 匹配所有元素 元素集合
[selector1,selectorN] 將每一個選擇器匹配到的元素合併後一起返回 元素集合
示例如下：
(1)描述
所有的元素標記全部顯示，然後通過jQuery基礎選擇器隱藏相對應的頁面標記。
(2)程式碼實現

    <script type="text/javascript">
        $(function(){ //id匹配元素
        $("#divOne").css("display","none");
    })
    $(function(){ //元素名匹配元素
            $("div span").css("display","none");
    })
    $(function(){ //類匹配元素
        $(".clsFrame .clsOne").css("display","none");
    })
    $(function(){ //匹配所有元素
        $("*").css("display","none");
    })
    $(function(){ //合併匹配元素
        $("#divOne,span").css("display","none");
    })
    </script>
    ...jQuery控制的程式碼
    <div class="clsFrame">
        <div id="divOne">ID</div>
    <div class="clsOne">CLASS</div>
    <span>SPAN</span>
    </div>