jQuery 获取对象 定位子对象

  选择中的特殊符号:

  # 指示 id

  . 指示 class

  * 全选

  , 多选

  空格 后代

  > 子

  ~ 兄弟

  + 下一个

  : 子(多功能)

  () 函数式的过滤与查找

  获取 div 下的所有标题对象: $("div :header")

  

复制代码 代码如下:

  <body>

  <h3>AAA</h3>

  <p>BBB</p>

  <h4>CCC</h4>

  <div>

  <h3>DDD</h3>

  <p>EEE</p>

  <h4>FFF</h4>

  </div>

  </body>

  获取所有标题对象: $(":header")

  

复制代码 代码如下:

  <body>

  <h3>AAA</h3>

  <p>BBB</p>

  <h4>CCC</h4>

  <div>

  <h3>DDD</h3>

  <p>EEE</p>

  <h4>FFF</h4>

  </div>

  </body>

  获取 first, 如: $("li:first") 或 $("li").first() 或 $("ul :first") 或 $("ul li:first")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取每组的 first, 如: $("li:first-child") 或 $("ul li:first-child") 或 $("ul :first-child")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取 last, 如: $("li:last") 或 $("li").last() 或 $("ul :last") 或 $("ul li:last")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取每组的 last, 如: $("li:last-child") 或 $("ul li:last-child") 或 $("ul :last-child")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取第几个, 如(获取第三个, eq 是 0 起): $("li:eq(2)") 或 $("li").eq(2)

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取第几个之后的, 如(获取第三个之后的, gt 是 0 起): $("li:gt(2)")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取第几个之前的, 如(获取第三个之前的, lt 是 0 起): $("li:lt(2)")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取索引值是偶数的, 如(even 是 0 起): $("li:even")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取索引值是奇数的, 如(odd 是 0 起): $("li:odd")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取每组第偶数个, 如(nth-child 是 1 起): $("li:nth-child(even)")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取每组第奇数个, 如(nth-child 是 1 起): $("li:nth-child(odd)")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  获取每组第几个, 譬如第 2 个(nth-child 是 1 起): $("li:nth-child(2)")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  用表达式指示每组的第几个, 如(nth-child 是 1 起): $("li:nth-child(3n-1)")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  如果是父元素中唯一的子元素, 如: $("li:only-child")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>

  :not 是对其他选择的取反, 如: $("li:not(li:first-child)")

  

复制代码 代码如下:

  <ul>

  <li>AAA</li>

  <li>BBB</li>

  <li>CCC</li>

  <li>DDD</li>

  <li>EEE</li>

  <li>FFF</li>

  <li>GGG</li>

  </ul>

  <ul>

  <li>111</li>

  </ul>

  <ul>

  <li>XXX</li>

  <li>YYY</li>

  <li>ZZZ</li>

  </ul>