Js简单实现点击显示隐藏某元素块
作者：秋了秋 发表时间：2014年12月18日
JS在网站制作中充当着非常重要的角色，有的时候我们不需要将网站中的一些内容展示出来，只有当用户需要的时候用鼠标点击之后才会显示出来，而这用js来操作就非常好办了，对于一种效果js有很多方法可以走，但一个简单的功能没必要动大手术，尽量越少越好，追求高效率的网页代码是时代的需求。以下是一段简单实现点击显示隐藏某元素块的js代码：
function click_a(divDisplay){ if(document.getElementById(divDisplay).style.display != "block"){document.getElementById(divDisplay).style.display = "block";} else{document.getElementById(divDisplay).style.display = "none";} }
解释：这段js创建的是click_a的动作，divDisplay是默认的元素id，当点击divDisplay时，如果（if）页面中的divDisplay元素（查找：document.getElementById）的样式（style）的display属性不是（!）block的话，就把这个元素的样式display属性改为block（显示），否则（else）的话，也就是元素的display属性为block，那就把它变为none（隐藏起来）。
这样当你点击divDisplay这个元素的时候，会改变它的显隐状态，当再次点击时又会改变显隐状态，这样就达到了显示隐藏循环交替的功能，知道这个原理对于延伸扩展开发就简单了。
当你需要在点击某个id的元素改变另外一个id元素的状态的时候，可以直接在点击的元素里面添加onclick="return click_a('wp_wuover')"，wuover为需要改变状态的元素。比如：
<div onclick="return click_a('wp_wuover')"><a>快点击我试试</a></div><br/> <div id="wp_wuover" style="margin:0 20px 20px; display: none;color:red;"><a href="//netblog.cn" title="点击他">秋叶被点击了</a></div>