基础选择器包括：
1.#id选择器
2.element选择器
3.class选择器
4.*选择器
5.sele1,sele2,seleN选择器
6.ance desc 选择器
7.parent>child 选择器
8. prev+next选择器
9.pre~siblings选择器
一 、初识jQuery
jQuery本身就是JavaScript, 只不过是把JavaScript代码包装成拿过来就能实现特定功能的代码库！
$()就是jQuery中的函数，它的功能就是获取()中指定的标签元素。$()中的()不一定是元素，也可能是函数。在jQuery中$()方法等价与jQuery()方法，前者是后者的一个简写。
二、jQuery基础选择器
（1）id选择器：$("#id")
<body> <div id="divtest">div的内容</div> <div id="default"></div> <script type="text/javascript"> $("#default").html($("#divtest").html()); </script> </body>
（2）element选择器：$("element)
<body> <button id="btntest">点我</button> <script type="text/javascript"> $("button").attr("disabled","true"); </script> </body>
（3）.class 选择器：$(".class")
<body> <div class="red">立正，向我这边看齐</div> <div class="green">我先歇歇脚</div> <script type="text/javascript"> var $redHTML = $(".red").html(); $(".green").html($redHTML); </script> </body>
（4）*选择器：$("*")
如下选择的是form下的所有input标签
<body> <form action="#"> <input id="Button1" type="button" value="button" /> <input id="Text1" type="text" /> <input id="Radio1" type="radio" /> <input id="Checkbox1" type="checkbox" /> </form> <script type="text/javascript"> $("form *").attr("disabled", "true"); </script> </body>
（5）sele1,sele2,seleN选择器：$("sele1,sele2,seleN")
<body> <div class="red">选我吧！我是red</div> <div class="green">选我吧！我是green</div> <div class="blue">选我吧！我是blue</div> <script type="text/javascript"> $(".red, .green").html("hi,我们的样子很美哦!"); </script> </body>
（6）ance desc选择器：$("ance desc")
在实际应用中，常常是多个元素嵌套在一起，形成复杂的层次关系，通过层次选择器，可以快速定位某一层次的一个或多个元素。
其中ance desc是使用空格隔开的两个参数。 ance参数（ancestor祖先的简写）表示父元素；desc参数（descendant后代的简写）表示后代元素，即包括子元素、孙元素等等。
如下获取的是div下面的所有label标签(包括p标签下的label标签)。
<body> <div>码农家族 <p> <label></label> </p> <label></label> </div> <script type="text/javascript"> $("div label").css("background-color","grey"); </script> </body>
（7）parent>child 选择器$("parent>child")
与ance desc 选择器相比，parent>child 选择器范围要小一些，它所选择的目标是子集元素，相当于一个家庭中的子辈们，但不包括孙辈。
child参数获取的元素都是parent选择器的子元素，它们之间通过>符号来表示一种层次关系
如下是获取的是div中的所有label标签（不包括p标签下的label标签）
<body> <div> 码农家族 <p> <label></label> </p> <label></label> <label></label> </div> <label></label> <script type="text/javascript"> $("div>label").css("border", "solid 5px red"); </script> </body>
（8）prev +next选择器：$("prev+next")
prev + next选择器查找的是与“prev”元素紧邻的下一个“next”元素。
其中参数prev为任何有效的选择器，参数next为另外一个有效选择器，它们之间表示一种上下的层次关系，也就是说，prev元素最紧邻的下一个元素由next选择器返回的并且只返回唯一一个元素。
如下获取的是p标签下的第一个label标签。
<body> <div> 码农家族 <label></label> <p></p> <label></label> <label></label> </div> <label></label> <script type="text/javascript"> $("p+label").css("background-color","red"); </script> </body>
（9）prev～siblings选择器： $("prev~siblings")
与prev+next层次选择器相同，prev～siblings选择器也是查找prev元素之后的相邻元素，但前者只获取第一个相邻的元素，而后者则获取prev元素后面全部紧邻的元素。
如下获取的是p标签下的两个label标签。
<body> <div> 码农家族 <label></label> <p></p> <label></label> <label></label> </div> <label></label> <script type="text/javascript"> $("p~label").css("border", "solid 1px red"); $("p~label").html("我们都是p先生的粉丝"); </script> </body>