標籤:擷取 button 開始 last blog cin href checked ref
參考:1、http://www.cnblogs.com/lanleiming/p/5201677.html#p2
Jquery 擷取元素的方法分為兩種:jQuery選取器、jQuery遍曆函數。
選取器 |
執行個體 |
說明 |
#Id |
$(‘#myId‘) |
ID選取器: 可以擷取到ID為“myId”的所有元素,區分大小寫 |
- b1.jQuery選取器
選取器 |
執行個體 |
說明 |
.class |
$(‘.myClass‘) |
類別選取器:可以擷取到class為‘myClass’的所有元素 |
element |
$(‘p‘) |
擷取所有的<p>元素 |
:header |
$(‘:header‘) |
擷取所有的標題元素:<h1> ~ <h6> |
:animated |
$(‘:animated‘) |
擷取所有的動畫元素 |
:contains(text) |
$(‘p:contains(Hello)‘) |
擷取所有包含文本為Hello的<p>元素,中間的文本區分大小寫 |
:hidden |
$(‘:hidden‘) |
擷取所有的隱藏元素:width和height為0、display:none、type=hidden、 |
[attribute] |
$(‘[href]‘) |
屬性選取器:擷取所有含有屬性為href的元素 |
[attribute=value] |
$(‘[href=a.html]‘) |
= 擷取所有帶有屬性href,並且值為a.html的元素 != 擷取所有帶有屬性href,並且值不等於為a.html的元素 $= 擷取所有帶有屬性href,並且值以a.html結尾的元素 ^= 擷取所有帶有屬性href,並且值以a.html開頭的元素 ~= 擷取所有帶有屬性href,並且值包含單詞”a.html“的元素 *= 擷取所有帶有屬性href,並且值包含文本”a.html“的元素 |
:input |
$(‘:input‘) |
擷取所有input元素 |
:radio |
$(‘:radio‘) |
所有帶有 type="radio" 的 input 元素 相似的有: :text、:chexbox、:password、:submit、:reset、:button、:file |
:enabled |
$(‘:enabled‘) |
所有啟用的input元素。 :disabled 則相反 |
:checked |
$(‘:checked‘) |
所有選中的input選擇(單選框、複選框) |
:gt(index) |
$(‘p:gt(2)‘) |
index從0開始,擷取index大於(不包含)2的所有<p>元素 |
:lt(index) |
$(‘p:lt(2)‘) |
index從0開始,擷取index小於(不包含)2的所有<p>元素 |
:even |
$(‘tr:even‘) |
所有偶數<tr>元素 |
:odd |
$(‘tr:odd‘) |
所有奇數<tr>元素 |
b2.jQuery選取器jQuery遍曆函數混合
選取器 |
執行個體 |
說明 |
:first |
$(‘p:first‘) |
第一個<p>元素 |
:last |
$(‘p:last‘) |
最後一個<p>元素 |
:eq(index) |
$("p:eq(1)") |
第二個<p>元素,index從0開始 |
b3.jQuery遍曆函數
方法 |
描述 |
eq() |
返回帶有被選元素的指定索引號的元素 |
first() |
返回被選元素的第一個元素 |
last() |
返回被選元素的最後一個元素 |
2、選擇同級元素
jQuery選取器
$(‘div + p‘) 每個div相鄰的下一個<p>元素
$(‘div ~ p‘)擷取跟div同級的所有的<p>元素
jQuery遍曆函數
next() 返回被選元素的後一個同級元素
nextAll()返回被選元素之後的所有同級元素
prev()返回被選元素的前一個同級元素
prevAll()返回被選元素之前的所有同級元素
3、擷取父級元素
jQuery選取器
$("p:parent")擷取所有p元素的父級元素
jQuery遍曆函數
parent() 擷取被選元素的父級元素
parents()擷取被選元素的所有祖先元素
4.擷取子級元素
jQuery選取器
$(‘div > p‘) 擷取div直接子項目的所有<p>元素
$(‘div p‘)擷取div所有後代的<p>元素
jQuery遍曆函數
children() 返回被選元素的所有直接子項目
contents()返回被選元素的所有直接子項目(包含文本和注釋節點)
find()返回被選元素的後代元素
舉例:
1、$(‘#id1 > div:eq(3) > button‘) 擷取id為id1的第三個div子項目的所有button的子項目
Jquery擷取元素方法