有四种方法实现，原声js两种，两种jquery的，其实只是写法不同。方法如下：

<div id="show" style="display:none;">
<p>显示内容</p>
</div>
<div id="switch" onclick="showdiv()">点击显示</div>
<script language="javascript">

原生的js写法

function showdiv(){
if(showdiv_display = document.getElementById('show').style.display=='none'){//如果show是隐藏的
document.getElementById('show').style.display='block';//show的display属性设置为block（显示）
}else{//如果show是显示的
document.getElementById('show').style.display='none';//show的display属性设置为none（隐藏）
}
}

原生简写（三元运算）

function showdiv(){
/*
原理相同只是写法不同，判断show的display是不是none  是则设为block显示不是则设为none隐藏
*/
document.getElementById('show').style.display = document.getElementById('show').style.display=="none"?"block":"none";
}

jquery

function showdiv(){
if($("#show").css("display")=='none'){//如果show是隐藏的
$("#show").css("display","block");//show的display属性设置为block（显示）
}else{//如果show是显示的
$("#show").css("display","none");//show的display属性设置为none（隐藏）
}
}

jQuery 事件 - toggle() 方法

    $(function () {
        $("#btntest").bind("click",function(){
            $("div").toggle(500);//此处的 500 是隐藏显示的延迟时间，默认为0，也可以用"slow","normal"或"fast"
                                 //如果里面的值为true（toggle(true)）时只能显示元素，值为false（toggle(false)）时只能隐藏元素。
） }) });