jQuery选择器详解

Posted 2020-08-21 cc_ccc

根据所获取页面中元素的不同，可以将jQuery选择器分为4大类：基本选择器、层次选择器、过滤选择器、表单选择器。

　　其中，过滤选择器有可以分为6种：简单过滤选择器、内容过滤选择器、可见性过滤选择器、属性过滤选择器器、子元素过滤选择器、表单对象属性过滤选择器。

1、基本选择器

　　#id、* 、.class 、元素标签 、selector 、selectorAll

2、层次选择器

　　后代、父子、相邻、兄弟： parent 、child 、prev 、 next 、 siblings 、+ 、 > 、~ 、空格

3、过滤选择器

　　根据某类过滤规则进行元素的匹配，书写时都以冒号（：）开头。

　　简单：     ：first 、 ：last 、 ：not（selector） 、 ：even 、 ：odd 、 ：eq（index） 、 ：gt（index）、：lt（index） 、

　　　　　     ：header 获取所有标题类型的元素、 ：animated 获取正在执行动画效果的元素

　　内容：     ：contains（text） 获取包含给定文本的元素 、：empty 获取所有不包含子元素或文本的元素 、 ：has（selsctor） 获取含有选择器所匹配的元素的元素 、

　　　　　     ：parent 获取含有子元素或文本的元素

　　可见性：  ：hidden 获取所有不可见的或者类型为hidden的元素 、 ：visible 获取所有可见的元素

　　属性：      [attribute] 、 [attribute=value] 、 [attribute!=value] 、[attribute^=value] 开头 、[attribut$=value] 结尾 、

　　　　　　   [attribute*=value]  包括 、 [selector1] [selector2] [selectorN] 获取满足多个条件的复合属性的元素
　　子元素：  ：nth-child（eq|even|odd|index）索引从1开始 、：first-child 、：last-child 、 ：only-child 获取每个父元素下的仅有一个子元素

　　表单对象属性： ：enabled 获取表单中所有属性为可用的元素 、：disabled 获取表单中所有属性为不可用的元素 、 ：checked 获取表单中所有被选中的元素 、

　　　　　　　　　 ：selected 获取表单中所有被选中option的元素

4、表单选择器

　　：input 获取所有的input、textarea、select

　　：text 获取所有单行文本框　　

　　：password 获取所有密码框

　　：radio 获取所有单选按钮

　　：checkbox 获取所有复选框

　　：submit

　　：image 获取所有图像域

　　：reset 获取所有的重置按钮

　　：button

　　：file 获取所有文件域
　

参考文献：

　　jQuery权威指南 机械工业出版社 陶国荣 著