<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>style样式</title>
</head>
<style type="text/css">
.one{
border: 2px solid #eee;
width: 230px;
height: 50px;
background: #CCC;
color:brown;
}
</style>
<script type="text/javascript">
function fun1(){
var i = document.getElementById("con");
i.className = "one";
}
function fun2(){
var i = document.getElementById("con");
i.style.display="block";
}
function fun3(){
var i = document.getElementById("con");
i.style.display="none";
}
function fun4(){
var i = document.getElementById("con");
i.className = "";
}
</script>
<body>
<h2 id="con">I love JavaScript</H2>
<p> JavaScript使网页显示动态效果并实现与用户交互功能。</p>
<form>
<input type="button" value="换色" onclick="fun1()">
<input type="button" value="还原" onclick="fun4()">
<input type="button" value="显示" onclick="fun2()">
<input type="button" value="隐藏" onclick="fun3()">
</form>
</body>
</html>
封装一下
这个方法不错, 学习了