jQuery中的选择器

基本选择器
#id      //id选择器
.class   //类选择器
element  //标签选择器
*        //匹配所有元素

层次选择器

通过DOM元素之间的层次关系来获取特定元素,如后代元素,子元素,相邻元素和兄弟元素.

$("ancestor descendant")  //后代选择器
$("parent>child")         //子代选择器
$("prev+div")             //兄弟选择器   选取prev元素后的下一个div元素
$("prev~sibling")         //兄弟选择器   选取prev元素后的所有sibling元素

过滤选择器

过滤选择器规则与CSS中的伪类选择器语法相同
选择器都以一个冒号(:)开头
过滤规则:基本过滤.内容过滤.可见性顾虑.属性过滤.子元素过滤.表单对象属性过滤

:first //选取第一个元素  单个元素
:last //选取最后一个元素 单个元素
:not(selector) //去除所有给定选择器匹配的内容  集合元素    
                eg:$("input:not(.text)")  选取class不是text的<input>元素
:even //选取索引是偶数的所有元素,索引从0开始 集合元素
:odd //选取索引是奇数的所有元素,索引从0开始 集合元素
:eq(index) //选取索引等于index的元素(index从0开始) 单个元素 
:gt(index) //选取索引大于index的元素(index从0开始)
           eg:$("ul>li:gt(5):not(:last)") //选取索引号大于5的li标签,并且不包含最后一个li元素
:it(index) //选取索引小于index的元素(index从0开始)
:header //选取所有的标题元素,例如 h1,h2,h3等 集合元素 
:animated //选取当前正在执行动画的所有元素 集合元素 
          eg:$("div:animated")选取正在执行动画的<div>元素

子元素过滤选择器
:nth-child(index/even/odd) //index从1开始 ,而eq(index)中的index是从0开始
:first-child 选取父元素中的第一个子元素
:last-child 选取父元素中最后一个子元素

表单对象属性过滤选择器
:enabled //选取所有可用元素 集合元素 
:disabled //选取所有不可用元素
:checked //选取所有被选中的元素(单选框,复选框)  集合元素
:selected //选取所有被选中的选项元素(下拉列表)  集合元素 
最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • css选择器 层级选择器 表单选择器 基本过滤器 内容过滤器 属性过滤器 子元素过滤器 可见性过滤选择器 表单属性...
    Victor细节阅读 342评论 0 1
  • 一、样式篇 第1章 初识jQuery (1)环境搭建 进入官方网站获取最新的版本 http://jquery.co...
    凛0_0阅读 3,451评论 0 44
  • 环境搭建 进入官方网站获取最新的版本 http://jquery.com/download/ ,这里需要注意 j...
    阿r阿r阅读 823评论 0 7
  • 主讲:董桂红老师 《纽崔莱的品牌故事》 毕业于南京医科大学,在医院临床与管理15年经验,之后从事营养及美容行业10...
    ohyear阅读 416评论 0 0
  • https://blog.jdriven.com/2016/12/angular2-spring-boot-get...
    ilkkzm阅读 281评论 0 0