Jquery选择器 选择器允许您对元素组或单个元素进行操作。 Jquery选择器:基本选择器、层次选择器、基本筛选器、表单选择器、子元素选择器、属性选择器、内容选择器。（注意：前提是要导入jquery文件） 如下图 1、基本选择器 id选择器 根据给定的ID匹配一个元素。
//某标签的id属性为hid $("#hid").css("color","orange")class选择器 根据给定的css类名匹配元素。
//某标签的class属性为tt $(".tt").css("color","blue")选择器组 根据给定的元素标签名匹配所有元素
//h1,h2,h3为标签 $("h1,h2,h3").css("color","blue")2、层次选择器 用ul,ol,li做解释例子 获取ul中所有子元素节点li(包括后代节点)
//获取ul中所有子元素节点li（包括后代节点），并设置样式 $("ul li").css("color","orange"); //获取ul中所有直接子元素节点li（包括后代节点），并设置样式 $("ul>li").css("color","gray"); //获取ul同级紧邻后面的第一个兄弟节点li，并设置样式 $("ul+li").css("color","beige"); //获取ul后面所有同级兄弟li元素节点，并设置样式 $("ul~li").css("color","green");3、基本筛选器
//获取所有li节点并设置样式 $("li").css("color","red"); //获取第一个li节点并设置样式 $("li:first").css("color","red"); //获取最后一个li节点并设置样式 $("li:last").css("color","red"); //获取偶数索引号对应的所有li节点并设置样式 $("li:even").css("color","red"); //获取奇数索引号对应的所有li节点并设置样式 $("li:odd").css("color","red"); //获取class属性值为cc的所有li节点并设置样式 $("li.cc").css("color","red"); //获取class属性值不为cc的所有li节点并设置样式 $("li:not(.cc)").css("color","red"); //获取索引位置为2的li节点并设置样式 $("li:eq(2)").css("color","red"); //获取前2个li节点并设置样式 $("li:lt(2)").css("color","red");4、内容选择器 在小文本使用效率高 在大文本使用效率低
//选取div中内容含有John的内容将他的颜色变为orange $("div:contains('John')").css("color","orange");5、属性选择器
//获取所有含有value属性的input元素标签，并设置样式 $("input[value]").css("border","1px solid red"); //获取name属性值为phone的input元素标签，并设置样式 $("input[name='phone']").css("border","1px solid red"); //获取name属性值不为phone的input元素标签，并设置样式 $("input[name!='phone']").css("border","1px solid red"); //获取name属性值是以a字符开头的所有input元素标签，并设置样式 $("input[name^='a']").css("border","1px solid red"); //获取name属性值是以e字符结尾的所有input元素标签，并设置样式 $("input[name$='e']").css("border","1px solid red"); //获取name属性值中含有m字符的所有input元素标签，并设置样式 $("input[name*='m']").css("border","1px solid red");6、子元素选择器
//获取每组ul中的第一个li节点并添加样式 $("ul li:first-child").css("color","red"); //获取每组ul中的最后一个li节点并添加样式 $("ul li:last-child").css("color","red"); //获取每组ul中的第三个li节点并添加样式 $("ul li:nth-child(3)").css("color","red");7、表单选择器
//获取所有多选框中选择中的元素节点 //var list = $("input[type='checkbox']:checked");和下一行代码结果一样 var list = $(":checkbox:checked"); alert(list.length); //获取li元素节点（条件是里面的多选框必须选中），并设置样式 $("li:has(input:checked)").css("color","red");