App下載
話題 首頁 > JavaScript 教程 > JavaScript 教程話題列表 > 詳情

JavaScript如何實(shí)現(xiàn)點(diǎn)擊按鈕清除顏色

精華
??聽?風(fēng)??153211? 2019-03-02 18:38:20 瀏覽(4435) 回復(fù)(4) 贊(0)
首先做兩個(gè)矩形,一個(gè)透明的另一個(gè)是有顏色的<br/>其次做一個(gè)按鈕,再點(diǎn)擊按鈕后可以把上面兩個(gè)矩形顏色清除
javascript

回答(4)

1328157118 精華 2019-03-03

簡單的實(shí)現(xiàn)一下:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Remove Color</title>
    <style>
        .box {
            width: 100px;
            height: 100px;
            border: 2px black solid;
            padding: 10px;
            margin: 10px;
        }
        #green {
            background-color: green;
        }
        #red {
            background-color: red;
        }
    </style>
    <script>
        function removeColor() {
            document.getElementById("green").style.backgroundColor = "white";
            document.getElementById("red").style.backgroundColor = "white";
        }
    </script>
</head>
<body>
<p id="green" class="box">綠盒子</p>
<p id="red" class="box">紅盒子</p>
<button type="button" onclick="removeColor()">清除顏色</button>
</body>
</html>

我建議,在body里設(shè)置背景色為,#fff

FN豆 2019-04-22

背景設(shè)置白色或者不設(shè)置顏色,然后js控制屬性為空即可清除

Nansly 2019-05-21

有可能整個(gè)容器的背景不是白色的哦

要回復(fù),請(qǐng)先登錄 或者注冊(cè)