jquery常用篩選方法

1、jquery過濾方法
eq(index|-index)
first()
last()
hasClass(class)
filter(expr|obj|ele|fn)
is(expr|obj|ele|fn)
map(callback)
has(expr|ele)
not(expr|ele|fn)
slice(start,[end])
具體事例如下：

<ul>
    <li>第一個</li>
    <li>第二個</li>
    <li class="box" id="li3"><span class="child">第三個</span></li>
    <li>第四個</li>
    <li>第五個</li>
</ul>

eq() 獲取子元素里面的其中某一個，根據索引來獲取。 -index -1開始的

console.log($("ul>li:first"));
    console.log($("ul>li:eq(0)"));
    console.log($("ul>li:nth-child(1)"));
    console.log($("ul>li").eq(0));//上面四個等價均是第一個li
    console.log($("ul>li").eq(-1));
    console.log($("ul>li:last"));

hasClass(class) 根據元素的類名稱來進行過濾的 參數是class名稱
用來判斷某個元素是否具有class名稱 true/false
console.log($("ul>li").eq(2).hasClass("box"));
filter 過濾 fn(index,ele)

console.log($("ul>li").filter(".box"));
console.log($("ul>li").filter($(".box")));

is() expr|obj|ele|fn 判斷當前元素是什么 返回值 true/false

console.log($("ul>li").is(".box"));
console.log($("ul>li").is($(".box")));

map映射兩種使用
第一種將一個集合映射為一個新的集合 帶返回值
第二種 不寫返回值 map可以作為遍歷來使用
必須有回調函數 參數為index，ele
jquery 對象集合轉為數組 需要get()
get(index) js對象 不同于eq(index) 返回的是jquery對象

console.log($("ul>li")[0]);
console.log($("ul>li").get(0));

has（）過濾元素 把當前需要的過濾出來 不需要的去除 參數可以是selecto dom
參數寫成.box都匹配不到元素（直接找的匹配元素的同級）
參數寫成.box 過濾的元素必須是匹配的元素子內容
console.log($("ul>li").has(".child"));
not（） 除過 回調函數參數index ele
console.log($("ul>li").not(".box"));
console.log($("ul>li").not($(".box")));
slice（）參數是start end 類似數據的slice 截斷 取小不取大
console.log($("ul>li").slice(0, 2));
2、查找
children([expr])
closest(e|o|e)1.7*
find(e|o|e) expr jquery對象 ele
next([expr])
nextAll([expr])
nextUntil([e|e][,f]) 類似nextAll 方法
offsetParent()
parent([expr])
parents([expr])
parentsUntil([e|e][,f]) 下去自己看
prev([expr])
prevAll([expr])
prevUntil([e|e][,f]) //下去自己看
siblings([expr])

children 獲取子元素的 獲取所有的子集元素(直接子集)
children 參數expr 選擇器 可以作為簡單過濾

find 查找 參數可以是expr jquery對象 ele
next 獲取當前匹配元素的下一個 nextAll 獲取當前匹配元素之后的所有元素
next nextoAll 方法的參數 expr 表達式
prev prevAll 同上
offsetParent() 該方法返回的父元素是定位的 在父親元素中找最近的定位父元素
parent 獲取直接父元素 parents所有父親
siblings 同胞兄弟元素 不帶參數 指獲取所有的同胞兄弟 參數expr 表達式 用來過濾元素使用

3、串聯
add(e|e|h|o[,c])1.9*
addBack()1.9+
contents()
end()

<ul>
    <li>1</li>
    <li>2</li>
    <li class="box">3</li>
    <li>4</li>
</ul>
<p class="p1">ppp</p>
<p>p2222</p>

add() 給jquery對象添加新的對象

console.log($("ul>li").add($("p")));
console.log($("ul>li").add("p"));
console.log($("ul>li").add(".p1"));

addBack()
console.log($("ul>li").eq(1).nextAll().addBack());//元素234
contents 獲取當前元素的所有節點 包含文本 childrenNodes
end 方法是回到上一次破壞性修改 上一次修改jquery對象