摘要：<!DOCTYPE> <html> <head> <meta charset="utf-8"> <title>控制DIV样式</title> <style> #box{height:100px; width:100px; background:&
<!DOCTYPE>
<html>
<head>
<meta charset="utf-8">
<title>控制DIV样式</title>
<style>
#box{height:100px; width:100px; background: pink; margin:20px 85px; }
</style>
</head>
<body>
<script type="text/javascript">
var box //声明一个变量
window.onload=function (){ //这个地方不懂，这是全局变量的调用吗？
box=document.getElementById("box") //把获取到的ID'box'赋值给box
}
function hei(){
box.style.height="500px" //改变高度
}
function wid(){
box.style.width="500px" //改变宽度
}
function col(){
box.style.background="yellow" //改变颜色
}
function res(){
box.style.height="100px"
box.style.width="100px"
box.style.background="pink" //还原DIV样式
}
function hid(){
box.style.display="none" //隐藏DIV
}
function sho(){
box.style.display="block" //显示DIV
}
</script>
<div id="box"></div>
<input type="button" value="变高" onclick="hei()">
<input type="button" value="变宽" onclick="wid()">
<input type="button" value="变色" onclick="col()">
<input type="button" value="重置" onclick="res()">
<input type="button" value="隐藏" onclick="hid()">
<input type="button" value="显示" onclick="sho()">
</body>
</html>
批改老师：灭绝师太批改时间：2019-01-06 15:20:40
老师总结：window.onload这是一个页面加载完成之后调用的事件
