jquery選擇器、屬性設置用法經驗總結

2019-11-20 22:19:22

字體：大中小

來源：轉載

供稿：網友

本人是一名小白，應屆畢業生，以前沒用過jquery，最近做項目用到了jquery。在做的過程中走了很多彎路，不停的搜索。總結出了一些用法，供大家參考：

最基本的選擇器語法包括：id、class、標簽、屬性，這和css選擇器是一致的。

ID選擇器要在ID前加#，比如要選擇一個ID為myDivID的div元素（<div id="myDivID"></div>）可以這樣寫:

復制代碼代碼如下:

$("#myDivID");

D是不能重復的，所以ID選擇器選出來的是一個jquery對象。

class選擇器要在class前加點（.），比如要選擇一個class為myInputClass的input元素（<input type="text" class="myInputClass"/>）可以這樣寫：

復制代碼代碼如下:

$(".myInputClass");

class是可以重復的，所以class選擇器選出來的可以是一類元素，即好多個元素，所以jquery選出來的是個數組，可以引用下標來選擇每個元素：比如

復制代碼代碼如下:

for(var i = 0; i < $(".myInputClass").length; i++) {$(".myInputClass")[i];}

這樣可以迭代出每個元素。

標簽選擇器直接寫標簽類型即可，比如要選擇一個段落p標簽（<p></p>）即可這樣寫：

復制代碼代碼如下:

$("p");

標簽選擇器選出來的也是一個數組，選出所有的p標簽元素，也可以用上面的方法迭代出所有的元素。

屬性選擇器要在前面加方括號（[]），比如要選擇含有name="xxName"的元素，可以這樣寫：

復制代碼代碼如下:

$("[xxName]");

這樣來選擇，選擇出的也是一個數組，因為name是可以重復的。

ID選擇器可以精確的選出一個元素來，但在開發中我們可能更多的要選擇出一組元素，怎樣才能精確的選擇出我們想要的元素呢，其實幾種選擇器是可以混合使用的：

復制代碼代碼如下:

 
<div id="attrValueTab"> 
<span style="white-space:pre"> </span><p> 
<span style="white-space:pre"> </span><input type="button" value="確定" /> <input type="text" value="odd" /> <input type="text" value="even" /> 
<span style="white-space:pre"> </span></p> 
<span style="white-space:pre"> </span><p> 
<span style="white-space:pre"> </span><input type="button" value="取消" /> <input type="text" value="odd" /> <input type="text" value="even" /> 
<span style="white-space:pre"> </span></p> 
</div> 