• jQuery选择器


    jQuery选择器分类

    基本选择器 5(种)
    层次选择器 4
    过滤选择器 11+4+2+9+4+4
    表单选择器 11

    1.基本选择器

    • ID选择器
    • 类名选择器 .class
    • 元素选择器  element
    • 通配符选择器 *
    • 群组选择器

    2.层次选择器

    • $("ancestor descendant")  后代选择器
    • $("parent>child")  子元素选择器
    • $("prev+next")  选取紧接在prev元素后的next元素   等同于next()方法
    • $("prev~siblings")  选取prev元素之后的所有sibling元素  等同于nextAll()方法  

    3.过滤选择器

    • 基本过滤  11种
    • 内容过滤  4
    • 可见性过滤  2
    • 属性过滤   9
    • 子元素过滤  4
    • 表单对象属性过滤  4

    3.1基本过滤选择器

    • :not(selector)  去除所有与给定选择器匹配的元素
    • :header  选取所有表题元素,如h1,h2,h3等
    • :animated  选取正在执行动画的所有元素,如$("div:animated")选取正在执行动画的div元素
    • :focus  选取当前获取焦点的元素
    • :first  选取第一个元素
    • :last  选取最后一个元素
    • :eq(index)  选取索引等于index的元素
    • :gt(index)  选取索引大于index的元素
    • :lt(index)  选取索引小于index的元素
    • :even  选取索引是偶数的所有元素
    • :odd  选取索引是奇数的所有元素

    3.2内容过滤选择器

    • :contains(text)  选取含有文本内容为“”text”的元素
    • :has(selector)  选取含有选择器所匹配的元素,如$("div:has(p)")  选取含有p元素的div元素
    • :empty  选取不包含子元素或者文本的空元素
    • :parent  选取含有子元素或者文本的元素

    3.3可见性过滤选择器

    • :hidden  选取所有不可见的元素
    • :visible  选取所有可见的元素

    3.4属性过滤选择器

    • [attr]  选取拥有此属性的元素  $("div[id]")
    • [attr = value]  选取属性为value的元素      $("div[title=test]")
    • [attr != value]  选取属性不为value的元素 
    • [attr ^= value] 选取属性值以value开始的元素 
    • [attr $= value]  选取属性值以value结束的元素
    • [attr |= value]  选取属性值含有value的元素
    • [attr ~= value]  选取属性用空格分隔的值中包含一个给定值元素
    • [attr1][attr2][attr3]  用属性选择器合并成一个复合选择器,满足多个条件。每选择一次,缩小一次范围。eg:$("div[id][title$='test'")选取拥有属性ID,并且属性title以test结束的div元素

    3.5子元素选择器

    • :nth-child(index|even|odd|equation)  选取每个父元素下的第index个子元素或者奇偶元素(index从1算起)
    • :first-child  选取每个父元素的第一个子元素    eg:$("ul li:first-child")选取每个ul中的第一个li
    • :last-child  选取每个父元素的最后一个子元素
    • :only-child  选取独生元素,即某个元素是给定父元素的唯一子元素

    3.6表单对象属性过滤选择器

    • :enabled  选取所有可用元素
    • :disabled  选取所有不可用元素
    • :checked  选取所有被选中的元素(单、复选框)
    • :selected  选取所有被选中的选项元素(下拉列表)  eg:$("select option:selected");  选取所有被选中的option元素

    4.表单选择器

    • :input  选取所有<input><textarea><select><button>元素
    • :text  选取所有的单行文本框
    • :radio  选取所有的单选框
    • :checkbox  选取所有的多选框
    • :submit  选取所有的提交按钮
    • :image  选取所有的图像按钮
    • :reset  选取所有的重置按钮
    • :button  选取所有的按钮
    • :file  选取所有的上传域
    • :hidden  选取所有的不可见元素

    注意事项

      选择器中含有" . "、" # "  、" ( "或" ] "等特殊字符,要使用转义字符进行转义

      $("#id\#b");

      $("#id\[1\]");

  • 相关阅读:
    Nginx之负载均衡配置(二)
    Nginx之负载均衡配置(一)
    Nginx之反向代理配置(二)
    Nginx之反向代理配置(一)
    Nginx之常用基本配置(三)
    Nginx之常用基本配置(二)
    Nginx之常用基本配置(一)
    Linux系统WEB服务之Nginx基础入门
    Linux系统之LVS+Keepalived实现
    Linux系统之网络文件共享与数据实时同步实践
  • 原文地址:https://www.cnblogs.com/yugeyou/p/jquery_003.html
Copyright © 2020-2023  润新知