jQuery选择器详细介绍

  1. 基本选择器
    “#id” 根据id匹配一个元素 单个元素
    “element” 根据给定的元素名匹配多个元素 元素集合
    .class 根据给定的类匹配元素 元素集合
  • 匹配所有元素 元素集合
    selector1, selector2 将每一个选择器匹配的元素合并后一起返回 元素集合
  1. 层次选择器
    $(“ul li”) 根据祖先元素匹配到所有的后代元素 元素集合
    $(“ul>li”) 根据父元素匹配所有的子元素 元素集合
    prev + next 匹配所有紧接在prev元素后的相邻元素 元素集合 .next()
    prev ~ siblinges 匹配prev元素之后的所有兄弟元素 元素集合 .nextAll()

  2. 过滤选择器 以 开头
    :first 获取第一个元素 单个元素 frst()
    :last 获取最后一个元素 单个元素 lst()
    :not(selector) 获取除给定选择器外的所有元素 元素集合
    :even 索引值为偶数的元素 元素集合
    :odd 索引值为奇数的元素 元素集合
    :eq(index) 获取指定索引值的元素 单个元素
    :gt(index) 获取所有大于给定索引值的元素 元素集合
    :lt(index) 获取所有小于给定索引值的元素 元素集合
    :header 获取所有标题类型的元素 元素集合

  3. 内容过滤选择器
    :contains(text) 获取包含给定文本的元素 元素集合
    :empty 获取所有不包含子元素或者文本的元素 元素集合
    :has(selector) 获取含有选择器所匹配的元素的元素 元素集合
    :parent 获取含有子元素或者文本的元素 元素集合

  4. 可见性过滤选择器
    选择器 功能 返回值 备注
    :hidden 获取所有不可见元素 元素集合
    :visible 获取所有可见的元素 元素集合

  5. 属性过滤选择器 以【开始,以】结尾
    $(“button[id]”) 获取包含给定属性的元素 元素集合
    $(“button[id=‘btn’]”) 属性是某个特定值的元素 元素集合
    != 不等于特定值的元素 元素集合
    ^= 以特定值开始的元素 元素集合
    $= 以特定值结尾的元素 元素集合
    *= 包含特定值的元素 元素集合

  6. 子元素过滤选择器
    :nth-child(2) 获取每个父元素下的特定位置元素,索引从1开始 元素集合
    :first-child 获取每个父元素下的第一个子元素 元素集合
    :last-child 获取每个父元素下的最后一个子元素 元素集合
    :only-child 获取每个父元素下的仅有一个子元素 元素集合

  7. 表单对象属性过滤选择器
    :checked 单选框复选框被选中的元素 元素集合
    :selected 下拉框被选中的元素 元素集合

©️2020 CSDN 皮肤主题: 大白 设计师:CSDN官方博客 返回首页