本文介绍利用JavaScript控制HTML元素显示和隐藏的两种常用方法。主要区别在于控件隐藏后是否继续占用页面空间：通过设置style.visibility属性可实现隐藏但保留占位，而通过设置style.display属性则可实现完全隐藏且不占位。
JS控制元素显示的两种方法概述
使用JavaScript控制页面控件的显示与隐藏主要有两种方式，这两种方式分别对应HTML样式（style）中的两个不同属性。它们的核心区别在于：控件被隐藏后，其在页面上是否仍然占据原有的空间位置。
方法一：保留占位空间的隐藏
第一种方法：
document.getElementById("EleId").style.visibility="hidden";
document.getElementById("EleId").style.visibility="visible";采用上述方式实现隐藏效果后，控件虽然在视觉上不可见，但其原本占据的页面空间依然保留，表现为该位置出现空白。
方法二：不占位空间的隐藏
第二种方法：
document.getElementById("EleId").style.display="none";
document.getElementById("EleId").style.display="inline";采用上述方式实现隐藏效果后，控件不仅视觉上不可见，其原本占据的页面空间也不再被占用，后续元素会填补该位置。