jquery基礎選擇器有幾種

204次閱讀

共計 1458 個字符，預計需要花費 4 分鐘才能閱讀完成。

自動寫代碼機器人，免費開通

這篇文章將為大家詳細講解有關 jquery 基礎選擇器有幾種，丸趣 TV 小編覺得挺實用的，因此分享給大家做個參考，希望大家閱讀完這篇文章后可以有所收獲。

基礎選擇器是 jQuery 中最常用選擇器，也是最簡單的選擇器，它通過元素 id、class 和標簽名等來查找 DOM 元素。

id 選擇器
id 選擇器 $(‘#id’) 通過給定的 id 匹配一個元素，返回單個元素

p id= test 測試元素 /p script // 選擇 id 為 test 的元素并設置其字體顏色為紅色 $(#test).css(color , red /script

對應 DOM 的 getElementById() 方法，而 jQuery 內部也使用該方法來處理 ID 的獲取

document.getElementById(test).style.color =  red

元素選擇器
元素選擇器 $(‘element’) 根據給定的元素名匹配元素，并返回符合條件的集合元素

p 1 /p 
 p 2 /p 
 script // 選擇標簽名為 p 的元素并設置其字體顏色為紅色 $(p).css( color , red 
 /script

對應 DOM 的 getElementsByTagName() 方法，而 jQuery 內部也使用該方法來處理元素名的獲取

Array.prototype.forEach.call(document.getElementsByTagName( p),function(item,index,arr){ item.style.color =  red});

類選擇器
類選擇器 $(‘.class’) 根據給定的類名匹配元素，并返回符合條件的集合元素

p  > 對應 DOM 的 getElementsByClassName() 方法，而 jQuery 內部也使用該方法來處理類名的獲取 Array.prototype.forEach.call(document.getElementsByClassName( test),function(item,index,arr){ item.style.color =  red});
 通配選擇器 
 通配選擇器 $(‘*’) 匹配文檔中所有的元素，并返回集合元素 
$(*).css(margin , 0
 對應 DOM 的 document.all 集合 
Array.prototype.forEach.call(document.all,function(item,index,arr){ item.style.margin = 0;});
 或者參數為通配符 * 的 getElementsByTagName() 方法 
Array.prototype.forEach.call(document.getElementsByTagName( *),function(item,index,arr){ item.style.margin = 0;});
 群組選擇器 
 群組選擇器 $(‘selector1,selector2,…’) 將每一個選擇器匹配到的元素合并后一起，并返回集合元素 
p  > 對應 DOM 的 querySelectorAll() 選擇器 Array.prototype.forEach.call(document.querySelectorAll( .a,#b,a),function(item,index,arr){ item.style.color =  red});
 關于“jquery 基礎選擇器有幾種”這篇文章就分享到這里了，希望以上內容可以對大家有一定的幫助，使各位可以學到更多知識，如果覺得文章不錯，請把它分享出去讓更多的人看到。
 向 AI 問一下細節