abstract：<!doctype html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewp
<!doctype html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport"
content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<style>
#one{
width:500px;
height:500px;
background:#FF44AA;
}
button{
width:150px;
height:80px;
font-size:22px;
}
</style>
</head>
<body>
<div id="one"></div>
<button onclick="width()">寬</button>
<button onclick="h()">高</button>
<button onclick="c()">粉色</button>
<button onclick="r()">重置</button>
<button onclick="b()">圓形</button>
<button onclick="re()">藍(lán)色</button>
<button onclick="yel()">黃色</button>
<button onclick="suiji()">隨機(jī)顏色</button>
</body>
<script>
var getRandomColor = function() {
return '#' +
(function(color) {
return (color += '0123456789abcdef' [Math.floor(Math.random() * 16)]) && (color.length == 6) ? color : arguments.callee(color);
})('');
}
function width(){
document.getElementById('one').style.width="800px";
}
function h(){
document.getElementById('one').style.height="800px";
}
function c(){
document.getElementById('one').style.background="pink";
}
function yel(){
document.getElementById('one').style.background="yellow";
}
function r(){
document.getElementById('one').style.width="500px";
document.getElementById('one').style.height="500px";
document.getElementById('one').style.background='red';
document.getElementById('one').style.borderRadius="0px";
}
function suiji(){
document.getElementById('one').style.background=getRandomColor();
}
function b(){
document.getElementById('one').style.borderRadius="250px";
}
function re(){
document.getElementById('one').style.background="blue";
}
</script>
</html>代碼運(yùn)行結(jié)果如下：
Correcting teacher：查無(wú)此人Correction time：2019-02-22 09:19:35
Teacher's summary：完成的不錯(cuò)，js的命令很復(fù)雜，不過(guò)也有規(guī)律，要耐心記，繼續(xù)加油。