zoukankan      html  css  js  c++  java
  • Jquery选择器

     

    分类 方法名称 示例 说明 返回值
    基本 #id $('#test'):选取id为test的元素 根据给定的id匹配相应元素  Array<Element>
    element $('div'):选取所有的div元素 根据给定的元素名匹配相应的元素 Array<Element(S)>
    .class $('.test'):选取class为test的元素 根据给定的元素class匹配相应的元素 Array<Element(S)>
    * $('*'):选取所有的元素 匹配所有元素  Array<Element(S)>
    selector1,selector2,selector3... $('div,span,p.myClass'):选取所有div,span以及p元素中class为myClass的元素并且合并后一起返回 将每一个选择器匹配到的元素合并到一起并返回  Array<Element(S)> 
        
    层级  ancestor descendant $("div span"):选取<div>里的所有的<span>元素  在给定的祖先元素下匹配所有的后代元素  Array<Element(S)>
     parent>child

    $("div > span"):选取<div>元素下元素名是<span>的子元素

    两者区别在于前者检索出所有后代,后者只是检索儿子

     在给定的父元素下匹配所有子元素  Array<Element(S)>
    prev+next   $(".one + div"):选取class为one的下一个<div>同辈元素  匹配紧接在prev元素后的next元素  Array<Element(S)>
    prev~siblings   $("#two~div"):选取id为two的元素后面的所有<div>同辈元素  匹配prev元素之后的所有siblings元素  Array<Element(S)>
         
    基本过滤器             :first  $("div:first")选取所有<div>元素中第一个<div>元素  匹配找到的第一个元素  Array<Element>
     :last  $("div:last")选取所有<div>元素中最后一个<div>元素  匹配找到的最后一个元素  Array<Element>
     :not(selector)  $("input:not(myClass)")选取class不是myClass的<input>元素  去除所有与给定选择器匹配的元素  Array<Element(S)>
     :even  $("input:even")选取索引是偶数的<input>元素 0算偶数 匹配所有索引为偶数的元素,从0开始计数   Array<Element(S)>
     :odd  $("input:odd")选取索引是奇数的<input>元素  匹配所有索引为奇数的元素,从0开始计数   Array<Element(S)>
     :eq(index)  $("input:eq(1)")选取索引等于1的<input>元素  匹配一个给定索引的元素  Array<Element>
     :gt(indfex)  $("input:gt(1)")选取索引大于1的<input>元素  匹配所有大于给定索引值的元素  Array<Element(S)>
     :lt(index)   $("input:lt(1)")选取索引小于1的<input>元素   匹配所有小于给定索引值的元素  Array<Element(S)>
     :header   $(":header")选取网页中所有的<h1>,<h2>,<h3>...  匹配如h1,h2,h3之类的标题元素  Array<Element(S)>
     :animated  $("div:animated")选取正在执行动画的<div>元素  匹配所有正在执行动画的元素  Array<Element(S)>
     :focus  $(":focus")选取当前获取焦点的元素  匹配当前获取焦点的元素  Array<Element(S)>
         
    内容过滤器      :contains(text)   $("div:contains("我")") 选取含有文本”我“的<div>元素  匹配包含给定文本的元素  Array<Element(S)>
     :empty  $("div:empty")选取不包含子元素(包括文本元素)的<div>空元素  匹配所有不包含子元素或文本的空元素 Array<Element(S)> 
     :has(selector)   $("div:has(p)")选取含有<p>元素的<div>元素 匹配含有选择器所匹配的元素的元素  Array<Element(S)> 
     :parent  $("div:parent")选取拥有子元素(包括文本元素)的<div>元素  匹配含有子元素或者文本的元素  Array<Element(S)>
         
    可见过滤器    :hidden  $(":hidden")选取所有不可见的元素。包括<input type="hidden"/>,<div style="display:none;">和<div style="visibility:hidden;">.如果只想选取               <input>元素,可以使用$("input:hidden");  匹配所有的不可见元素,如果<input>元素的type属性为hidden也会被匹配到  Array<Element(S)>
    :visible $("div:visible")选取所有可见的<div>元素 匹配所有的可见元素 Array<Element(S)>
     
    属性过滤器 [attribute] $("div[id]")选取拥有属性id的元素 匹配包含给定属性的元素 Array<Element(S)>
    [attribute=value] $("div[title=test]")选取属性title为”test“的<div>元素 匹配给定的属性是某一个特定值的元素 Array<Element(S)>
    [attribute!=value] $("div[title!=test]")选取属性title不等于"test"的<div>元素(没有属性title的<div>元素也会被选取) 匹配给定属性是不包含某个特定值的元素 Array<Element(S)>
    [attribute^=value] $("div[title^=test]")选取属性title以”test“开始的<div>元素 匹配给定的属性是以某个值开始的元素 Array<Element(S)>
    [attribute$=value] $("div[title$=test]")选取属性title以”test“结束的<div>元素 匹配给定的属性是以某个值结尾的元素 Array<Element(S)>
    [attribute*=value] $("div[title*=test]")选取属性title含有”test“的<div>元素 匹配给定的属性是含有某个值的元素 Array<Element(S)>
    [attribute=value] $("div[title|='en']")选取属性title等于en或以en为前缀(该字符串后跟一个连字符‘-’)的<div>元素 匹配给定的属性是以某个值为前缀的元素 Array<Element(S)>
    [attribute~=value] $("div[title~='uk']")选取属性title用空格分隔的值中包含字符uk的<div>元素   Array<Element(S)>
    [attribute1][attribute2]...[attributeN] $("div[id][title$='test']")选取拥有属性id,并且属性title以"test"结束的<div>元素   Array<Element(S)>
     
    子元素过滤器 :nth-child

    :eq(index)只匹配一个元素,而:nth-child将为每一个父元素匹配子元素,并且:nth-child(index)有index从1开始,而eq(index)是从0开始的

    :nth-child(even)能选取每个父元素下的索引值是偶数的元素

    :nth-child(odd)能选取每个父元素下的索引值是奇数的元素

    :nth-child(2)能选取每个父元素下的索引值等于2的元素

    :nth-child(3n)能选取每个父元素下的索引值是3的倍数的元素(n从1开始)

    :nth-child(3n+1))能选取每个父元素下的索引值是3n+1的元素(n从1开始)

    匹配其父类元素下的第N个子元素或奇偶等元素 Array<Element(S)>
    :first-child :first只返回单个元素,而first-child选择符将为每一个父元素匹配第一个子元素,例如$("ul li:first-child");选取每个<ul>中第一个<li>元素 匹配所有父类元素的第一个子元素 Array<Element(S)>
    :last-child :同样,:last只返回单个元素,而:last-child选择符将为每个父元素匹配最后一个子元素,例如$("ul li:last-child")选取每个<ul>中最后一个<li>元素 匹配所有父类元素的最后一个元素 Array<Element(S)>
    :only-child $("ulli:only-child")在<ul>中选取是惟一子元素的<li>元素 匹配所有父类元素的唯一一个子元素。如果某个元素是父类元素中唯一的子元素,则将会被匹配 Array<Element(S)>
     
    表单过滤器 :enabled $("#form1 :enabled")选取id为"form1"的表单内的所有元素可用的元素   Array<Element(S)>
    :disabled $("#form2 :disabled")选取id为“form2”的表单内的所有不可用元素   Array<Element(S)>
    :checked $("input :checked")选取所有被选中的<input>元素(单选框,复选框)   Array<Element(S)>
    :selected $("select option :selected")选取所有被选中的选项元素(下拉列表)   Array<Element(S)>
     
    表单选择器 :input $(":input")选取所有<input>、<textarea>、<select>、<button> 匹配所有的<input><textarea><select><button>的元素 Array<Element(S)>
    :text $(":text")选取所有的单行文本框 匹配所有单行文本框 Array<Element(S)>
    :password $(":password")选取所有的密码框 匹配所有密码框 Array<Element(S)>
    :radio $(":radio")选取所有的单选框 匹配所有单选框 Array<Element(S)>
    :checkbox $(":checkbox")选取所有的复选框 匹配所有复选框 Array<Element(S)>
    :submit $(":submit")选取所有提交的按钮 匹配所有提交按钮 Array<Element(S)>
    :image $(":image")选取所有的图像域 匹配所有图像域 Array<Element(S)>
    :reset $(":reset")选取所有的重置按钮 匹配所有重置按钮 Array<Element(S)>
    :button $("button")选取所有的按钮 匹配所有按钮 Array<Element(S)>
    :file $(":file")选取所有的上传域 匹配所有文件域 Array<Element(S)>
    :hidden $(":hidden")选取所有不可见元素 匹配所有不可见元素,包括type为hidden的<input>元素 Array<Element(S)>
  • 相关阅读:
    优化SQL查询:如何写出高性能SQL语句
    提高SQL执行效率的16种方法
    Spring Ioc DI 原理
    java内存泄漏
    转:js闭包
    LeetCode Best Time to Buy and Sell Stock III
    LeetCode Best Time to Buy and Sell Stock with Cooldown
    LeetCode Length of Longest Fibonacci Subsequence
    LeetCode Divisor Game
    LeetCode Sum of Even Numbers After Queries
  • 原文地址:https://www.cnblogs.com/thenear/p/4041100.html
Copyright © 2011-2022 走看看