jQuery慢慢啃之选择器(二)

1.$("#myDiv");ID匹配一个元素

<span id="foo[bar]"></span>

$("#foo\[bar\]);//转义

2.$("div");//元素标签名匹配

3.$(".myClass"); css类名匹配

4.$("*")   匹配所有元素,多用于结合上下文来搜索

5.指定多个选择器,把匹配结果组合返回

<div>div</div>
<p class="myClass">p class="myClass"</p>
<span>span</span>
<p class="notMyClass">p class="notMyClass"</p>

$("div,span,p.myClass")

6.在给定的祖先元素下匹配所有的后代元素

<form>
  <label>Name:</label>
  <input name="name" />
  <fieldset>
      <label>Newsletter:</label>
      <input name="newsletter" />
</fieldset>
</form>
<input name="none" />

$("form input")

7.$("form > input")//父元素下匹配所有的子元素

8.匹配所有 prev 元素后的 next 元素,包括同辈和子元素或者其他
<form>
  <label>Name:</label>
  <input name="name" />
  <fieldset>
      <label>Newsletter:</label>
      <input name="newsletter" />
</fieldset>
</form>
<input name="none" />
表达式:$("label + input")
结果:[ <input name="name" />, <input name="newsletter" /> ]
 
9.第一个选择器的同辈
表达式:$("form ~ input")
结果:[ <input name="none" /> ]
 
10.$('li:first');//元素机会中 的第一个
$("input:not(:checked)")//集合在除去某些
$("tr:even")//匹配偶数项
$("tr:odd")//匹配基项
$("tr:eq(1)")//匹配给定索引的项
$("tr:gt(0)")//匹配大于索引的项
$("p:lang(it)")//选择语言
$('li:last')//获取最后一个元素
$("tr:lt(2)")//匹配索引的项
$(":header").css("background", "#EEE");//匹配如 h1, h2, h3之类的标题元素
$("div:not(:animated)").animate({ left: "+=20" }, 1000);//对没有动画的元素执行动画
$( document.activeElement )//当前的焦点元素
$(":root").css("background-color","yellow");//选择该文档的根元素
$("div:contains('John')")//匹配包含给定文本的元素
$("td:empty")//匹配所有不包含子元素或者文本的空元素
$("div:has(p)")//匹配含有选择器所匹配的元素的元素
$("td:parent")//匹配含有子元素或者文本的元素
$("tr:hidden")//匹配所有不可见元素
$("input:enabled")//匹配所有可用元素
$("input:disabled")//匹配所有不可用元素
$("input:checked")//查找所有选中的元素
$("select option:selected")//匹配所有选中的option元素
$("div[id]")//匹配包含给定属性的元素
$("input[name='newsletter']").attr("checked", true);//匹配给定的属性是某个特定值的元素
$("input[name!='newsletter']").attr("checked", true);
$("input[name^='news']")//匹配给定的属性是以某些值开始的元素
$("input[name$='letter']")//匹配给定的属性是以某些值结尾的元素
$("input[name*='man']")//匹配给定的属性是以包含某些值的元素
$("input[id][name$='man']")//复合属性选择器,需要同时满足多个条件时使用。
$("ul li:first-child")//匹配第一个子元素,类似的 :first 匹配第一个元素,而此选择符将为每个父元素匹配一个子元素
$("ul li:last-child")//:last  只匹配最后一个元素,而此选择符将为每个父元素匹配最后一个子元素
$("ul li:nth-child(2)")//匹配其父元素下的第N个子或奇偶元素
:nth-last-child(n|even|odd|formula)//选择所有他们父元素的第n个子元素。计数从最后一个元素开始到第一个。
:nth-of-type(n|even|odd|formula)
$("ul li:only-child")//如果某个元素是父元素中唯一的子元素,那将会被匹配
:only-of-type
$(":input")匹配所有 input, textarea, select 和 button 元素
$(":text")
$(":password")
$(":radio")
$(":checkbox")
$(":submit")
$(":image")
$(":reset")
$(":button")
$(":file")
 
 
 
 
 
 
 
原文地址:https://www.cnblogs.com/yuliantao/p/4259420.html