'remove'和'removeChild'方法有什麼區別？

我已經創建了一個HTML頁面來了解如何移除元素。'remove'和'removeChild'方法有什麼區別？

代碼：

<html> 
    <head> 
    <script> 
     var childDiv = null; 
     var parent1 = null; 
     var parent2 = null; 
     function init() { 
     childDiv = document.getElementById("child"); 
     parent1 = document.getElementById("parent1"); 
     parent2 = document.getElementById("parent2"); 
     } 

     function rem() { 
     if (childDiv) { 
      childDiv.remove(); 
      alert("child removed"); 
     } else { 
      alert("child does not exist"); 
     } 
     } 

     function remChild() { 
     if (childDiv){ 
      if (parent1.children.length > 0) { 
      parent1.removeChild(childDiv); 
      alert("child unbound from parent"); 
      } else { 
      alert("child exists but is not bound to parent"); 
      } 
     } else { 
      alert("child does not exist"); 

     } 
     } 

     function ins() { 
     if (childDiv) { 
      parent2.appendChild(childDiv); 

      alert("child inserted to another parent"); 
     } 
     } 
    </script> 
    </head> 
    <body onload="init()"> 
    <div id="parent1"> 
     <div id="child"></div> 
    </div> 
    <div id="parent2"></div> 
    <button onclick="rem()">remove</button> 
    <button onclick="remChild()">removeChild</button> 
    <button onclick="ins()">insert</button> 
    </body> 
</html>

在這裏，我嘗試刪除 '孩子' 格在2種方式：

通過調用 '孩子' 的div
'刪除' 方法通過在'parent1'節點上調用'removeChild'方法

但是在這兩種情況下，節點並未實際移除。我總是可以將'child'div插入'parent2'。

我可以理解，在第二種情況下，'孩子'從'parent1'沒有綁定，並且沒有被實際刪除。但是在第一種情況下，這個'孩子'是不是永久刪除？

嘗試插入不存在的元素時，是否應該不會出現錯誤？

請解釋。

而且如果元素確實存在，甚至稱元素「刪除」，後：

如何被「刪除」從「removeChild之」有什麼不同？正如我所看到的，這兩種方法都是從父母手中解脫出來的，但元素仍然佔據着記憶。
有什麼方法可以確保元素實際上從內存中刪除？

來源

2016-05-03 Prasoon

節點實際上未被刪除

的混亂可能是因爲你可能會認爲移除元素意味着像殺死或破壞它。

但事實上，removal概念基本上意味着打破一個小孩子與其父之間的關係。這只是一個分隊。

我不應該得到而試圖插入一個不存在的元素的錯誤？

不，因爲它仍然存在。

remove與removeChild有什麼不同？

remove只需要提及孩子。 removeChild需要父母和孩子的參考。結果是相同的。

有什麼方法可以確保元素實際上從內存中刪除？

不可以，你只能重新引用它，並希望有一個垃圾收集器，它會檢測到對象沒有被引用，然後將其刪除。

來源

2016-05-03 08:52:03 Oriol

remove是一個新功能。這是一種快捷方式，可以更簡單地刪除元素而無需查找父節點。很遺憾，在舊版本的Internet Explorer上不可用，因此，除非您不想支持此瀏覽器，否則您必須使用removeChild或使用polyfill。

子元素保留在內存中的原因是您的代碼保留對它的引用。

如果你

childDiv = null;

那麼就沒有引用指向它，瀏覽器可以釋放內存。

來源

2016-05-03 08:12:35

我試着通過'removeChild'去除'child'，並刪除了對它的引用。這個時間元素也被永久刪除。我無法得到'小孩'回來。所以'removeChild'不只是從父類中解除綁定元素，而是實際移除它？由於我在代碼中保留了參考資料，我能夠獲得「孩子」嗎？所以它只是保持引用計數：就像保持跟蹤指向一個對象的指針數量？只要引用計數爲0，內存就釋放了？ – Prasoon

僅供參考，'刪除'在IE 11上可用。 – Prasoon

@Prasoon更全局的情況下，任何不可訪問的值（使用引用或DOM函數）都可以由引擎釋放（通常是）。 –

'remove'和'removeChild'方法有什麼區別？

回答

相關問題