jQueryのセレクタ例
jQueryのセレクタは非常に強力で、実はCSSのセレクタを完全に参考にしています.セレクタ、IDセレクタ、ラベルセレクタ、他にもたくさんあります.
階層セレクタなど、次に彼らを挙げます.
階層セレクタなど、次に彼らを挙げます.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<title>Jquery </title>
<script type="text/javascript" src="jquery-1.7.2.js"></script>
<script type="text/javascript">
$(document).ready(function(){
//Jquery id
$("#button1").click(function(){
$("#div1").css("background","red");
})
//jQuery class
$("#button2").click(function(){
$(".min").css("background","red");
})
//
$("#button3").click(function(){
$("div").css("background","yellow");
})
//
$("#button4").click(function(){
$("span,.min").css("background","blue");
})
// ， body div
$("#button5").click(function(){
$("body span").css("background","black");
})
// ， body div
$("#button6").click(function(){
$("body > span").css("background","red");
})
// ， CLass min div
$("#button7").click(function(){
$(".min span").css("background","black");
})
// ， id div1 div
$("#button8").click(function(){
$("#div1 ~ div").css("background","black");
})
})
</script>
</head>
<body>
<div id="div1">div1</div>
<br/><br/>
<div class="min">div2<div>div3</div></div><br/><br/>
<div>div3</div><br/><br/>
<span>span</span>
<input type="button" id="button1" value="test1"/><br/>
<input type="button" id="button2" value="test2"/><br/>
<input type="button" id="button3" value="test3"/><br/>
<input type="button" id="button4" value="test4"/><br/>
---------------------------------Level -------------------------------<br/><br/>
<div>
<span>hahaha</span>
<a href="#"><span>heihei</span></a>
</div>
<br/>
<input type="button" id="button5" value="test1"/><br/>
<input type="button" id="button6" value="test2"/><br/>
<input type="button" id="button7" value="test3"/><br/>
<input type="button" id="button8" value="test4"/><br/>
</body>
</html>