jQuery选择器

简单的介绍jQuery选择器的用法，方便自已以后查找。

1. 基本选择器：比较常用的选择器，它通过元素id、class和标签名等来查找DOM元素。

   ‍$("#test)  ‍      选取 id为test的元素

   $(".test")       选取所以class为test的元素

   $("p")           选取所有的<p>元素

   $("*")           选取所有元素                 

   $("selector1,....,selectorN")    选取选择器合并的元素

2. 层次选择器：通过元素之间的层次关系来获取元素，后代元素、子元素和兄弟元素等。

   $("div span")        选取<div>里的所有的<span>元素   （后代）

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

   $(".one + div")        选取class为one的下一个<div>元素        （相邻）  => next()

   $("#two ~ div")        选取id为two的元素后面的所有<div>兄弟元素  （所有） =>nextAll()

3. 过滤选择器：通过特定的过滤规则来筛选出所需的DOM元素，以 ：开头。

   a.基本过滤选择器

   $("div:first")     选取所有<div>中第一个 <div>元素            返回单个元素

   $("div:last")        选取所有<div>中最后一个 <div>元素      返回单个元素

   $("div:even")     选取所有<div>中偶数 <div>元素

   $("div:odd")      选取所有<div>中奇数 <div>元素  

   $("div:eq(1)")   选取所有<div>中索引等于1 <div>元素   

$("div:gt(1)")      选取所有<div>中索引大于1 <div>元素  

$("div:lt(1)")      选取所有<div>中索引小于1 <div>元素  

$(":header")      选取网页中所有的<h1>、<h2>.....元素

$("div:animated")    选取正在执行动画的<div>元素

b.内容过滤选择器


$("div:contaims('hh')")  选取含有文本 hh 的<div>元素

$("div:empty")     选取不包含子元素（文本）的<div>空元素

$("div:has(p)")        选取含有<p>元素的<div>元素

$("div:parent")        选取拥有子元素的<div>元素

c.可见性过滤选择器

$(":hidden")     选取所有不可见的元素 （包含type="hidden" style="visibility:hidden" style="display:none"）

$("div:visible")    选取所有可见的<div>元素

d.属性过滤选择器

$("div[id]") 选取拥有属性id 的元素

$("div[title='test']") 选取属性 title为"test"的元素

$("div[title!='test']")选取属性 title不等于"test"的<div>元素（没有属性title的<div>元素也会被选取）

$("div[title^='test']")选取属性 title以"test"开头的<div>元素

$("div[title$='test']")选取属性 title以"test"结束的<div>元素

$("div[title*='test']")选取属性 title含有"test"的<div>元素

$("div[id][title='test']")选取拥有属性 id，并且属性title以"test"结束的<div>元素

e.子元素选择器

$(":nth-child(index/even/odd/equation")选取每个父元素下的第index个子元素  index 从1算起   ：eq(index) 从0


$(":first-child")   选取每个父元素的第1个子元素    （集合）            ：first只返回单个元素    

$(":last-child")    选取每个父元素的最后1个子元素

$(":only-child")   如果某个元素是它父元素唯一的子元素，那么将会被匹配，否则不会被匹配

f.表单对象属性过滤器


$("#form1:enabled")  选取id为"form1"的表单内的所有可用元素

$("#form2:disabled")    选取id为"form2"的表单内的所有不可用元素

$("input:checked")        选取所用被选中的<input>元素

$("select:selected")        选取所有被选中的选项元素

4.表单选择器：更加灵活的操作表单

$(":input")        选取所有<input>  <textarea> <select> <button>元素

$(":text")        选取所有的单行文本框

$(":password")选取所有的密码框

$(":radio")        选取所有的单选框

$(":checkbox") 选取所有的复选框

$(":submit")    选取所有的提交按钮

$(":image")    选取所有的图像按钮

$(":reset")     选取所有的重置按钮

$(":button")    选取所有的按钮

$(":file")            选取所有的上传域

$(":hidden")        选取所有的不可见元素




选择器中的注意事项：

1.选择器中含有“.”、“#”、“(”、"]"等特殊字符

2.属性选择器中的引号问题  '、"

3.选择器中含有空格

嗯。先到这吧...