jQuery选择器

jQuery选择器

一、前言

　　选择器是 jQuery 的根基, 在 jQuery 中, 对事件处理, 遍历 DOM 和 Ajax 操作都依赖于选择器

　　jQuery 选择器的优点:
　　①简洁的写法                                                                                    

　　②完善的事件处理机制

二、jQuery简单选择器

　　基本选择器

　　基本选择器是 jQuery 中最常用的选择器, 也是最简单的选择器, 它通过元素 id, class 和标签名来查找 DOM 元素(在网页中 id 只能使用一次, class 允许重复使用).

　　层次选择器

　　如果想通过 DOM 元素之间的层次关系来获取特定元素, 例如后代元素, 子元素, 相邻元素, 兄弟元素等, 则需要使用层次选择器.

　　注意:  (“prev ~ div”) 选择器只能选择 “# prev ” 元素后面的同辈元素; 而 jQuery 中的方法 siblings() 与前后位置无关, 只要是同辈节点就可以选取

三、jQuery过滤选择器

　　过滤选择器主要是通过特定的过滤规则来筛选出所需的 DOM 元素, 该选择器都以 “:” 开头

　　按照不同的过滤规则, 过滤选择器可以分为基本过滤, 内容过滤, 可见性过滤, 属性过滤, 子元素过滤和表单对象属性过滤选择器.

　　基本过滤选择器

　　内容过滤选择器

　　内容过滤选择器的过滤规则主要体现在它所包含的子元素和文本内容上

　　可见性过滤选择器

　　可见性过滤选择器是根据元素的可见和不可见状态来选择相应的元素

　　注意:hidden 不仅包含样式属性 display 为 none 的元素, 也包含文本隐藏域 (<input  type=“hidden”>)和 visible:hidden 之类的元素

　　属性过滤选择器

　　属性过滤选择器的过滤规则是通过元素的属性来获取相应的元素

　　子元素过滤选择器

　　nth-child() 选择器详解如下：
　　(1) :nth-child(even/odd): 能选取每个父元素下的索引值为偶(奇)数的元素
　　(2):nth-child(2): 能选取每个父元素下的索引值为 2 的元素
　　(3):nth-child(3n): 能选取每个父元素下的索引值是 3 的倍数 的元素
　　(3):nth-child(3n + 1): 能选取每个父元素下的索引值是 3n + 1的元素

　　表单对象属性过滤选择器

　　此选择器主要对所选择的表单元素进行过滤

　　表单选择器

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------

如果，您对我的这篇博文有什么疑问，欢迎评论区留言，大家互相讨论学习。
如果，您认为阅读这篇博客让您有些收获，不妨点击一下右下角的【推荐】。
如果，您希望更容易地发现我的新博客，不妨点击一下左下角的【关注我】。
如果，您对我的博文感兴趣，可以关注我的后续博客，我是【AlbertRui】。

转载请注明出处和链接地址，欢迎转载，谢谢！

-------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------------