Copyright © 2002-2027 web-phoenix.net 【凤凰网络】 版权所有 All Rights Reserved.
【凤凰网络】提供优质的云南网站建设一条龙全包服务,从网站制作到云南百度竞价推广,以及昆明百度竞价托管代运营全套服务,看得见的效果!
【凤凰网络】提供优质的云南网站建设一条龙全包服务,从网站制作到云南百度竞价推广,以及昆明百度竞价托管代运营全套服务,看得见的效果!
当前位置: 网站首页 > 网站建设教程 >
十五天快速学会JQuery选择器（第十二天）
1、其他简单选择器
| 名称 | 用法 | 描述 |
|---|---|---|
| ID选择器 | $("#id"); | 获取指定ID的元素 |
| 全选选择器 | $('*'); | 匹配所有元素 |
| 类选择器 | $(".class"); | 获取同一类class的元素 |
| 标签选择器 | $("div"); | 获取同一类标签的所有元素 |
| 并集选择器 | $("div,p,li"); | 使用逗号分隔，只要符合条件之一就可。获取所有的div、p、li元素 |
| 交集选择器标签指定式选择器） | $("div.redClass"); | 注意选择器1和选择器2之间没有空格，class为redClass的div元素，注意区分后代选择器。 |
2、层级选择器
| 名称 | 用法 | 描述 |
|---|---|---|
| 子代选择器 | $("ul>li"); | 使用>号，获取儿子层级的元素，注意，并不会获取孙子层级的元素 |
| 后代选择器 | $("ul li"); | 使用空格，代表后代选择器，获取ul下的所有li元素，包括孙子等 |
3、过滤选择器
| 语法 | 用法 | 描述 |
|---|---|---|
| :first | $('li:first'); | 获取第一个元素 |
| :last | $('li:last'); | 获取最后个元素 |
| :contains(text) | $("div:contains('John')") | 匹配包含给定文本的元素 |
| :not(selector) | $("input:not(:checked)") | 去除所有与给定选择器匹配的元素 |
| :eq(index) | $("li:eq(2)").css("color", "red"); | 获取到的li元素中，选择索引号为2的元素，索引号index从0开始。 |
| :odd | $("li:odd").css("color", "red"); | 获取到的li元素中，选择索引号为奇数的元素 |
| :even | $("li:even").css("color", "red"); | 获取到的li元素中，选择索引号为偶数的元素 |
4、属性选择器
| 用法 | 说明 |
|---|---|
| $("p[attr]") | 选取所有该p标签且具有attr属性的节点 |
| $("p[attr=a_value]") | 选取所有p标签且具有attr属性并满足属性值为a_value的节点 |
| $("p[attr^=a_value_head]") | 选取所有p标签且attr属性的属性值是以a_value_head开头的 |
| $("p[attr$=a_value_end]") | 选取所有p标签且attr属性的属性值是以a_value_end结尾的 |
| $("p[attr*=a_value") | 选取所有p标签且attr属性的属性值中包含a_value |
5、筛选方法
| 语法 | 用法 | 说明 |
|---|---|---|
| parent() | $("#first").parent(); | 查找父亲 |
| children(selector) | $("ul").children("li") | 相当于$("ul>li")，子类选择器 |
| find(selector) | $("ul").find("li"); | 相当于$("ul li"),后代选择器 |
| siblings(selector) | $("#first").siblings("li"); | 查找兄弟节点，不包括自己本身。 |
| nextAll([expr]) | $("div:first").nextAll() | 查找当前元素之后所有的同辈元素。 |
| prevtAll([expr]) | $("div:first").prevAll() | 查找当前元素之前所有的同辈元素 |
| hasClass(class) | $('div').hasClass("protected") | 检查当前的元素是否含有某个特定的类，如果有，则返回true。 |
| eq(index) | $("li").eq(2); | 相当于$("li:eq(2)"),index从0开始 |
| not(exp) | $("p").not("#selected") | 删除与指定表达式匹配的元素 |
【十五天快速学会JQuery选择器（第十二天）热度：56】 【更多网站建设教程】