首页 > 代码库 > Jquery选择器小节

Jquery选择器小节

2024-07-28 10:25:13   218人阅读

在学习Jquery选择器之前我们先简单的回想一下CSS选择器；

以下为CSS常用选择器：
 
选择器语法描述示例
标签选择器

E{CSS规则 }

以文档元素作为选择器 
1 tr{2 　　border: solid 1px red;3 　　width: 120px;4 }5 a{6 　　text-decoration: none;7 }

 

 ID选择器 #ID{CSS规则 } 以文档的唯一标识符ID作为选择符 
1 ＃note{2 　　border: solid 1px red;3 　　width: 120px;4 }

 

 类选择器 E.className{CSS规则 } 以文档元素的class作为选择符 
1 div.note{2 　　border: solid 1px red;3 　　width: 120px;4 } 5 .note{6 　　border: solid 1px red;7 　　width: 120px;8 }

 

群组选择器  E1,E2,E3{CSS规则 } 多个选择符应用同样的样式 
td,p,div.aa{　　font-size: 12px;　　width: 120px;}

 

后代选择器  E F{CSS规则 } 元素E的任意后代元素F 
#main div{　　border: solid 1px red;　　width: 120px;}

 

通配选择符  ＊{CSS规则 } 以文档的所有元素作为选择符 
*{　　font-size:12px;}

 

  • Jquery基本选择器

　　基本选择器是Jquery中最常用的选择器，也是最简单的选择器，它通过元素ID、class和标签等查找DOM元素。在网页中每一个ID名称只能出现一次，class允许出现多次。基本选择器的介绍说明如下：

 选择器说明 示例 返回结果
 ＃id 根据给定的id匹配一个元素 $(‘#test‘)：选取id为test的元素 单个元素
 .class根据给定的类名匹配元素 $(‘.test‘)：远去所有的class为test的元素集合元素 
 element 根据给定的元素名匹配元素 $(‘p‘)：选取所有的p元素 集合元素 
 * 匹配所有的元素 $(‘*‘)：选取所有的元素 集合元素 
 selector1, selector2, selector3... 将每一个选择器匹配到的元素合并后一起返回 $(‘div,span,p.myClass‘):选取所有的div,span和拥有class为myClass的p元素 集合元素 

 

  •  Jquery层次选择器

Jquery选择器小节


联系
我们