JavaScript改变div的背景颜色

来源：互联网发布：openstack 源码编辑：程序博客网时间：2024/05/17 15:41

最简便的写法<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>任务三</title>    <script type="text/javascript">    function bs(v) {        kuang.style.backgroundColor=v;}    </script></head><body>    <p>请选择颜色：</p>    <select id="test" name="xuanzekuang" onchange="bs(this.value)">        <option value="red">红</option>        <option value="green">绿</option>        <option value="blue">蓝</option>        <option value="black">黑</option>    </select>    <div id="kuang" style="width: 100px;height: 100px;border: 1px solid #eee">    </div></body></html>

第二简便写法<!DOCTYPE html><html lang="en"><head>    <meta charset="UTF-8">    <title>任务三</title>    <script type="text/javascript">    function bs() {        var myselect = document.getElementById("test");        var index = myselect.selectedIndex;        var zhi = myselect.options[index].value;        var kuang = document.getElementById("kuang");        kuang.style.backgroundColor=zhi;}    </script></head><body>    <p>请选择颜色：</p>    <select id="test" name="xuanzekuang" onchange="bs()">        <option value="red">红</option>        <option value="green">绿</option>        <option value="blue">蓝</option>        <option value="black">黑</option>    </select>    <div id="kuang" style="width: 100px;height: 100px;border: 1px solid #eee">    </div></body></html>

阅读全文

0 0