//1.第一种方式
<script src="Jquery1.7.js" type="text/javascript"></script>
<script type="text/javascript">
function chage() {
//$('#mydiv').css('background-color','red');
document.getElementById('mydiv').style.backgroundColor = 'red';
}
</script>
<style type="text/css">
#mydiv{width:100px; height:100px; border:solid 1px;}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="mydiv">你好</div>
<div>我不好</div>
<input type="button" value="改变" οnclick="chage();" />
</form>
</body>
//2.第二种方式：JQuery
<script src="Jquery1.7.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#but').click(function () {
$('#mydiv').css('background-color', 'red');
})
})
</script>
<style type="text/css">
#mydiv
{
width: 100px;
height: 100px;
border: solid 1px;
}
</style>
</head>
<body>
<form id="form1" runat="server">
<div id="mydiv">
你好</div>
<div>
我不好</div>
<input type="button" id="but" value="改变" />
</form>
</body>
<script src="Jquery1.7.js" type="text/javascript"></script>
<script type="text/javascript">
$(function () {
$('#but').click(function () {
//$('#a1').css('background-color', 'blue');
//根据给定的name属性的值匹配
//$('a').css('background-color','red');
//根据类型皮匹配
//$('.a').css('background-color','blue');
//若三个链接使用相同的类
$('.a').css('background-color', 'blue');
})
})
</script>
</head>
<body>
<form id="form1" runat="server">
<div>
<ul>
<li><a href="#" name="a" id="a1" class="a">百度</a></li>
<li><a href="#" name="a" class="a">谷歌</a></li>
<li><a href="#" name="a" class="a">搜狐</a></li>
</ul>
</div>
<input type="button" value="变色" id="but" />
</form>
</body>
扫一扫
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
