如何使用 DOM 在 JavaScript 中隐藏元素而不占用页面空间？

Question

我在 JavaScript 中使用 DOM 隐藏元素。它在使用 display='none' 时隐藏元素， 但它的空间仍然存在（就像在 CSS 中使用 visibility='hidden' 时一样）。 如何隐藏空格？

    el.parentElement.nextElementSibling.style.display='none';

Answer 1

您可以在 CSS 文件中为名称为 "hidden" 的类创建样式并将其样式设置为隐藏：

.hidden {
  display: none;
  visibility: hidden;
}

因此，您可以使用 js 向任何元素添加或删除此类：

添加课程：

element.classList.add("hidden")

删除类：

element.classList.remove("hidden")