您的位置:首页 > Web前端 > JQuery

jQuery学习笔记——各类选择器

2010-03-31 16:12 597 查看
$()工厂函数很强大,令其强大的是各种选择器。以下是个人对其中选择器的学习笔记。

1、标签选择器

如:$("tbody") 找寻所有表格中的tbody元素

2、id选择器

如:$("#div1") 找寻id为div1的元素

3、class选择器

如:$(".style1") 找寻class为style1的元素

4、层次选择器

此选择器通过dom元素之间的关系来确定所寻找的元素

如:$("div span") 找寻div元素中所有的span元素

$("div > span") 找寻div元素的名为span的子元素(此和上一个例子区别在于一个所有,包括子元素,孙元素。后者只是子元素)。

$("div + span") 找寻div元素后第一个span元素(等同于("div").next())

$("div ~ siblings") 找寻div元素后所有的span元素(等同于$("div").nextAll())

5、过滤选择器

此选择器可以通过特定的规则,过滤出所需的元素

如:$("div : first") 找寻所有div元素中第一个div元素

$("div : last") 找寻所有div元素中最后一个div元素

$("div : not(.style1)") 找寻所有div元素中class不为style1的div元素

$("div : even") 找寻div元素中所有偶数的div元素(索引从0开始)

$("div : odd") 找寻div元素中所有奇数的div元素(索引从0开始)

$("div : eq(1)") 找寻div元素中索引为1的div元素(索引从0开始)

$("div : gt(1)") 找寻div元素中索引大于1的div元素(索引从0开始)

$("div : lt(1)") 找寻div元素中索引小于1的div元素(索引从0开始)

$("div : contain('我')") 找寻div元素中含有文本“我”的div元素

$("div : empty") 找寻div元素中不包含任何子元素和文本的div元素

$("div : has(span)") 找寻div元素中含有p元素的div元素

$("div : parent") 找寻div元素中含有子元素或者文本的div元素

$("div : hidden") 找寻div元素中所有隐藏的div元素

$("div : visible") 找寻div元素中所有显示的div元素

$("div : first-child") 找寻每个div元素中第一个子元素(first只返回一个,此处返回每一个父元素下匹配的子元素)

$("div : last-child") 找寻每个div元素中最后一个子元素(区别同上)

$("div : nth-child(1)") 找寻div元素中第一个的子元素(eq索引从0开始,这里索引从1开始)

6、属性选择器

如:$("div [id='div1']") 找寻id为div1的div元素

其中的=可以换成以下的符号

!= id不为div1的div元素

^= id以div1开头的div元素

*= id中包含div1的div元素

$= id以div1结尾的div元素

以上是自己运用过的选择器,留下笔记以备复习
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: