jQuery選擇器是一種強大的工具,可以在HTML文檔中選擇和操作元素。它有很多不同的分類,我們將在下面的段落中逐一介紹。
基礎選擇器
基礎選擇器是最簡單的選擇器。它們使用標簽名、類名和ID來選擇元素。下面是一些示例:
$("p") // 選擇所有p元素 $(".myClass") // 選擇所有類為myClass的元素 $("#myId") // 選擇ID為myId的元素
層次選擇器
層次選擇器可以選擇特定元素的子元素、后代元素或同胞元素。下面是一些示例:
$("parent > child") // 選擇parent的直接子元素child $("ancestor descendant") // 選擇ancestor元素內的所有descendant后代元素 $("prev + next") //選擇prev元素后面緊接著的next元素
過濾器選擇器
過濾器選擇器允許您根據元素的狀態或屬性來選擇元素。下面是一些示例:
$(":visible") // 選擇所有可見元素 $(":hidden") // 選擇所有隱藏元素 $("input:text") // 選擇所有文本輸入框 $(":checked") // 選擇所有被選中的復選框和單選按鈕 $("a[href^='https']") // 選擇所有href屬性以https開始的鏈接
內容選擇器
內容選擇器允許您選擇具有特定文本或HTML內容的元素。下面是一些示例:
$(":contains('text')") // 選擇包含'text'文本的元素 $("div:has(p)") // 選擇包含p元素的div元素 $(":empty") // 選擇沒有子元素或文本的元素
以上是jQuery選擇器分類的一些示例。掌握不同類型的選擇器將使您更輕松地選擇和操作HTML文檔中的元素。