<!DOCTYPE html><html> <head> <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=select; function select(){ var a=document.getElementById("div"); var b=document.getElementById("color"); b.onchange=function(){ var bgcolor=b.options[b.selectedIndex].value; if(bgcolor=="0"){ a.style.background="white"; a.innerHTML="我没有发生任何变化"; }else if(bgcolor=="yellow"){ a.style.background="yellow"; a.innerHTML="我的背景颜色变成了yellow色"; }else if(bgcolor=="orange"){ a.style.background="orange"; a.innerHTML="我的背景颜色变成了orange色"; }else if(bgcolor=="pink"){ a.style.background="pink"; a.innerHTML="我的背景颜色变成了pink色"; }else if(bgcolor=="purple"){ a.style.background="purple"; a.innerHTML="我的背景颜色变成了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>
添加回答
举报
0/150
提交
取消