jquery选择器

在js当中选择器有很多，一般的写法为。document.get...用的是文档document的对象来写，非常长，而且有的时候选择并不是那么好用，并不能直接到自己想要的还要写更多的逻辑代码。那么jquery极大的简化了这个工作。下面简单说一下这个jquery的选择器

jquery的通用写法：$(“element”).action
$是jquery的声明,element是选择的元素 action是事件

1. id选择器

$("#id").click(function(){
    alert("id选择器");
});

1. 类选择器

$(".class").click(function(){
    alert("类选择器");
});

1. 元素选择器
   $(“div”).click(function(){
   alert(“元素选择器”);
   });
2. 同时选择多个
   $(“#id,.class”).click(function(){
   alert(“多选，元素之间用‘，’隔开”);
   });
3. 层次选择器
   ①.后代选择器

$("div p").click(function(){
    alert("选中所有div下面的所有p元素");
});

   ②.子元素选择器

$("div > p").click(function(){
    alert("选中所有div下面的儿子p元素");
});

 ③.下一个兄弟元素

$("div + p").click(function(){
    alert("选中所有div的下一个兄弟p");
});

 ④.下边所有兄弟元素

$("div ~ p").click(function(){
    alert("选中所有div下所有的兄弟p元素");
});

1. 过滤选择器
   ①选中第一个(一般用于列表):

$("ul li:first").css({"color":"red"});
//选中所有ul的中拍在第一个的li

②选中第一个孩子

$("ul li:first-child").css({"background":"green"});
//选中每一个ul里面的第一个li

③选中下标为奇数的内容

$("li:even").hide();

④选中下标为偶数的内容

 $("li:odd").hide();