《JavaScript高级编程》,removeChild()后,节点不存在于document中

最近看到《JavaScript高级编程》,第10章介绍replaceChild(),里面有一句话

在使用 replaceChild()插入一个节点时,该节点的所有关系指针都会从被它替换的节点复制过来。尽管从技术上讲,被替换的节点仍然还在文档中,但它在文档中已经没有了自己的位置。

疑问是:被替换的节点指针都已经不指向文档中的任何节点了,为什么还在文档中?

这里写图片描述

我理解的文档是一个基于树的数据结构,当其中一个节点A被替换掉时,该节点A也就不与该树结构有任何关系,意思是无法通过该树的数据结构的变量找到该节点A。而是通过赋值的新的变量来从window.oldNode来获取。

来把代码试一下

<div class="div1">
    <ul>
      <li>1</li>
      <li class="li2">2</li>
      <li>3</li>
      <li>4</li>
      <li>5</li>
    </ul>
    <p>this is p element <span>&nbsp;this is span</span></p>
</div>
<script>
var oDiv = document.querySelector('.div1')
var oUl = document.querySelector('ul')
var oLi2 = document.querySelector('.li2')

console.log(window.document)
// -----
console.log(window.oDiv)
console.log(window.document.contains(oDiv))
// ----
var removedNode = oUl.removeChild(oLi2)
// ---
console.log(window.removedNode)
// ---
console.log(window.document.contains(removedNode))
</script>

这里写图片描述

结果显示,之前的div1还是在document对象中,而被删除oLi2不在document对象中

如果强制性认为书里描述是对的话,那就是我对这个文档 二字理解错误了。

被替换的节点仍然还在文档中,但它在文档中已经没有了自己的位置

第一个文档指的是当前页面的全局变量window,第二个文档单单指window下的document的节点。

以下是一个简单的Java代码实现: ``` import java.util.HashMap; import java.util.List; import java.util.Map; public class OrgSync { public static void sync(List<OrgUnitProDto> orgList, List<OrgUnitProRelationDto> relationList, List<OrgUnitProDto1> hrOrgList, List<OrgUnitProRelationDto1> hrRelationList) { // 以管理架构的组织编码unitCode为key,构建一个HashMap,将所有的组织节点存储在这个HashMap Map<String, OrgUnitProDto> orgMap = new HashMap<>(); for (OrgUnitProDto org : orgList) { orgMap.put(org.getUnitCode(), org); } // 以HR组织的组织编码unitCode为key,构建一个HashMap,将所有的组织节点存储在这个HashMap Map<String, OrgUnitProDto1> hrOrgMap = new HashMap<>(); for (OrgUnitProDto1 org : hrOrgList) { hrOrgMap.put(org.getUnitCode(), org); } // 以HR组织以unitCode=111为根节点,进行树的遍历 OrgUnitProDto1 root = hrOrgMap.get("111"); if (root != null) { syncOrgTree(root, orgMap, relationList, hrRelationList); } // 遍历完所有的节点后,管理架构剩余的节点即为需要删除的节点,将这些节点从管理架构删除 for (OrgUnitProDto org : orgList) { if (!orgMap.containsKey(org.getUnitCode())) { // 删除该节点 deleteOrg(org); } } } private static void syncOrgTree(OrgUnitProDto1 hrOrg, Map<String, OrgUnitProDto> orgMap, List<OrgUnitProRelationDto> relationList, List<OrgUnitProRelationDto1> hrRelationList) { // 判断该节点是否存在于管理架构 OrgUnitProDto org = orgMap.get(hrOrg.getUnitCode()); if (org == null) { // 该节点不存在于管理架构,将该节点插入到管理架构 insertOrg(hrOrg); org = new OrgUnitProDto(); org.setUnitCode(hrOrg.getUnitCode()); orgMap.put(org.getUnitCode(), org); } else { // 该节点已经存在于管理架构,更新该节点的信息 updateOrg(org, hrOrg); } // 遍历子节点 for (OrgUnitProRelationDto1 hrRelation : hrRelationList) { if (hrRelation.getParentUnitCode().equals(hrOrg.getUnitCode())) { // 找到子节点对应的管理架构节点 OrgUnitProDto childOrg = orgMap.get(hrRelation.getUnitCode()); if (childOrg != null) { // 子节点存在于管理架构,更新组织关系 updateOrgRelation(childOrg, org, relationList); } else { // 子节点不存在于管理架构,递归插入子节点 OrgUnitProDto1 hrChildOrg = hrOrgMap.get(hrRelation.getUnitCode()); if (hrChildOrg != null) { syncOrgTree(hrChildOrg, orgMap, relationList, hrRelationList); } } } } } private static void insertOrg(OrgUnitProDto1 hrOrg) { // TODO: 插入组织节点到管理架构 } private static void updateOrg(OrgUnitProDto org, OrgUnitProDto1 hrOrg) { // TODO: 更新组织节点信息 } private static void updateOrgRelation(OrgUnitProDto childOrg, OrgUnitProDto parentOrg, List<OrgUnitProRelationDto> relationList) { // TODO: 更新组织关系 } private static void deleteOrg(OrgUnitProDto org) { // TODO: 从管理架构删除组织节点 } } ``` 需要根据具体的业务逻辑来实现TODO的方法。同时,需要注意并发修改的问题,可以使用同步机制来保证数据的一致性。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值