Zi 字媒體

[jQuery 權威指南（第二版）]閱讀筆記-jQuery 選擇器[基本選擇器語法]     資料來源:http://www.java1234.com/a/javaziliao/shuji/2014/1206/3343.html   根據所獲取頁面中元素的不同，可以將jQuery 選擇器分為四大類：   ■基本選擇器 基本選擇器語法 選擇器 功能描述 返回值 #id 根據給定的ID 匹配一個元素 單個元素 element 根據給定的元素名匹配所有元素 元素集合 .class 根據給定的類匹配元素 元素集合 * 匹配所有元素 元素集合 selector1,selectorN 將每一個選擇器匹配到的元素合併後一起返回 元素集合   Ps 「逗號」隔開表示個別元素，「空格」隔開表示階層關係 範例2-5： -//W3C//DTD XHTML 1.0 Transitional//EN” “http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd”>     使用jQuery基本選擇器                 src=”Jscript/jquery-1.8.2.min.js”>                body{font-size:12px;text-align:center}            .clsFrame{width:300px;height:100px}            .clsFrame div,span{display:none;float:left;            width:65px;height:65px;border:solid 1px #ccc;margin:8px}            .clsOne{background-color:#eee}                     $(function(){ /* ID匹配元素「三個顯示一個」*/               $(“#divOne”).css(“display”,”block”);             })             $(function(){ /*元素名匹配元素「三個顯示一個」，div下的span */               $(“div span”).css(“display”,”block”);             })             $(function(){ /*類匹配元素*/               $(“.clsFrame .clsOne”).css(“display”,”block”);             })             $(function(){ /*匹配所有元素「全部顯示」*/               $(“*”).css(“display”,”block”);             })             $(function(){ /*合併匹配元素「三個顯示二個」*/               $(“#divOne,span”).css(“display”,”block”);             })         ID     CLASS     SPAN   ps：「div,span{display:none;float:left;width:65px;height:65px;border:solid 1px #ccc;margin:8px}」這行css有用到float:left;讓元件可以橫向擺放 ■層次選擇器 ■過濾選擇器   ◆簡單過濾選擇器   ◆內容過濾選擇器   ◆可見性過濾選擇器   ◆屬性過濾選擇器   ◆子元素過濾選擇器   ◆表單物件屬性過濾選擇器 ■表單選擇器