JQuery选择器：获取对应标签对象

2023-07-25 22:50| 来源: 网络整理| 查看: 265

一、基本选择器【必须会】## 标题

1、id选择器通过id的属性获取标签对象例子：通过id属性将ol中的标签全部隐藏 $("#ll").css("display","none"); 2、类选择器：通过标签的class属性获取标签 $(".c1").css("display","none"); 3、标签选择器通过标签名获取标签对象语法：$(“标签名”) 将li标签的内容隐藏起来 $("li").css("display","none"); 4、多路选择器语法：$(“选择器，选择器,…”) $("li,p,input").css("display","none"); 5、全选择器语法：$(“*”) $("*").css("display","none");

二：层次选择器：## 标题

1、后代选择器获取标签对象中所有的子标签对象包括孙子语法：$(“选择器选择器”) $("#l1 li").css("display","none"); 2、直接子代选择器只获取相关的子标签孙子不算语法：$(“选择器>选择器”) $("#l1>li").css("display","none"); 3、直接兄弟选择器获取下一个兄弟语法：$(“选择器+选择器”) $("#d1+li").css("display","none"); 4、所有兄弟选择器获取后续所有的亲兄弟标签语法：$(“选择器~选择器”) $("#d1~li").css("display","none");

三：简单过滤选择器 ## 标题

1、:first 一组对象中的第一个标签对象 $("li:first").css("display","none"); 2、:last 一组对象中的最后一个标签对象 $("li:last").css("display","none"); 3、:eq(index) 等于某个下标获的标签对象 $("li:eq(2)").css("display","none"); 4、:gt(index) 大于某个下标获的标签对象 $("li:gt(1)").css("display","none"); 5、:lt(index) 小于某个下标获的标签对象 $("li:lt(1)").css("display","none"); 6、:even 偶数下标 $("li:even").css("display","none"); 7、:odd 奇数下标 $("li:odd").css("display","none"); 8、:not(选择器) 不包含指定选择器的标签对象 $("li:not(c1)").css("display","none");

四、内容过滤选择器## 标题

:empty 获取标签内部为空的标签对象 :parent 获取标签内部不为空的标签对象 :contains(text) 获取含有指定文本内容的标签对象

五、可见性过滤选择器## 标题

:hidden 获取隐藏的标签对象 :visible 获取可见的标签对象

六、属性过滤选择器【重点】## 标题

$(“选择器[属性名]”) 获取所有包含指定属性值的对象 $(“选择器[属性名=值]”) 获取所有包含指定属性名等于对应值的对象 $(“选择器[属性名!=值]”) 获取所有包含指定属性名不等于对应值的对象

七、与单选框和复选框相关的选择器## 标题

:checked 获取被选中的单选框或复选框对象

八、与下拉列表相关的选择器## 标题 :selected 获取被选中的下拉列表的option对象

九、与form表单相关的选择器更加方便的获取表单元素## 标题 :checkbox :input :text :password :radio :submit :image :reset :file :hidden $(“:属性名”)

【本文地址】

公司简介

联系我们