JQuery基础二

$()下的常用方法

has()
not()
filter()
next()
prev()
find()
eq()
index()
attr()


Filter：过滤
not:filter的反义词
$("div").filter(".box").css("background","red");

$("div").not(".box").css("background","red");



<div class="box">div1</div>

<div >div2</div>



has:包含的意思 
$("div").has("span").css("background","red");

<div class="box">div1<span>span</span></div>

<div >div2</div>



对比:Filter和 has
包含的内部当中找,以下代码不会找到第二个

$("div").has(".box").css("background","red");

filter是针对元素自身的,所以找到第二个

$("div").filter(".box").css("background","red");


<div>div1<span  class="box">span</span></div>

<div class="box"></div>





next();选择下一个兄弟节点
$("div").next().css("background","red");  //找到div的下一个兄弟节点(span)



<div>div</div>

<span>span</span>

<p>p</p>



prev();选择上一个兄弟节点
同上





find() 查找  

$("div").find("h2").css("background","red"); //找到div下为h2的元素标签





<div>

<h3></h3>

<h2></h2>

<h3></h3>

<h3></h3>

<h2></h2>

<h3></h3>

</div>



eq()  元素中的下标

$("div").find("h2").eq("1").css("background","red")





index() 索引

$("#h").index();   //索引就是当前元素在所有兄弟节点中的位置 3



<div>

　　<h3></h3>

　　<h2></h2>

　　<h3></h3>

　　<h3 id="h"></h3>

　　<h2></h2>

　　<h3></h3>

</div>