CSS`display：none`对DOM的影响[重复]答案

【问题标题】：CSS `display:none` effect on DOM [duplicate]CSS`display：none`对DOM的影响[重复]
【发布时间】：2021-03-24 17:05:45
【问题描述】：

嗨，我想知道将display:none 应用于元素的效果是什么。它是从 DOM 中删除还是仅从文档流中删除？从文档流中删除元素意味着什么？我知道 visibility: hidden 只是隐藏了元素，但它仍然会影响文档流，并且您可以使用 remove() js 方法从 DOM 中删除元素。

【问题讨论】：

这能回答你的问题吗？ What is the difference between visibility:hidden and display:none?

标签： html css

【解决方案1】：

display: none; 只会隐藏元素，但所有侦听器事件仍将存在。它不会从 DOM 中删除。但visibility: hidden 和display: none 的区别在于，第一种情况下会渲染标签和里面的内容，而第二种情况下不会渲染标签。

visibility: hidden;

div标签被渲染并影响文档流

display: none;

div 未呈现

【讨论】：

jQuery 可以删除它。
@jqueryHtmlCSS，就像普通的旧 javascript 一样。 CSS 不能做的是改变 DOM，只改变它的表现方式。
@Pushkin 那么可见性有什么区别：隐藏，它不也隐藏元素吗？
@FRANCISCOBERNAD，在这两种情况下，它都会被隐藏，不像display: none，元素会在visibility: hidden中渲染

【解决方案2】：

使用显示：无；将使元素消失，就像它从未存在过一样，可见性：隐藏；只会隐藏它，使它有点透明，它会干扰文档流

【讨论】：