99% 的時間，要對用戶隱藏/刪除元素，您可以使用display:none;. 有一個用例，需要從 DOM 中永久刪除元素。有沒有使用 JavaScript 從 DOM 中刪除元素的解決方案?

答案是肯定的!您可以使用 node.removeChild() JavaScript 實用函數從 DOM 中永久刪除元素。

node.removeChild讓我們通過一個代碼示例來了解如何使用。

解決方案

假設您有一個列表。

<ul>
  <li id="1">Whiskey</li>
  <li id="2">Carmella</li>
  <li id="3">Fluffy</li>
</ul>

假設我想將 Carmella 從列表中刪除。這是在 JavaScript 中如何完成的：

// Step 1: Select element you desire to remove
const carmella = document.querySelector('#2');
// Step 2: Check if she exist in the list
if (carmella) {
  // Remove from element permanently from the DOM
  // Step 3: Reference back to the parent element and execute removeChild()
  // Step 4: Pass in element you desire to remove
  carmella.parentElement.removeChild(carmella);
}

通過使用node.removeChild()，您將從 DOM 中永久刪除一個元素。超級簡單!