jQuery 知识点 (二) —— jQuery 选择器

//-- js 解析 jQuery 选择器是自右向左解析的var $div = $("#id");// ID 选择器$div = $("div");//标签选择器$(".cssClass").hide();//隐藏具有cssClass样式类的元素  .cssClass : 类选择器$("*","#id").hide();//隐藏 #id 元素下所有元素    * : 结合上下文匹配所有元素// $(selector1,selector2,selector3) : 使用 "," 分隔多个选择器构成一个选择器组合$("#id,.cssClass,span").hide();//隐藏 #id 元素，具有cssClass样式类的元素和 span 标签元素// $(ancestor descendant) : 使用 " " 分隔匹配 ancestor 元素下的所有后代 descendant 元素$("#id div").hide();//隐藏 #id 元素下的所有 div 元素// $(parent>child) : 获取给定父元素下得子元素$("#id>span").hide();//隐藏 #id 元素的子元素中的 span 元素// $(prev + next) : 获取所有紧跟 prev 元素的 next 元素$("span + .red").hide();//隐藏所有紧跟 span 元素后且css样式类中有 red 类的元素// $(prev ~ siblings) : 获取 prev 元素之后所有同辈 siblings 元素$("#id ~ li").hide();//隐藏 #id 之后的同辈 li 元素// $(selector:first) : 获取匹配元素中的第一个元素// $(selector:last) : 获取匹配元素中的最后一个// $(selector:not(jQselector)) : 获取匹配 selector 且不匹配 jQselector 的元素// $(selector:even) : 获取所有索引值为偶数的 selector 元素，索引从 0 开始// $(selector:odd) : 获取所有索引值为奇数的 selector 元素// $(selector:eq(index)) : 获取指定索引 index 处的匹配 selector 元素// $(selector:gt(index)) : 获取大于指定索引 index 的匹配 selector 元素// $(selector:lt(index)) : 获取小于指定索引 index 的匹配 selector 元素// $(":header") : 匹配 h1,h2,h3,h4,h5,h6 等标题元素// $(":animated") : 匹配正在执行动画的元素// $(":focus") : 匹配获得光标的元素// $(":contains(text)") : 匹配包含给定文本 text 的的元素// $(":empty") : 匹配不包含子元素或文本的空元素// $(":has(selector)") : 匹配含有选择器 selector 的匹配的元素，通常用于过滤// $(":parent") : 匹配含有子元素或者文本的元素，与 :empty 相对// $(":hidden") : 匹配所有不可见元素或 hidden 元素// $(":visible") : 匹配所有可见元素// $("[attr]") : 匹配具有属性 attr 的元素// $("[attr=value]") : 匹配具有属性 attr 且其值为 value 的元素// $("[attr!=value]") : 匹配具有属性 attr 且其值不为 value 的元素// $("[attr^=value]") : 匹配具有属性 attr 且其值以 value 开头的元素// $("[attr$=value]") : 匹配具有属性 attr 且其值以 value 结尾的元素// $("[attr*=value]") : 匹配具有属性 attr 且其值包含 value 的元素// $("[s1][s2][s3]") : 获取同时匹配 s1,s2,s3 的元素，与:has(selector) 类似// $("parent:nth-child(i)") : 匹配其父元素下的第N个子或奇偶元素console.log($("ul:nth-child(3n+2)").hide());//隐藏 ul 下索引值满足index = 3n+2 的元素// $("parent:first-child") : 获取每个父元素匹配的第一个子元素，与 :first 只匹配一个元素不同// $("parent:last-child") : 获取每个父元素匹配的最后一个子元素，与 :last 只匹配一个元素不同// $("parent:only-chid") : 获取满足该元素是父元素中的唯一子元素的元素// ------------ 表单选择器 -------------// $(":input") : 匹配所有 input,textarea,select,button 等元素// $(":text") : 匹配所有 <input type="text"> 标签// $(":password") : 匹配所有 <input type="password"> 标签// $(":radio") : 匹配所有 <input type="radio"> 标签// $(":checkbox") : 匹配所有 <input type="checkbox"> 标签// $(":submit") : 匹配所有 <input type="submit"> 标签// $(":image") : 匹配所欲 <input tyep="image"> 标签// $(":reset") : 匹配所有 <input type="reset"> 标签// $(":button") : 匹配所有 <input type="button"> 或 <button></button> 标签// $(":file") : 匹配所有 <input type="file"> 标签// $(":enabled") : 匹配所有可用元素// $(":disabled") : 匹配所有不可用元素// $(":checked") : 匹配所有选中的被选中元素(复选框、单选框等，不包括select中的option)// $("option:selected") : 匹配所有选中的 option 元素