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

黑马程序员 jquery选择器和过滤器

2014-03-01 09:54 253 查看

---------------------- ASP.Net+Unity开发、.Net培训、期待与您交流!
----------------------

一.选择器

1.什么是选择器

给jq一个条件,jq在dom树里面找到我们需要的元素
 

2.id选择器

$("#元素id名")

 

3.class选择器

$(".元素class名")

 

4.元素选择器

$("元素类型")
如div, inout等等

 

5.*号选择器

$("*") 
返回当前页面的所有的dom元素,包括html,body这些元素
 

6.多条件选择器

$("选择条件")

 
1.无逗号隔开  

$("元素类型#元素名称.元素class名") 
选择同时满足条件的元素

 
2.用逗号隔开  

逗号可以看成是"或"

 
3.用空格隔开   

选择空格前面元素的子元素

 
4.用逗号隔开且逗号前面为选择条件,后面为jq对象
以后面为作用域里查找满足条件的

 
5.用>直接选择子元素
如$("ul>li")
 
6.使用"条件1+条件2"查找条件1后第一个满足条件2兄弟节点

 
7.使用"条件1~条件2"查找条件1后面所有的满足条件2的节点

 

7.属性选择器

1.元素名[属性]

选择存在该属性的元素或标签
 
2.元素名[属性^=条件]

选择属性以条件开头的元素或标签

 
3.元素名[属性$=条件]

选择属性以条件结尾的元素或标签
 
4.元素名[属性!=条件]

选择属性不等于条件或不存在该属性特征的元素或标签

 
5.元素名[属性*=条件]
选择属性含有条件的元素或标签

 
6.元素名[属性=条件]

选择属性满足条件的元素或标签

2.过滤器

1.元素a:first

匹配第一个元素a
如 img:first
 

2:元素:last

匹配最后一个元素a
如img:last

3.元素:first-child:

匹配第一个子节点的该元素
 

4.元素:last-child

匹配最后一个子节点的该元素
 

5.元素:noly-child

匹配没有兄弟节点的该元素
 

6.元素:nth-child(n)

匹配第n个节点的该元素
 

7.元素:nth-child(even| odd)

匹配偶数|奇数子节点的该元素
 

8.元素:even

匹配偶数元素
 

9.元素:odd

匹配奇数元素
 

10.eq(n)

匹配n个元素
 

11.gt(n)

匹配第n个元素后的元素
 

12.lt(n)

匹配第n个元素前的元素
 

13.:not

例如$("input[type='checkbox']:not(:checked)")
在返回值中删除被选中的选着框

 

14.:has

例如$("div:has(span)")
匹配所有包含span的div标签

---------------------- ASP.Net+Unity开发、.Net培训、期待与您交流!
----------------------
详细请查看:http://edu.csdn.net
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: