jq的一些基本选择器

【基本选择器】(*****)
Ø id选择器
* 用法:$(“#id”)
Ø 类选择器
* 用法:$(“.类名”)
Ø 元素选择器
* 用法:$(“元素名称”)
Ø 通配符选择器
* 用法:$(“*”)
Ø 并列选择器
* 用法:$(“选择器,选择器,选择器”)

$(function(){
$("#but1").click(function(){
// alert("aaaa");
$("#one").css("background","#bbffaa");
});

$("#but2").click(function(){
$(".mini").css("background","#bbffaa");
});

$("#but3").click(function(){
$("div").css("background","#bbffaa");
});

$("#but4").click(function(){
$("*").css("background","#bbffaa");
});

$("#but5").click(function(){
$("#two,span,.mini").css("background","#bbffaa");
});
});
【层级选择器】：
Ø 后代选择器：使用空格 所有后代包含孙子及以下的元素
Ø 子元素选择器：使用> 第一层的元素（儿子）
Ø 下一个元素:使用+ 下一个同辈元素
Ø 兄弟元素:使用~ 后面所有的同辈元素
<script>
$(function(){
// 后代选择器:
$("#but1").click(function(){
$("body div").css("background","#bbffaa");
});

// body下的第一层div元素
$("#but2").click(function(){
$("body > div").css("background","#bbffaa");
});

// 查找下一个同辈的元素
$("#but3").click(function(){
$("#three + div").css("background","#bbffaa");
});

$("#but4").click(function(){
$("#two ~ div").css("background","#bbffaa");
});

});

</script>
【基本过滤选择器】

<script>
$(function(){
$("#but1").click(function(){
$("#three div:first").css("background","#bbffaa");
});
$("#but2").click(function(){
$("#three div:last").css("background","#bbffaa");
});
$("#but3").click(function(){
$("div:odd").css("background","#bbffaa");
});
$("#but4").click(function(){
$("div:even").css("background","#bbffaa");
});
$("#but5").click(function(){
$("#three div:eq(1)").css("background","#bbffaa");
});
});

</script>
【内容选择器】

<script>
$(function(){
$("#but1").click(function(){
$("div:contains('1')").css("background","#bbffaa");
});
});

</script>
【属性选择器】

【表单选择器】

<script>
$(function(){
$("#but1").click(function(){
$(":input").css("background","#bbffaa");
});
$("#but2").click(function(){
// $(":text").css("background","#bbffaa");
$("input[type='text']").css("background","#bbffaa");
});
});

</script>
【表单属性选择器】

* attr();
* 使用方法一：$(“”).attr(“src”);
* 使用方法二：$(“”).attr(“src”,”test.jpg”);
* 使用方法三：$(“”).attr({“src”:”test.jpg”,”width”:”100”});
* removeAttr();
* prop();新版本的方法.
* 使用方法一：$(“”).prop(“src”);
* 使用方法二：$(“”).prop(“src”,”test.jpg”);
* 使用方法三：$(“”).prop({“src”:”test.jpg”,”width”:”100”});
* removeProp();
* addClass()
* removeClass();
* toggle(); --单击事件的切换
* hover(); --鼠标悬停的切换