选择器是jQuery最基础的东西,本文中列举的选择器基本上囊括了所有的jQuery选择器,也许各位通过这篇文章能够加深对jQuery选择器 的理解,它们本身用法就非常简单,我更希望的是它能够提升个人编写jQuery代码的效率。本文配合截图、代码和简单的概括对所有jQuery选择器进行了介绍,也列举出了一些需要注意和区分的地方
1、基本选择器(重点)
- #id:根据元素的id属性来获取元素
- element:根据元素的名称来获取元素
- selector1,selector2:同时获取多个元素
- .class:根据元素的class属性来获取元素
2、层级选择器(重点)
- ancetor descendant :选取祖先元素下的所有后代元素(多级)
- parent > child :选择父元素下的所有子元素(一级)
- prev + next :选取当前元素紧邻的下一个同级元素
- prev~ siblings :选取当前元素后面的所有同级元素
3、简单选择器
- :first :获取第一个元素
- :last :获取最后一个元素
- :even 偶数,获取偶数行数据
- :odd 奇数,获取奇数行数据
- :eq(index) :获取索引等于index的元素,index默认从0开始
- :gt(index) 大于,获取索引大于index的元素
- :lt(index) 小于,获取索引小于index的元素
- :not(selector):获取除指定选择器以外的其他元素
4、内容选择器
- :contains(text):获取内容包含text文本的元素
- :empty:获取内容为空的元素
- :has(selector) :获取内容包含指定选择器的元素
- :parent :获取内容不为空的元素(特殊)
5、可见性选择器
- :hidden:获取所有隐藏元素
- :visible:获取所有可见元素
6、属性选择器
- [attribute]:获取具有指定属性的元素
- [attribute=value]:获取属性值等于value的元素
- [attribute!=value] :获取属性值不等于value的元素
- [attribute^=value] :获取属性值以value开始的元素
- [attribute$=value] :获取属性值以value结尾的元素
- [attribute*=value] :获取属性值包含value的元素
- [attribute1][attribute2]…[attributeN] :获取同时拥有多个属性的元素
7、子元素选择器
- :nth-child(index/even/odd) 从1算起,匹配子元素等于index/even/odd的元素
- :first-child :获取第一个子元素
- :last-child :获取最后一个子元素
- :only-child :如果当前元素是唯一的子元素,则匹配
8、表单选择器
- :input :选取页面中的所有表单元素,包含select以及textarea元素
- :text :选取页面中的所有文本框
- :password:选取所有的密码框
- :radio :选取所有的单选按钮
- :checkbox:选取所有的复选框
- :submit :获取submit提交按钮
- :reset:获取reset重置按钮
- :image:获取type=’image’的图像域
- :button:获取button按钮
- :file:获取type=’file’的文件域
- :hidden:获取隐藏表单
9、表单对象属性选择器
- :enabled:获取所有可用表单元素
- :disabled:获取所有不可用表单元素
- :checked:获取所有选中的表单元素,主要针对radio以及checkbox
- :selected:所有所有选中的表单元素,主要针对select
发表评论
沙发空缺中,还不快抢~