jquery經常使用篩選方法

一、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));
二、查找
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 表達式 用來過濾元素使用

三、串聯
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());//元素234contents 獲取當前元素的全部節點 包含文本 childrenNodesend 方法是回到上一次破壞性修改 上一次修改jquery對象