亚洲在线久爱草,狠狠天天香蕉网,天天搞日日干久草,伊人亚洲日本欧美

為了賬號安全,請及時綁定郵箱和手機立即綁定
已解決430363個問題,去搜搜看,總會有你想問的

js怎么改變div里面的內容

js怎么改變div里面的內容

眼眸繁星 2019-03-29 23:19:40
點擊什么顏色就在DIV背景顯示什么顏色,然后我是div 就變成選中的顏色文字 比如:選中黃色 div里面的文字改變成 我的背景顏色是yellow這個到底怎么去實現的???我寫了很多個方式代碼都沒法實現這個,百度和谷歌上面也沒有找到我想要的答案,有大佬幫我解答下嗎?就是不會怎么設置改變div里面<!DOCTYPE html><html><head>    <meta charset="UTF-8">    <title>Document</title>    <style type="text/css">        #div1 {            width: 300px;            height: 300px;            border: 2px solid gray;            margin: 100px 0 0 200px;        }    </style>    <script type="text/javascript">        // 頁面加載        window.onload=init;        //初始化函數        function init() {            // 獲取下拉菜單            var bgcolor=document.getElementById("bgcolor");            var div1=document.getElementById("div1");            // 給下拉菜單綁定change事件            bgcolor.onchange=function() {                // 選中當前的值            }        }    </script></head><body>    <div>        <span>請選擇你喜歡的顏色:</span>        <select id="bgcolor">            <option value="">請選擇</option>            <option value="yellow">黃色</option>            <option value="orange">橘色</option>            <option value="pink">粉色</option>            <option value="purple">紫色</option>        </select>    </div>    <div id="div1">我是div</div></body></html>
查看完整描述

3 回答

?
開心每一天1111

TA貢獻1836條經驗 獲得超13個贊

// 頁面加載

window.onload = init;


//初始化函數

function init() {

    // 獲取下拉菜單

    var bgcolor = document.getElementById("bgcolor");

    var div1 = document.getElementById("div1");

    // 給下拉菜單綁定change事件

    bgcolor.onchange = function () {

        // 選中當前的值

        var color = bgcolor.value;

        if(color){

            div1.style.backgroundColor = color;

            div1.innerHTML = '我的背景顏色是' + color;

        }

    }

}


查看完整回答
反對 回復 2019-04-14
?
FFIVE

TA貢獻1797條經驗 獲得超6個贊

https://img1.sycdn.imooc.com//5cb2d36c00011cf505450233.jpg

查看完整回答
反對 回復 2019-04-14
?
米脂

TA貢獻1836條經驗 獲得超3個贊

 function init() {

    // 獲取下拉菜單

    var bgcolor = document.getElementById("bgcolor");

    var div1 = document.getElementById("div1");

    // 給下拉菜單綁定change事件

    bgcolor.onchange = function (event) {

        // 選中當前的值

        let color = event.target.value;

        switch (color) {

            case 'yellow':

                div1.style.backgroundColor = color;

                div1.innerHTML = '我的背景顏色是' + color;

                break;

            case 'orange':

                div1.style.backgroundColor = color;

                div1.innerHTML = '我的背景顏色是' + color;

                break;

            case 'pink':

                div1.style.backgroundColor = color;

                div1.innerHTML = '我的背景顏色是' + color;

                break;

            case 'purple':

                div1.style.backgroundColor = color;

                div1.innerHTML = '我的背景顏色是' + color;

                break;

            default:

                div1.style.backgroundColor = 'white';

                div1.innerHTML = '我是div';

        }


    }

}


查看完整回答
反對 回復 2019-04-14
  • 3 回答
  • 0 關注
  • 962 瀏覽
慕課專欄
更多

添加回答

舉報

0/150
提交
取消
微信客服

購課補貼
聯系客服咨詢優惠詳情

幫助反饋 APP下載

慕課網APP
您的移動學習伙伴

公眾號

掃描二維碼
關注慕課網微信公眾號