Jquery选择器（一）

一、基本选择器

 1.查找 ID 为"myDiv"的元素。

$(document).ready(function(){
$("#mydiv");
});

id="mydiv"

2.查找所有类是 "myClass" 的元素.

 $(document).ready(function(){
$(".myClass");
});

div class="myClass"

span class="myClass"

3.查找一个 p元素。

$(document).ready(function(){
 $("p");
});

div class="myClass"

span class="myClass"

我是p元素

4.找每一个元素

$(document).ready(function(){
 $("*");
});

div class="myClass"

span class="myClass"

我是p元素

5.选择多个选择器元素

$(document).ready(function(){
$("#mydiv,p").css("color","red");
});

div class="mydiv"

div class="myClass"

span class="myClass"

我是p元素

二、层级选择器

1.后代选择器（所有包含孙子）

$(document).ready(function(){
$("form input").css("color"," red");
});

Name:

Newsletter:

2.子元素选择器（只匹配到儿子）

$(document).ready(function(){
$("form > input").css("color"," red");
});

Name:

Newsletter:

 

3.相邻元素选择器

$(document).ready(function(){
$("label+ input").css("color"," red");
});

Name:

Newsletter:

 

4.兄弟选择器

匹配form之后的input元素

$(document).ready(function(){
$("form~input").css("color"," red");
});

Name:

Newsletter: