JQUERY随笔[2]

1,find()

在当前的集合中查找,等价于选择器直接查找,比如:$("div a") = $("div").find("a")

如果你想知道为什么有了选择器还搞个方法出来,请往下看#5!

2,:first与first(), :last与last(), :not与not(), :eq与eq()

这四个可以作为选择器去过滤元素,也可以做方法.比如: $("div:first") = $("div").first()

even,odd,lt,gt没有!!!

first,last,not,eq,even,odd,lt,gt的概念就不说了,很简单

3, :not(or not())

通过selector(或者jquery对象)去过滤元素,注意如果使用not()方法的时候 判断条件可以是selector也可以是jquery的对象!

$("*").not("#div1") = $("*").not($("#div1"))

如果在selector中使用not 好像没法用jquery对象哦!

现在已知not可以通过id,class,html元素的标记(div,p,span,etc)来过滤

如果想通过属性过滤,请往下看#4.通过属性过滤就不要用not了,#4中讲到的属性选择器挺powerful.

如果想通过innerHTML来过滤,这个我还真不知道该怎么搞

4, 属性选择器

$("div[title]") 这个用来查找页面中拥有title属性的所有div

$("#div1[title]") 查找id是"div1"且有title属性的元素

$("*[id=div1][title]") 这个跟上面的$("#div1[title]")是等价的.提到这个是要记住jquery支持多个属性选择器!!!

$("div[title=juice]") title等于juice的div,如果一个div的title是juicemilk匹配不了,要完全匹配才可以.

$("div[title!=juice]") title不等于juice的div,同样是完全匹配.

$("div[title^=juice]") title以juice开始的div, title是juicemilk的div这次就可以匹配了.

$("div[title$=juice]") title以juice结束的div, juicemilk就不行了,但是title是milkjuice可以匹配.

$("div[title*=juice]") title中包含juice的div, ok!这次milkjuice和juicemilk都可以匹配了.

ps:属性选择器的条件部分可以加单引号,也可以不加.比如: $("#div1[title=juice]") = $("#div1[title='juice']")

5,我突然知道为什么有了:find还要有find()了,还有first,last等

比如我现在有一个dom对象(看清楚,是dom对象,不是jquery对象),假设这个元素是一个div吧(document.getElementBy....得到的),变量名是selDIV

我要这么写去得到相应的jquery对象$(selDIV),可你能$("selDIV > span")这么着去找此div下的span么? 那必须是不可以的

此时,方法的作用就体现出来淋漓尽致,由$(selDIV).find("span")搞定.

你会想,那就要这些方法不就可以了嘛. 嗯~ 但是你知道JQuery的元素查询方面的核心价值观吗? 我总结的就是像用css的选择器一样去查找元素!!!

所以我的结论是,方法是选择器在某些条件下(比如根据dom对象查找)无法完成时,应运而生的.

6,:nth-child

根据索引过滤元素.

$("div:nth-child(1)")查找div中的第一个

$("div span:nth-child(4)")查找div下的第4个span

你也可以使用下面的条件去查找

:nth-child(even) 找偶数位
:nth-child(odd) 找奇数位
:nth-child(3n) 找3的倍数位(3,6,9,,,,,3n)
:nth-child(3n+1) 找3的倍数加1位(4,7,10,.....3n+1)

7,nth-child的索引从1开始,eq的索引从0开始!!!!!!

ok~ 随笔[2]到此为止,今天的总结收获还是挺多的,有不少发现,还有一点点结论(#5),哈哈哈!

之后进入表单元素以及dom添加,修改部分.