【点击按钮div盒子消失---看完不会请打我】

最新推荐文章于 2022-10-12 09:23:54 发布

studyer网

最新推荐文章于 2022-10-12 09:23:54 发布

阅读量527

点赞数 2

文章标签： css html javascript

本文链接：https://blog.csdn.net/m0_56349322/article/details/123319009

版权

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="utf-8"/>
        <meta content="IE=edge" http-equiv="X-UA-Compatible"/>
        <meta content="width=device-width, initial-scale=1.0" name="viewport"/>
        <title>div盒子消失</title>
    </head>
    <style>
        #box1 {
            width: 400px;
            height: 400px;
            background-color: pink;
            display: block;
        }
        
        #box2 {
            width: 200px;
            height: 200px;
            background-color: blue;
        }
    </style>
    <script type="text/javascript">
    	var div = document.getElementById("box1");
    	var a=true;
        function toggle(){
    		a=!a;
    		a?box1.style.display='block':box1.style.display='none';
    	}
    </script>
    <body>
        <div id="box1">
            我是盒子box1
            <div id="box2">
                我是盒子box2
            </div>
        </div>
        <button onclick="toggle();">
            点我消失盒子
        </button>
    </body>
</html>