div样式的改变

Original 2018-12-22 22:18:21 185
abstract:<!DOCTYPE html><html><head><meta charset="UTF-8"><title>changeDiv</title><style type="text/css">#box{width: 100px;height: 100px;background

<!DOCTYPE html>

<html>

<head>

<meta charset="UTF-8">

<title>changeDiv</title>

<style type="text/css">

#box{width: 100px;height: 100px;background: red;margin: 20px 100px;}

</style>

</head>

<body>

<div id="box"></div>

<input type="button" value="变高" onclick="H()">

<input type="button" value="变宽" onclick="W()">

<input type="button" value="变色" onclick="color()">

<input type="button" value="重置" onclick="reset()">

<input type="button" value="隐藏" onclick="hide()">

<input type="button" value="显示" onclick="show()">

<script type="text/javascript">

var box

window.onload=function(){

box=document.getElementById('box')

}

function H(){

box.style.height="400px"

}

function W(){

box.style.width="400px"

}

function color(){

box.style.background="blue"

}

function reset(){

box.style.background="red"

box.style.height="100px"

box.style.width="100px"

}

function hide(){

box.style.display="none"

}

function show(){

box.style.display="block"

}

</script>

</body>

</html>

全局变量的引入:window.onload=function(){

}

Correcting teacher:天蓬老师Correction time:2018-12-23 09:55:10
Teacher's summary:全局变量收入的函数里面是空的,没有实现还是忘记了?

Release Notes

Popular Entries