$(“#id”): 根据给定的id匹配一个元素
$(“.myclass”):根据类名匹配元素
$(“*”): 选取html页面中所有的元素
$(“div”):选取html页面中所有的div元素
$(“div,span,myclass”):选取所有的<div><span><myclass>一组元素
<style>
div{
width:150px;
height:150px;
border:1px dashed #00F;
background-color:#CCC;
margin:5px;
float:left;}
.one-1{
width:80px;
margin:30px;
height:80px;
border:1px dashed #00F;
background-color: #FFC;
}
</style>
<script language="javascript" type="text/javascript">
//使用jquery加载事件
$(document).ready(function (){
//<input id="btn0" type="button" value="清空样式" />
$("#btn0").click(function (){
//当点击按钮后,设置id=two的div的背景颜色是绿色
$("*").removeAttr("style");
});
//<input id="btn1" type="button" value="选中id=two的div,并且改变背景颜色是green (#two)" />
//增加id为btn1按钮的事件
$("#btn1").click(function (){
//当点击按钮后,设置id=two的div的背景颜色是绿色
$("#two").css("background","green");
});
//<input id="btn2" type="button" value="选中class=one-1的div,并且设置该div的背景颜色为green ('.one-1')" />
//增加id为btn1按钮的事件
$("#btn2").click(function (){
//当点击按钮后,设置id=two的div的背景颜色是绿色
$(".one-1").css("background","green");
});
//<input id="btn3" type="button" value="选中页面中所有的元素,并且设置背景颜色为green ('*')" />
//增加id为btn1按钮的事件
$("#btn3").click(function (){
//当点击按钮后,设置id=two的div的背景颜色是绿色
$("*").css("background","green");
});
//<input id="btn4" type="button" value="选中所有的div $('div')" />
//增加id为btn4按钮的事件
$("#btn4").click(function (){
//当点击按钮后,设置id=two的div的背景颜色是绿色
$("div").css("background","green");
});
//<input id="btn5" type="button" value="选中id=three,class=one-1的,span的元素,并且设置他们的背景颜色为green" /></div>
//增加id为btn5按钮的事件
$("#btn5").click(function (){
//当点击按钮后,设置id=two的div的背景颜色是绿色
$("#three,.one-1,span").css("background","green");
});
});
</script>
</head>
<body>
<div id="one">id=one
<div class="one-1">class=one-1</div>
</div>
<div id="two">id=two<span>span的内容</span></div>
<div id="three">id=three</div>
<div class="d2">class=d2</div>
<div style="clear:both;">
<input id="btn0" type="button" value="清空样式" />
<input id="btn1" type="button" value="选中id=two的div,并且改变背景颜色是green $('#two')" />
<input id="btn2" type="button" value="选中class=one-1的div,并且设置该div的背景颜色为green $('.one-1')" />
<input id="btn3" type="button" value="选中页面中所有的元素,并且设置背景颜色为green $('*')" />
<input id="btn4" type="button" value="选中所有的div $('div')" />
<input id="btn5" type="button" value="选中id=three,class=one-1的,span的元素,并且设置他们的背景颜色为green" /></div>
</body>
</html>