如何做一个控制对象显示和隐藏的开关

解决思路：
其实需要做的只是判断对象当前是否在显示状态，是则隐藏，否则显示。
具体步骤：
1.用if语句判断。
<button onClick="if(demo.style.display==’block’)demo.style.display=’none’;else demo.style.display=’block’">显示/隐藏</button>
<span id="demo" style="display:block">显示/隐藏</span>
2.用三目运算作判断。
<button onClick="demo.style.display=(demo.style.display==’none’?’block’:’none’)">显示/隐藏</button>
<span id="demo" style="display:block">显示/隐藏</span>
3.在2的基础上加入with语句。
<button onClick="with(demo.style)display=display==’none’?’block’:’none’">显示/隐藏</button>
span id="demo" style="display:block">显示/隐藏</span>
4.利用对象简略式定义的方法。
<button onClick="with(demo.style)display={none:’block’,block:’none’}[display]">显示/隐藏</button>
<span id="demo" style="display:block">显示/隐藏</span>
提示：上面四段代码都是以display属性为例，同样，用visibility属性也可以实现，代码如下：
<button onClick="with(demo.style)
visibility={hidden:’visible’,visible:’hidden’}[visibility]">
显示/隐藏</button>
<span id="demo" style="visibility:visible">显示/隐藏</span>
特别提示
单击本例任何一段代码运行后的按钮，demo对象将在显示与隐藏间依次切换。