• 2 jquery选择器


    一基本选择器
    #id
    .class
     elment
     * 
    select1, select2, select3... 例 $("span, #two").css("background","bbffaa")//改变所有的<span>元素id为two的元素背景色
    二层次选择器 
    $("div span") div内所有span元素
    $("div>span")  div下的span子元素
    $(".one+div")  class为One的下一个div同辈元素,返回集合元素,即$("pre+next"),等价于 $(".one").next("div")
    $("#two~div")  id为two 的元素后的所有div同辈元素即 $("prev~siblings")等价与 $("#two").nextAll("div")
    $("prev~siblings")选择器与siblings()方法的比较:$("prev~siblings")选择器只能选择“prev”后面的同辈div元素,而siblings()方法与前后位置无关。
    三过滤选择器(:)
    1 基本过滤选择器
    :first
    :last
    :header   //标题
    :focus   //  选取当前获取焦点的元素
    :animated  //所有动画元素
    :even
    :odd
    :not(selected)
    :eq(index)
    :gt(index)    //greater than
    :lt(index)     //less than
    2 内容过滤选择器
    :contains(text)
    :empty
    :has(selector)
    :parent  //拥有子元素(包括文本元素)
    3 可见性过滤选择器
    :hidden
    :visible
    4 属性过滤选择器
    [atttibute]
    [atttibute=value]
    [atttibute!=value]
    [atttibute^=value]  //以value开始
    [atttibute$=value]  //以value结尾
    [atttibute*=value]  //含有
    [atttibute|=value]  //等于或为前缀

       [atttibute~=value]  //用空格分割的含有value的元素

    
    
    [atttibute1][atttibute2=value][atttibuteN]
    [atttibute=value]
    5 子元素过滤选择器
    :nth-child(index/even/odd/equation)  //选取每个父元素下的第index个子元素或奇偶元素,Index从1计算;
                          eq(index)只匹配一个元素,且从index=0计;
    :first-child
    :last-child
    :only-child  //是唯一的子元素
    6 表单对象属性过滤选择器
    $(":enabled")             所有的可操作的表单元素 
    $(":disabled")            所有的不可操作的表单元素 
    $(":checked")            所有的被checked的表单元素 
    $("select option:selected") 所有的select 的子元素中被selected的元素 
    四表单选择器
    $(":input")                  选择所有的表单输入元素,包括input, textarea, select 和 button
    $(":text")                     选择所有的text input元素 
    $(":password")           选择所有的password input元素 
    $(":radio")                   选择所有的radio input元素 
    $(":checkbox")            选择所有的checkbox input元素 
    $(":submit")               选择所有的submit input元素 
    $(":image")                 选择所有的image input元素 
    $(":reset")                   选择所有的reset input元素 
    $(":button")                选择所有的button input元素 
    $(":file")                     选择所有的file input元素 
    $(":hidden")               选择所有类型为hidden的input元素或表单的隐藏域  
    五注意事项
    1 选择器中含有“.”,"#","(","]"等特殊字符---要用转义符转义
    2 属性选择器中的@符号
    3 选择器中的空格
    例:var $a=$(".test  :hiddden")//带空格,表示class为test里面的所有隐藏元素,是后代选择器
      var $b=$(".test:hiddden")//不带空格,隐藏的class为test 的元素,是过滤选择器
     4 注意$("#form :input")与$("#form input")
  • 相关阅读:
    HTML区块
    HTML表单
    JavaScript 表单验证
    HTML头部
    JavaScript
    设计模式—单例模式的六种写法
    new
    new
    new
    new
  • 原文地址:https://www.cnblogs.com/houxiaohang/p/4984535.html
Copyright © 2020-2023  润新知