本文介绍了使用jQuery和原生JavaScript实现Div元素显示与隐藏的多种方法。重点对比了CSS属性display与visibility在控制元素可见性及页面空间占用上的差异，提供了具体的代码示例，帮助开发者根据实际需求选择合适的实现方案。
jQuery控制Div显示与隐藏
利用jQuery库可以便捷地控制Div元素的显示与隐藏状态。
具体实现显示效果的方法如下。
参考以下代码示例：
$("#id").show()实现隐藏效果的方法如下。
参考以下代码示例：
$("#id").show()原生JS控制Div显示与隐藏及属性区别
使用原生JavaScript同样可以实现Div的显示与隐藏控制。
通过修改div的visibility属性可以控制其显示或隐藏，但需要注意的是，使用此方法隐藏元素后，其在页面中占据的空间仍然保留，不会折叠。
相关CSS样式代码如下：
style="visibility: none;"
document.getElementById("typediv1").style.visibility="hidden";//隐藏
document.getElementById("typediv1").style.visibility="visible";//显示若希望元素隐藏后不再占用页面空间，可以通过设置display属性来实现，具体操作如下。
相关CSS样式代码如下：
style="display: none;"
document.getElementById("typediv1").style.display="none";//隐藏
document.getElementById("typediv1").style.display="";//显示