欢迎您访问程序员文章站本站旨在为大家提供分享程序员计算机编程知识!
您现在的位置是: 首页  >  IT编程

jQuery选择器详细介绍

程序员文章站 2022-03-07 14:01:43
基本选择器“#id”根据id匹配一个元素单个元素“element”根据给定的元素名匹配多个元素元素集合.class根据给定的类匹配元素元素集合匹配所有元素元素集合selector1, selector2将每一个选择器匹配的元素合并后一起返回元素集合层次选择器$(“ul li”)根据祖先元素匹配到所有的后代元素元素集合$(“ul>li”)根据父元素匹配所有的子元素元素集合prev + next匹配所有紧接在prev元素后的相邻元素元素....
  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 下拉框被选中的元素 元素集合

本文地址:https://blog.csdn.net/Llaqwer/article/details/107900807

相关标签: js jquery