版权声明：本文为博主原创文章，未经博主允许不得转载。 https://blog.csdn.net/chengxu_kuangrexintu/article/details/85552238
前言
我们有了解到数据类型中Boolean类型，那么我们生活中的开关装置就是Boolean的应用，我们写一个开关类型的Demo。
Boolean的应用Demo
我们通过JavaScript代码去控制我们div显示或者隐藏。希望对学习前端开发的小伙伴有帮助。
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title></title>
<style type="text/css">
body{
text-align: center;
}
#box{
width: 200px;
height: 200px;
background-color: orange;
/*用js代码去控制这边属性*/
display: none;
margin: 20px auto;
}
</style>
</head>
<body>
<button id="btn">开关</button>
<div id="box"></div>
<script type="text/javascript">
var oBtn = document.getElementById("btn")
var oBox = document.getElementById("box")
// 定义一个开关 控制显示或者隐藏 true显示，flase隐藏
var flag = true
oBtn.onclick = function(){
// 设置隐藏或者显示
if(flag == true){
oBox.style.display = "block"
}else{
oBox.style.display = "none"
}
flag = !flag
}
</script>
</body>
</html>