摘要：<!DOCTYPE html><html><head> <title>JavaScript案例1——修改属性值</title> <link rel="shortctut icon" type="image/x-icon"
<!DOCTYPE html>
<html>
<head>
<title>JavaScript案例1——修改属性值</title>
<link rel="shortctut icon" type="image/x-icon" href="img/none.ico">
<link rel="stylesheet" type="text/css" href="css/index.css">
<style type="text/css">
#box{height: 100px;width: 100px;background: pink;margin: 20px 80px;}
</style>
</head>
<body>
<!-- 改变属性的高度、宽度、颜色、隐藏、显示 -->
<div id="box"></div>
<input type="button" name="" value="高度" onclick="aa();">
<input type="button" name="" value="宽度" onclick="bb();">
<input type="button" name="" value="颜色" onclick="cc();">
<input type="button" name="" value="重置" onclick="ee();">
<input type="button" name="" value="隐藏" onclick="dd();">
<input type="button" name="" value="显示" onclick="ff();">
<script type="text/javascript">
var box;
window.onload=function(){
box=document.getElementById('box');
}
function aa(){
box.style.height = "400px";
}
function bb(){
box.style.width="400px";
}
function cc(){
box.style.background="red";
}
function dd(){
box.reset();
}
function ee(){
//box.style.display="none";
box.style.visibility="hidden";
}
function ff(){
//box.style.display="inline";
box.style.visibility="visible";
}
</script>
</body>
</html>
批改老师：韦小宝批改时间：2019-03-09 17:31:49
老师总结：写的很不错 通过js来修改dom的值或者是样式可以做成动画的效果 后期使用jQuery还可以再练习练习
