JQ常用选择器总结

1 常用选择器：

$("#myELement")  //选择id为myElement的元素，唯一元素 
$("div")         //选择所有的div标签元素，返回div元素数组 
$(".myClass")    //选择使用myClass类的css的所有元素 
$("*")           //选择文档中的所有的元素，可用多种的选择方式联合选择：例如$("#myELement,div,.myclass") 

2 层叠选择器：

$("#id>.classname ")    //子元素选择器
$("#id .classname ")    //后代元素选择器
$("#id + .classname ")    //紧邻下一个元素选择器
$("#id ~ .classname ")    //兄弟元素选择器

3 基本过滤选择器：

$("li:first")    //第一个li
$("li:last")     //最后一个li
$("li:even")     //挑选下标为偶数的li
$("li:odd")      //挑选下标为奇数的li
$("li:eq(4)")    //下标等于 4 的li(第五个 li 元素)
$("li:gt(2)")    //下标大于 2 的li
$("li:lt(2)")    //下标小于 2 的li
$("li:not(#runoob)") //挑选除 id="runoob" 以外的所有li

4 内容过滤选择器：

$("div:contains('Runob')")    //包含 Runob文本的元素
$("td:empty")                 //不包含子元素或者文本的空元素
$("div:has(selector)")        //含有选择器所匹配的元素
$("td:parent")                //含有子元素或者文本的元素

5 可视化过滤选择器：

$("li:hidden")       //匹配所有不可见元素，或type为hidden的元素
$("li:visible")      //匹配所有可见元素

6 属性过滤选择器：

$("div[id]")              //选择所有含有id属性的div元素 
$("input[name='newsletter']")    //选择所有的name属性等于'newsletter'的input元素 
$("input[name!='newsletter']") //选择所有的name属性不等于'newsletter'的input元素 
$("input[name^='news']")         //选择所有的name属性以'news'开头的input元素 
$("input[name$='news']")         //选择所有的name属性以'news'结尾的input元素 
$("input[name*='man']")          //选择所有的name属性包含'news'的input元素 
$("input[id][name$='man']")    //可以使用多个属性进行联合选择，该选择器是得到所有的含有id属性并且那么属性以man结尾的元素 

7 子元素过滤选择器：

$("div span:first-child")          //返回所有的div元素的第一个子节点的数组 
$("div span:last-child")           //返回所有的div元素的最后一个节点的数组 
$("div button:only-child")       //返回所有的div中只有唯一一个子节点的所有子节点的数组 

8 表单元素选择器：

$(":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元素或表单的隐藏域 

9 表单元素过滤选择器：

$(":enabled")             //选择所有的可操作的表单元素 
$(":disabled")            //选择所有的不可操作的表单元素 
$(":checked")            //选择所有的被checked的表单元素 
$("select option:selected")  //选择所有的select 的子元素中被selected的元素