首页html设计一个下拉框，选项为“红色”、“蓝色”，设计一个DIV，当下拉列表选择切换时，DIV背景根据选择的选项切换颜色。

html设计一个下拉框，选项为“红色”、“蓝色”，设计一个DIV，当下拉列表选择切换时，DIV背景根据选择的选项切换颜色。

时间: 2023-04-04 11:05:06 浏览: 198

可以使用以下代码实现： ``` <!DOCTYPE html> <html> <head> <title>下拉框切换背景颜色</title> <script> function changeColor() { var select = document.getElementById("colorSelect"); var div = document.getElementById("colorDiv"); var color = select.options[select.selectedIndex].value; div.style.backgroundColor = color; } </script> </head> <body> <select id="colorSelect" onchange="changeColor()"> <option value="red">红色</option> <option value="blue">蓝色</option> </select> <div id="colorDiv" style="width: 200px; height: 200px;"></div> </body> </html> ``` 当下拉框选择切换时，会触发changeColor()函数，获取选择的选项的值，然后将DIV的背景颜色设置为该值。

阅读全文