麻烦老师帮忙检查一下,谢谢!
来源:3-12 编程练习
胜己
2020-02-15 15:13:43
<!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 color = document.getElementById("color"); var div = document.getElementById("div"); color.onchange = function() { if(this.value == "0") { div.innerHTML = "我没有发生任何变化"; div.style.backgroundColor = "#fff"; }else if(this.value == "yellow") { div.innerHTML = "我的背景颜色变成了" + this.value + "色"; div.style.backgroundColor = "yellow"; }else if(this.value == "orange") { div.innerHTML = "我的背景颜色变成了" + this.value + "色"; div.style.backgroundColor = "orange"; }else if(this.value == "pink") { div.innerHTML = "我的背景颜色变成了" + this.value + "色"; div.style.backgroundColor = "pink"; }else if(this.value == "purple") { div.innerHTML = "我的背景颜色变成了" + this.value + "色"; div.style.backgroundColor = "purple"; } } } </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回答
同学你好,代码实现的是正确的,继续加油,祝学习愉快~
相似问题