<!DOCTYPE html>
<head>
<meta charset="utf-8"/>
<title> </title>
<script>
function toggle(){
//找到id为d1的div
//条件:如果d1的display属性为none
//操作1,设置d1的display为block
//操作2,设置d1的display为none
//var div=document.getElementById("d1");
//console.log(div);//打桩:在程序的关键位置输出变量值,控制台
/***console.log(d1);
d1.style.display=="none"?
(d1.style.display="block"):
(d1.style.display="none");**/
d1.style.display=
d1.style.display=="none"?"block":"none";
}
</script>
</head>
<body>
<div id="d1" style="width:50px;height:50px;background-color:red;"></div>
<button οnclick="toggle()">toggle</button>
</body>
</html>
<head>
<meta charset="utf-8"/>
<title> </title>
<script>
function toggle(){
//找到id为d1的div
//条件:如果d1的display属性为none
//操作1,设置d1的display为block
//操作2,设置d1的display为none
//var div=document.getElementById("d1");
//console.log(div);//打桩:在程序的关键位置输出变量值,控制台
/***console.log(d1);
d1.style.display=="none"?
(d1.style.display="block"):
(d1.style.display="none");**/
d1.style.display=
d1.style.display=="none"?"block":"none";
}
</script>
</head>
<body>
<div id="d1" style="width:50px;height:50px;background-color:red;"></div>
<button οnclick="toggle()">toggle</button>
</body>
</html>