<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="en">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title></title>
<script type="text/javascript" src="../js/jquery-1.8.0.js"></script>
</head>
<body>
<h1>DOM 对象转成 jQuery 对象 示例</h1>
<script type="text/javascript">
$(document).ready(function() {
//基本选择器 5个
var $div2=$("#myid");
$div2.click(function(){
alert($("#myid").size() +" 1");
alert($(".basketball").size() +" 2");
alert($("span") +" 3");
alert($("*") +" 4");
// alert($("#myid" +" 1")); //联合选择器
});
//1、 通配符选择器 $("*")
$("*").css("background","#CCFFCC");
//2、类选择器 $(".类名")
$(".myclass").css("background","lightpink").css("color","blue").css("font-size","30px");
//3、标签选择器
$("h2").css("color","mediumvioletred");
//4、#id选择器
$("#btid").css("color","brown").css("font-size","30px");
//5、联合选择器
$("#ftid,.vollegball").css("color","blueviolet");
});
</script>
<div id="myid" title="myid">
<h2>兴趣爱好</h2>
<p class="basketball" id="btid">篮球</p>
<span class="football" id="ftid">足球</span>
<div class="vollegball">排球</div>
</div>
<div class="myclass" title="myclass">
<h2>编程语言有哪些</h2>
<p>java</p>
<span>c#</span>
<div>php</div>
</div>
</body>
</html>
时间： 2024-10-13 05:59:10