在Javascript中，为什么在元素上设置outerHTML会将其parentNode设置为'null'

在Javascript中，当我将DOM中元素的outerHTML设置为新值（例如，将其更改为不同的元素）时，其"parentNode"属性将设置为"null"。为什么？我希望它保持在outerHTML更改之前的任何值。

我猜DOM是通过解析"outerHTML"字符串来创建一个新对象，并使用它来替换原始对象。如果是这种情况，是否有一种方法可以检索新创建的对象？

复制步骤（在Linux Chrome和Linux Firefox上测试）

1. 在浏览器中打开一个干净的窗口，

2. 打开开发控制台（可能是F12）

3. 查看页面DOM（Chrome中的Element选项卡，Firefox中的Inspector）

4. 删除"身体"的任何子项，只是为了让事情更干净

5. 打开控制台并键入：

   obj1 = document.createElement('div')

   obj1.id = '1'

   document.body.appendChild(obj1);

   obj1.parentNode-应该将"body"HTML写入控制台。

   obj1.outerHTML = "<div id='2'></div>"

   obj1.parentNode-现在将"null"写入控制台。