前言
jQuery选择器非常非常强大而且灵活,要完全掌握它是需要狠下一番功夫的。当然,掌握了主要的部分后,其它的了解就好,因为一些比较偏的毕竟用得少,而且可以有其它方法来实现。
选择器
1 基本选择器
1.1 #id选择器,通过元素的id来查找对象,
例:$("#txtTime")
查找id为txtTime的元素
1.2 html标签选择器,通过html标签来查找对象,例:
$("div")
查找标签为div的所有元素
1.3 .css类选择器,通过元素使用的css类名来查找对象,例:
$(".title")
查找css类名为title的元素
1.4 *,选取所有元素,例:$("*")
1.5 xx,xx,xx多选择器,多个选择器一起使用(逗号分隔),例:
$("div,#txtname")
查找所有的div元素和id为txtName的元素
2 层级关系选择器
2.1 在所有子孙元素中匹配(使用空格),例:
$("body div")
查找body元素下的所有子孙节点中的div元素
2.2 在所有子元素中匹配(使用>号),例:
$("body>div");
查找body元素下所有儿子节点中的div元素
3 简单条件选择器
3.1 :not(…) :非选择器,祛除匹配的元素,例:
$("div:not(.txtRed)");
查找所有的div元素,并排除css类名为txtRed的div元素
3.2 :eq(index) :匹配一个给定索引值的元素,例:
$("div:eq(1)");
查找所有div元素,并只取查找到的元素数组的索引号为1的div元素
3.3 :gt(index) :匹配大于给定索引值的元素,例:
$("div:gt(1)");
查找所有div元素,并取查找到的元素数组的索引号大于1的div元素
3.4 :lt(index) :匹配小于给定索引值的元素,例:
$("div:lt(1)");
查找所有div元素,并取查找到的元素数组的索引号小于1的div元素
3.5 :contains(text) :匹配包含给定文本的元素,例:
$("div:contains('name')");
查找所有div元素,并取查找到的元素包含name文本的div元素
3.6 :hidden、:visible :匹配所有隐藏的、可见的元素,例:
$("div:hidden");
查找所有div元素,并取所有隐藏了的div元素
4 属性选择器
4.1 […] :匹配包含给定属性的元素,例:
$("div[id]")
查找包含id属性的div元素
4.2 [attribute(=/!=/^=/$=/*=)value] :匹配给定的属性值(等于、不等于、开头为、结束为、包含)给定的value值,例:
$("div[id='title']")
查找id等于title的div(注意:值应该用引号括起来,如’value’)
4.3 […][…][…] :多属性联合使用,例:
$("div[id='txt'][class='title']")
查找id为txt且class为title的div
$("input[type='checkbox'][checked='true']")
查找所有的被勾选了的复选框
5 查找选择器
5.1 $("...").children([…]) :获取所有匹配元素的儿子节点的匹配元素,例:
$("body").children().length
获取body元素的所有儿子节点元素
$("body").children("div").length
获取body元素的所有儿子节点元素中的div元素
5.2 $("...").closest("...") : 从元素本身开始,逐级向上查找匹配的元素,并返回最新查找到的元素,例:
$("#dd").closest("div").html()
查找id为dd的元素的最近的上级div元素
5.3 $("...").find("...") :查找元素下的匹配元素(所有子孙节点),例:
$("body").find("div").length
获取body节点下的所有div元素
5.4 $("...").parent() :获取元素的父亲节点元素,例:
$("#yy").parent().html()
获取id为yy的节点的父亲节点
5.5 $("...").parents("...") :获取元素的所有祖先节点或其中的匹配节点,例:
$("#yy").parents().length
获取id为yy的节点的所有祖先节点
$("#yy").parents("body").html()
获取id为yy的节点的祖先节点为body标签的元素
标签:jQuery,元素,之二,查找,id,节点,div,选择器 From: https://blog.51cto.com/u_15906220/5920650