<!DOCTYPE html>
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("#h1,#h2,#p1").addClass("color");
$("div").addClass("important");
});
$("#btn2").click(function(){
$("#h1,#h2,#p1").removeClass("color");
$("div").removeClass("important");
});
$("#btn3").click(function(){
$("#h1,#h2,#p1").toggleClass("color");
$("div").toggleClass("important");
});
});
</script>
<style type="text/css">
.important
{
font-weight:bold;
font-size:xx-large;
}
.color
{
color:blue;
}
</style>
</head>
<body>
<h1 id="h1">标题1<h1>
<h2 id="h2">标题2<h2>
<p id="p1">这是一个段落！</p>
<p id="p1">这是另外一个段落！</p>
<div>这是一个非常重要的文本！</div>
<button id="btn1">向元素添加类</button>
<button id="btn2">向元素删除类</button>
<button id="btn3">切换css类</button>
</body>
</html>
<html>
<head>
<script src="jquery.js"></script>
<script>
$(document).ready(function(){
$("#btn1").click(function(){
$("#h1,#h2,#p1").addClass("color");
$("div").addClass("important");
});
$("#btn2").click(function(){
$("#h1,#h2,#p1").removeClass("color");
$("div").removeClass("important");
});
$("#btn3").click(function(){
$("#h1,#h2,#p1").toggleClass("color");
$("div").toggleClass("important");
});
});
</script>
<style type="text/css">
.important
{
font-weight:bold;
font-size:xx-large;
}
.color
{
color:blue;
}
</style>
</head>
<body>
<h1 id="h1">标题1<h1>
<h2 id="h2">标题2<h2>
<p id="p1">这是一个段落！</p>
<p id="p1">这是另外一个段落！</p>
<div>这是一个非常重要的文本！</div>
<button id="btn1">向元素添加类</button>
<button id="btn2">向元素删除类</button>
<button id="btn3">切换css类</button>
</body>
</html>
2526
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
