目錄
1.基本選擇器
1.1id選擇器
1.2型別選擇器(element)
1.3類選擇器
1.4通配選擇器
1.5分組選擇器
2.結構選擇器
2.1層級選擇器
2.2.1包含選擇器
2.2.2子選擇器(parent > child)
2.2.3兄弟選擇器(prev ~ siblings)
3.子元素選擇器
4.過濾選擇器
4.1定位過濾器
5.內容選擇器
6、可見過濾器
7.屬性選擇器
8、表單選擇器
8.1基本表單選擇器
8.2高階表單選擇器
9.優化jquery選擇器
10.原生選擇器
11.結語
jquery(「#id」) $(「#id」)getelementbyid();
id表示標籤id的屬性值
jquery(「element」) $(「element」)getelementsbytangname();
element表示標籤的名字
jquery(「.classname」); $(「.classname」)classname表示標籤class的屬性值,注意
getelementsbyclassname();
$(「*」)getelementsbyidtagname();
指定範圍內所有的標籤元素
$(「selector1,selector2,…….selectorn」)
ancestor descendant$(「form input」)
在給定的祖先元素下匹配所有後代(在form表單下匹配所有的input元素)
$(「labe + input」)匹配所有pre元素後面的next元素(匹配所有跟在label後面的input元素)
匹配所有與prev同級的siblings元素$(「form ~ input」)
匹配表單同輩的input元素
:first:last
:not 去除所有與給定選擇器匹配的元素
$(「input:not(:checked)」)可以匹配到所有為被選中的input元素
:even 匹配索引值為偶數的值
:odd 匹配索引值為基數的值
:eq 匹配乙個給定索引值的元素,從0開始計算。$(「tr:eq(0)」)
:gt 匹配所有大於給定索引值的元素
$(「tr:gt(0)」)匹配第二個及後面的元素
:lt 匹配所有小於給定索引值的元素,$(「tr:lt(1)」)匹配到第乙個tr
:header 匹配如h1,h2,h3之類的標題元素
:animated 匹配所有正在執行動畫效果的元素
:contains匹配給定的文字元素$(「div:contains()」)匹配所有包含的div元素
:empty匹配所有不包含子元素或文字的空元素
:has匹配所有含有選擇器匹配的元素的元素
$(「div:has(p)」)匹配所有包含p元素的div元素
:parent匹配含有子元素或者文字的元素
:hidden匹配所有不可見元素,或者type為hidden的元素$(「p:hidden」).show();顯示所有不可見或type為hidden的p元素
:visible匹配所有的可見元素
案例:
修改表單域中的value值$(「#test:radio」).val(「修改後的單選按鈕」)
$(「#test:hidden」).val(「修改後的隱藏域」)
#test為id的屬性值
案例:$(「#test:disabled」).val(「不可用」);
$(「#test:enabled」).val(「可用」);
$(「#test:checked」).removeattr(「checked」)
//removeattr();從表單中移除屬性
首頁
娛樂queryselector(); 返回乙個元素物件
document.queryselector(「.content ul li」); 獲得第乙個li元素
queryselectorall(); 返回乙個元素集合
document.queryselectorall(「.content ul li」); 獲得所有li元素
實際開發中常見的為id選擇器與類選擇器,其他稍作了解 第二章 jQuery選擇器
css選擇器 選擇器語法 描述示例 標籤選擇器 e 以文件元素作為選擇器 td a id選擇器 id 以文件元素的唯一識別符號id作為選擇器 note 類選擇器 e.classname 以文件元素的class作為選擇器 div.note dream 群組選擇器 e1,e2,e3 多個選擇符應用同樣的...
第二章《jQuery選擇器(一)》
在學習jquery前,先要弄明白dom物件與jquery物件的區別 簡單通俗理解的話可以認為dom物件就是頁面中的某乙個具體的文字標籤,而jquery物件是基於dom物件之上的,我們可以把某個dom物件轉化為jquery物件。只有是jquery物件才能使用jquery中的方法以及屬性。例 docum...
鋒利的jQuery第二章 選擇器
鋒利的jquery第二章 選擇器 id為one,class為one的div class為mini id為two,class為one,title為test class為mini,title為other class為mini,title為test class為mini class為mini class為...