jQuery选择器 与 过滤器

什么是选择器
jQuery 模仿 CSS 选择器的语法提供了一种用来方便查找要操作的节点的语法规则。
一 基本选择器
1 Css选择器
1）#id：ID 选择器，如：KaTeX parse error: Expected 'EOF', got '#' at position 3: ('#̲d1') 2）.class：…(’.s1’)
3）element：标签选择器，如：${(}^{\prime }di{v}^{\prime })4）selector1,selector2...selectorn：群组选择器，如：$(’#d1,p’).
5）：通用选择器，如：$(’’)

2 层次选择器
1） 后代元素选择器 select1 select2：所有后代（要符合 select2 的要求） 。
2）子元素选择器 select1>select2：只考虑子节点（要符合 select2 的要求） ，孙子不管～
3）紧邻同辈元素选择器select1+select2：下一个兄弟（要符合 select2 的要求） ，儿子不管～
4）相邻同辈/兄弟元素选择器 select1~select2：下面所有的兄弟（要符合 select2 的要求） ，上面的兄弟不管～兄弟中
的儿子也不管～

3 表单域选择器
1）:input：所有表单元素。 2）:text：文本框。 3）:pasword：密码框。
4）:radio：单选。 5）:checkbox：多选。 6）:submit：提交按钮。
7）:image：图片。 8）:reset：重置按钮。 9）:button：普通按钮
注:$(“input”) 标签选择器选择所有的input标签
$(":input") 表单域选择器选择所有的表单元素
二 过滤选择器

4 基本过滤选择器/位置
1）:first：第一行。
2）:last：最后一行。
3）:not(selector)：把满足要求的选择器排除在外。 去除所有与给定选择器匹配的元素使用选择器
4）:even：偶数行，下标从 0 开始。匹配选择器所获取的元素中索引值为奇数的元素
5）:odd：奇数行，下标从 0 开始。匹配选择器所获取的元素中索引值为偶数的元素
6）:eq(index)：等于下标的元素，下标从 0 开始。
7）:gt(index)：大于下标的元素，下标从 0 开始。
8）:lt(index)：小于下标的元素，下标从 0 开始。
 注意事项：过滤器前是没有空格的。是 xx:first 而不是 xx :first。

5 内容过滤选择器
1）:contains(text)：匹配包含给定文本的元素。$("div:contains(abc)")
2）:empty：匹配所有不包含子元素或者文本的空元素。$("div:empty")
3）:has(selector)：匹配含有选择器所匹配的元素的元素。$("div:has(p)")
4）:parent：匹配含有子元素或者文本的元素（与 empty 正好相反） 。

6 可见性过滤选择器
1）:hidden 匹配所有不可见元素，或者 type 为 hidden 的元素。
2）:visible 匹配所有的可见元素。

7 属性过滤选择器
1）[attribute]：有某个属性的元素。
例如：$('div[id]').css('font-size','60px');//div 中有 id 属性的元素
2）[attribute=value]：某个属性的值与指定的值相同的元素。
例如：$('div[id=d1]').css('font-size','60px');//id是d1的元素
3）[attribute!=value]：某个属性的值与指定的值不相同的元素。
例如：$('div[id!=d1]').css('font-size','60px');//id不是d1的元素

8 子元素过滤选择器
1）:nth-child(index/even/odd)：对符合条件的每个节点的子节点作相同操作。
$("tr td:nth-child(2)").css("background-color", "blue"); 将第2列变色

9 表单对象属性过滤选择器
3）:checked：单选框、多选框中被选中的选项。
例如：alert($(":radio:checked").val());//把值输出，类似于 value 属性
4）:selected：下拉列表中被选中的选项。
例如：alert($("select option:selected").val())/alert($("select").val());