检查一下代码是否优化

来源：3-12 编程练习

weixin_慕的地5241954

2019-09-01 20:39:21

<!DOCTYPE html>
<html>
<head lang="en">
        <meta charset="UTF-8">
        <title>onchange()</title>
        <style type="text/css">
            #div{
                width:300px;
                height:300px;
                border:2px solid gray;
                margin:100px  0  0 200px;
            }
        </style>
        <script type="text/javascript">
           //补充代码
window.onload=init;
function init(){
var menu=document.getElementById("color");
menu.onchange=function(){
var bgcolor=menu[menu.selectedIndex].value,
div=document.getElementById("div");
//console.log(bgcolor)
if(bgcolor==0){
div.innerHTML="我没有发生任何变化";
div.style.backgroundColor="#fff"
}else{
div.innerHTML="我的背景颜色变成了"+bgcolor+"色";
div.style.backgroundColor=bgcolor;
}
}
}
        </script>
    </head>
    <body>
<div>
    <span>请选择您喜欢的颜色:</span>
    <select id="color">
        <option value="0">请选择</option>
        <option value="yellow">黄色</option>
        <option value="orange">橘色</option>
        <option value="pink">粉色</option>
        <option value="purple">紫色</option>
    </select>
</div>
        <div id="div">我是div</div>
</body>
</html>

写回答

1回答