JQuery常用选择器
----------------- 1 基本选择器
1. #id 根据给定的id匹配一个元素 单个元素
2. .class 根据给定的类名匹配元素 集合元素
3. element 根据给定的元素名匹配元素 集合元素
4. * 匹配所有元素
5 selector,selector2.....selectorN 将每一个选择器匹配到的元素 合并后一起返回 集合元素
------------------------- 2 层次选择器
1. $("ancestor descendant") 选取ancesto元素里的所有descendant(后代)元素 返回集合元素 $("div span") 选取div里所有的span元素
2. $("parent>child") 选取parent元素下的child(子)元素 不选择孙子元素 $("div>span") 返回的是div元素下元素名是span的元素
3. $('prev+next') 选取紧接在prev元素后的next元素 返回集合元素
4. $('prev~siblings') 选取perv元素之后的所有siblings元素 $('prev+next') 可以用 $("prev").next(next) 替代 如 $('#div1+div') $("#div1").next("div") 获取id为div1的元素的下一个div兄弟元素 $('perv~siblings') 可以用 $("#div1").nextAll("div") 获取id为div1的元素的后面的同 辈的所有的div元素 siblings方法与前后位置无关 只要是同辈元素都能匹配
---------------------- 过滤选择器
基本过滤选择器
:first $("div:first") 选取所有div元素中的第一个div元素
:last $("div:last") 选取所有div元素中最后一个div元素
:not(selector) $("input:not(.myClass)") 选取所有类名不是myClass的input元素
:even $("input:even") 选取所有事偶数的input元素
:odd $("input:odd") 选取所有事奇数的input元素
:eq(index) $("input:eq(1)") 选取索引是1的input元素
:gt(index) 选取索引大于index的元素
:lt(index) 选取索引小于index的元素
:header 选取网页中所有的h1 h2 h3......
:animated 选取正在执行动画的元素
table默认下级有个tbod元素
----------------内容过滤器
:contains(text) 选取含有文本内容为"text"的元素 $("div:contains('我')")
:empty 选取不包含子元素或者文本的空元素
:has(selector) 选取含有选择器匹配的元素的元素 $("div:has(p)")选取含有p元素的div元素
:parent 选取含有子元素或者文本的元素 $("div:parent")选取拥有子元素或文本的div元素
可见性过滤选择器
:hidden 选取所有不可见的元素
:visible 选取所有可见的元素
:hidden 它不仅包括样式属性display为none的元素 也包括文本隐藏域和visibility:hidden之类的元素
属性过滤选择器
[attribute] 选取拥有此属性的元素 $("div[id]")选取拥有属性id的元素
[attribute=value] 选取属性的值为value的元素 $("div[title=test]") 选择属性为title为test的元素
[attribute !=value] 选取属性的值不为value的元素 $("div[title!=test]") 选取属性title不为test的元素 没有title属性的也会被选中
[attribute ^=value] 选取属性的值以value值开始的元素 [attribute $=value] 选取属性的值以value值结束的元素
[attribute *=value] 选取属性的值包含value值的元素
[selector1][selector2][selectorN] 用属性选择器合并成一个复合属性选择器 满足多个条件 每选择一次 缩小一次范围 $("div[id][title$=test]") 选取拥有id属性的并且属性的 title以test结尾的div元素
子元素过滤选择器
:nth-child(index/even/oidd/equation) 选取每个父元素下的第index个子元素或者奇偶元素 index从1算起
:first-child 选取每个父元素的第一个子元素
:last-child 选取每个父元素的最后一个子元素
:only-child 如果某个元素是它父元素中唯一的子元素 那么将会被匹配 如果元素中含有其他元素 则不会被匹配
nth-child() 选组起是很常用的子元素过滤选择器 详细功能如下
1, :nth-child(even) 选取每个父元素下的索引值是偶数的元素
2, :nth-child(odd) 选取每个父元素下的索引值是奇数的元素
3, :nth-child(2) 选取每个父元素下索引为2的子元素
4, :nth-child(3n) 能选择每个父元素下的索引值是3的倍数的元素 n从0开始
5, :nth-child(3n+1) 能选择每个父元素下的索引值是(3n+1)的元素 n从0开始
----------------- 表单对象属性过滤选择器
:enabled 选取所有可用元素
:disabled 选取所有不可用元素
:checked 选取所有被选中的元素 单选框 复选框
:selected 选取所有被选中的选项元素 下拉列表
----------------- 表单选择器
:input 选取input textarea select button元素
:text 选取所有单行文本框
:password 选取所有密码框
:radio 选取所有单选按钮
:checkbox 选取所有多选框
:submit 选取所有提交按钮
:image 选取图像按钮
:reset 选取重置按钮
:button 选取所有按钮
:file 选取所有上传域
:hidden 选取所有不可见元素