javascript - 为什么 jQuery 显示/隐藏使用 display:none 而不是 visibility:hidden？

Question

display:none意味着该元素不会作为 DOM 的一部分呈现，因此在显示属性更改为其他内容之前不会加载它。

visibility:hidden加载元素，但不显示它。

为什么 jQuery 使用它的显示/隐藏功能而不是在anddisplay:none之间切换？visibility:hiddenvisibility:visible

score 65 · Accepted Answer

因为在中display:none，无论出于何种目的，元素都不复存在——它不占用任何空间。但是，在中visibility:hidden，就好像您刚刚添加opacity:0到元素中一样——它占用了相同数量的空间，但只是不可见。

jQuery 创建者可能认为前者更适合.hide().

score 18 · Accepted Answer

visibility: hidden使元素不可见，但不会将其从页面布局中移除。它在元素所在的位置留下一个空框。display: none将其从布局中删除，因此它不会占用页面上的任何空间，这通常是人们在隐藏某些内容时想要的。

score 10 · Accepted Answer

Visibility:hidden 使元素不可见，它仍然使用页面上的空间。Display:none 使元素没有空间并完全消失，而它仍然存在于 DOM 中。

score 6 · Accepted Answer

6

可见性只是使元素不可见，但它仍然会占用屏幕上的空间。

于 2009-07-21T16:14:21.533 回答

score 1 · Accepted Answer

Visibility:hidden只是使元素不可见，但它是在 DOM 中加载的，因此会消耗加载时间。但Display:none不加载元素。

5 回答 5