对吗，是否有待优化

来源：4-12 编程练习

张小阳_

2022-07-04 12:24:40

<!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 = function () {
            var select = document.getElementById('color');
            var div = document.getElementById('div');
            select.onchange = function () {
                var option = document.getElementsByTagName('option')[0];
                if (this.value == 0) {
                    div.innerHTML = '我没有变化';
                    div.style.backgroundColor = '#fff';
                } else if (this.value == this.value) {
                    div.innerHTML = '我的颜色变成了' + this.value;
                    div.style.backgroundColor = this.value;
                }
            };
        };
    </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回答