用js实现点击按钮修改div的颜色

内容描述:当点击button按钮时修改div的颜色

代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
        #div1 {
            width: 100px;
            height: 100px;
            border: 1px solid black;
        }

        .box {
            background-color: red;
        }
    </style>
    <script>
        function f() {
            var Div1 = document.getElementById("div1");
            Div1.className = "box";
        }
    </script>
</head>
<body>
<input type="button" onclick="f()" value="修改div颜色">
<div id="div1"></div>
</body>
</html>

效果图:

初始图:

点击button:

 

猜你喜欢

转载自blog.csdn.net/psjasf1314/article/details/124104519