jquery選擇器
關鍵點是學習 jquery是如何準確地選取您希望應用效果的元素。
jquery 元素選擇器和屬性選擇器允許您通過標籤名、屬性名或內容對 html 元素進行選擇。
選擇器允許您對html 元素組或單個元素進行操作。
元素選擇器
jquery 使用 css 選擇器來選取 html 元素。
$("p") 選取 元素。
$("p.intro") 選取所有 class="intro" 的 元素。
$("p#demo") 選取所有 id="demo" 的 元素。
屬性選擇器
jquery 使用 xpath 表示式來選擇帶有給定屬性的元素。
$("[href]") 選取所有帶有 href 屬性的元素。
$("[href='#']") 選取所有帶有 href 值等於 "#" 的元素。
$("[href!='#']") 選取所有帶有 href 值不等於 "#" 的元素。
$("[href$='.jpg']") 選取所有 href 值以 ".jpg" 結尾的元素。
css 選擇器
jquery css 選擇器可用於改變 html 元素的 css 屬性。
更多的選擇器 語法
描述$(this)
當前 html 元素
$("p")
所有 元素
$("p.intro")
所有 class="intro" 的 元素
$(".intro")
所有 class="intro" 的元素
$("#intro")
id="intro" 的元素
$("ul li:first")
每個 的第乙個 元素
所有帶有以 ".jpg" 結尾的屬性值的 href 屬性
$("div#intro .head")
id="intro" 的 元素中的所有 class="head" 的元素
擴充套件選擇器
例項選取
*$("*")
所有元素
#id$("#lastname")
id="lastname" 的元素
.class
$(".intro")
所有 class="intro" 的元素
element
$("p")
所有 元素
.class.class
$(".intro.demo")
所有 class="intro" 且 class="demo" 的元素
:first
$("p:first")
第乙個 元素
:last
$("p:last")
最後乙個 元素
:even
$("tr:even")
所有偶數 元素
:odd
$("tr:odd")
所有奇數 元素
:eq(index)
$("ul li:eq(3)")
列表中的第四個元素（index 從 0 開始）
:gt(no)
$("ul li:gt(3)")
列出 index 大於 3 的元素
:lt(no)
$("ul li:lt(3)")
列出 index 小於 3 的元素
:not(selector)
$("input:not(:empty)")
所有不為空的 input 元素
:header
$(":header")
所有標題元素 -
:animated
所有動畫元素
:contains(text)
$(":contains('w3school')")
包含指定字串的所有元素
:empty
$(":empty")
無子（元素）節點的所有元素
:hidden
$("p:hidden")
所有隱藏的 元素
:visible
$("table:visible")
所有可見的**
s1,s2,s3
$("th,td,.intro")
所有帶有匹配選擇的元素
[attribute]
$("[href]")
所有帶有 href 屬性的元素
[attribute=value]
$("[href='#']")
所有 href 屬性的值等於 "#" 的元素
[attribute!=value]
$("[href!='#']")
所有 href 屬性的值不等於 "#" 的元素
[attribute$=value]
所有 href 屬性的值包含以 ".jpg" 結尾的元素
:input
$(":input")
所有 元素
:text
$(":text")
所有 type="text" 的 元素
:password
$(":password")
所有 type="password" 的 元素
:radio
$(":radio")
所有 type="radio" 的 元素
:checkbox
$(":checkbox")
所有 type="checkbox" 的 元素
:submit
$(":submit")
所有 type="submit" 的 元素
:reset
$(":reset")
所有 type="reset" 的 元素
:button
$(":button")
所有 type="button" 的 元素
:image
$(":image")
所有 type="image" 的 元素
:file
$(":file")
所有 type="file" 的 元素
:enabled
$(":enabled")
所有啟用的 input 元素
:disabled
$(":disabled")
所有禁用的 input 元素
:selected
$(":selected")
所有被選取的 input 元素
:checked
$(":checked")
所有被選中的 input 元素
二 jQuery選擇器
jquery選擇器的優勢 1.簡潔的寫法 2.支援css1到css3選擇器，瀏覽器相容性好 3.完善的處理機制，使用jquery獲取網頁中不存在的元素不會報錯 注意 當要用jquery檢查某個元素在網頁上是否存在時，應該根據獲取到元素的長度來判斷或者轉化成dom物件來判斷，如下 if tt leng...
jQuery（二）選擇器
jquery選擇器 1.基本選擇器 jquery選擇器用於查詢滿足條件的元素。1.id id 選擇器,document.getelementbyid id 2.div 元素選擇器 document.getelementsbytagname div 3.myclass 類選擇器 返回所有 class ...
jQuery 選擇器（二）
過濾選擇器 過濾選擇器，就是在選擇器中通過 新增過濾條件。按照不同的過濾規則，過濾選擇器可以分為基本過濾，內容過濾，可見性過濾，屬性過濾，子元素過濾和表單物件屬性過濾選擇器。基本過濾選擇器 1.獲取第乙個input元素 var input query input first 2.獲取最後乙個inpu...