abstract：<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body> <div id="box" st
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Document</title>
</head>
<body>
<div id="box" style="width: 100px;height: 100px;border: 1px solid black;margin: 100px auto;"></div>
<div style="width: 200px;height: 100px;margin: 0 auto;">
<input type="submit" value="变高" onmousedown="a(this)">
<input type="submit" value="变宽" onmousedown="b(this)">
<input type="submit" value="重置" onmousedown="c(this)">
<input type="submit" value="变色" onmousedown="d(this)">
<input type="submit" value="显示" onmousedown="e(this)">
<input type="submit" value="隐藏" onmousedown="f(this)">
</div>
<script type="text/javascript">
var box
function a(){
document.getElementById('box').style.height="200px"
}
function b(){
document.getElementById('box').style.width="200px"
}
function c(){
document.getElementById('box').style.width="100px"
document.getElementById('box').style.height="100px"
document.getElementById('box').style.background="#fff"
document.getElementById('box').style.display="block"
}
function d(){
var d =Math.random()
if (d<0.5) {
document.getElementById('box').style.background="#f40";
}else{
document.getElementById('box').style.background="pink";
}
}
function e(){
document.getElementById('box').style.display="block"
}
function f(){
document.getElementById('box').style.display="none"
}
</script>
</body>
</html>通过设置鼠标点击按钮的事件来触发js改变css样式的目的,来达到点击按钮div方块就会改变的效果
Correcting teacher：查无此人Correction time：2019-03-09 09:19:33
Teacher's summary：完成的不错。代码要缩进，看着会整齐。每行js代码，后面要增加;号。继续加油