在使用jQuery操作HTML代碼時,使用選擇器是必不可少的。jQuery選擇器可以方便地獲取HTML文檔中的元素,從而進行各種操作。
下面是一些常用的jQuery選擇器,它們可以用來獲取HTML文檔中的不同類型的標簽。
$(document).ready(function(){ // 獲取所有的p標簽,返回一個JQuery對象 var $allPara = $("p"); // 獲取指定的p標簽,返回一個JQuery對象 var $specificPara = $("#my-para"); // 獲取第一個p標簽,返回一個JQuery對象 var $firstPara = $("p:first"); // 獲取最后一個p標簽,返回一個JQuery對象 var $lastPara = $("p:last"); // 獲取所有class為my-class的p標簽,返回一個JQuery對象 var $classPara = $("p.my-class"); // 獲取所有class包含blue的p標簽,返回一個JQuery對象 var $containsClassPara = $("p[class*=blue]"); // 獲取所有含有my-attr屬性的p標簽,返回一個JQuery對象 var $attrPara = $("p[my-attr]"); // 獲取所有id以my-id開頭的p標簽,返回一個JQuery對象 var $idPara = $("p[id^=my-id]"); // 獲取所有以text內容結尾的p標簽,返回一個JQuery對象 var $textPara = $("p:contains(text)"); });
通過上面的代碼,你可以看到不同的選擇器返回的是不同的JQuery對象。如果你希望獲得的是具體的HTML元素,而不是一個JQuery對象,可以使用索引。例如:
$(document).ready(function(){ // 獲取第一個p標簽 var firstParaElement = $("p")[0]; });
需要注意的是,如果選擇器返回的是多個元素,上面的代碼會返回第一個元素,你可以使用不同的索引來獲取不同的元素。