12. 尚硅谷_佟刚_JavaScript DOM编程_插入节点及自定义的 insertAfter 方法.wmv原创

我们来看这个插入节点，要引色before，它把一个给定节点插入到给定元素节点的前边，什么呢？叫in个before，你看in色before new notde插到target not的前边，就是说我把这个节点插入到这个节点这个子节点的前边，懂这意思了吧？然后这个new child将被插入到圆柱节点element中，出现在节点它给的前面节点。他给node必须是一个原数节点的子节点，你就去看吧。插入节点。十。

测试插入子节点叫颜色。举报。张若。今天好吧，我先说出这个方法啊，这个方法的话呢，也是由一个节点来进行调用，新的放在前边，旧的放在后边，于是的话呢，我们测试一下，我说啊。嗯，把把谁呢。把插入到。北京节点的。前面我们基本上就是在用基本的语法或先获取CK节点等于document，填element by，再获取，再获取。

的这个再获取颈节点等于document.d也好了，下边看。什么情况说节点。颜色，它第一个是new new RL no，旧的。目标节点指向那个是吧，北京，Not，好，先写一个a lot。就像以前的样子啊，ABC值。过来。到时。

到十先长这样好了，上去看公里数，北京前面的，所以说这个除了有插入功能以外的话呢，还有移动的功能，就是一个最最基本的一个写法怎么写的。说。为这个节点的这个子子的前边插入它，这就是基本的写法，然后说。按该方法。除了。进行插入。外还有什么呀，还有移动节点的，嗯，可以，还可以这么写，这就是一个句律，基本的hellowork，我们完全是照那个语法来写，我们下一步的话呢，我们需要干什么呢？我们需要来写一个方法，这个方法叫in色after，我们现在只有一个in色before，这特别怪啊，他没定义过in色的after，你看。

爱上头呢？那应该是在里面。眼色。嗯。Hi，没有吧，色他。我还弄在里边啊，没找着。I，这大家看只有一个隐色before，往往这看就知道了，是不是没有隐色的after，有的话是不是应该挨着呀，按这个按字母排序吗？没有，那我们来写一个颜色来。

Function检啊，我也写一个new job new nose写一个，就是说目标是什么呢。目标是向把U。No入到prefer node的。后面啊，大家想一下这个如何进行插入，我如何把这个新的插到这个的后面。那我们只能是借助于。以有的方式，那怎么查收啊。

第一种情况，第二种情况我们要看一看什么呀，要先测试这是谁呀，Nose是否为其负节点的最后一个节点好了。第二种情况，如果是的话，如果。是，就如果这个是负节点的最后一个节点，我们可以怎么办呢？直接把u no插入为reference no，负节点的最后一个。子节点是不是可以了，懂不？就是说如果我这个节点已经是最后一个最后一个子节点了，那我这个新的放的时候是不是要放的比这个还厚啊，那我就直接。

把它插入到这个负节点的最后一个子点是不是就可以了，使用upon，如果不是呢？三如若不是怎么办？获取refernode的下一个兄弟节点是什么呢？如果不是的话，这说明我有下一个兄弟，那我获取下一个兄弟节点，然后呢？然后插入到其下一个胸壁。节点的前面是这样吗？就是我们的基本思路。看一下这个基本思路，能懂不？比方说我插到首尔这个电子的后边，那我就直接加为ul的最后一个子点就可以了吧。

哎，我要插到东京的后边，我先获取东京下一个首尔，然后我再插到首尔的结发是就可以了，好了这就行了，于是我们获取一下吧，不过。这是最后一个last。这样我last not吧，最后一个等于谁呢？等于not，先获取节点。哇，Parent node啊，如果存在负节点的话，再瞅瞅没有负节点的话，你超出的份都没有啊，如果parent not，然后的话呢，获取last no于谁呀，等于parent not的last child，最后一个孩子认证一下，如果。好的，Reference note等于last not，这事是不是就简单了呀？直接ARM not.end放谁放new node不就完了？

也可以吧。第一种情况就OK好了，那else，如果要不是呢？不是的话，没办法，那我需要获取当前的下一个兄弟，Or next node等于not的下一个兄弟，有个方法，刚才我们看到了哈。Next啥啥，你看previous sibling，下一个叫next sibling n打头的。Book。这个获取下一个CTRLC过来。下一个兄弟，那你有啊就写吧，然后的话呢，我直接调用parent not insert before是这样写new not，后边写next not，这不就完了吗？

从这。行，这就写完了。好了，比色比说我们试一下啊，现在的话呢，我来获取一个这个首尔，我为了这个方便我这样写。首尔这几个东京，东京OK，好了，这是我先简写的，把这个反着我先掉，我们还是以2L点为例啊，来或一个reference no等于government点。

At element by ID，谁呢？首尔，首尔最后一个哈，好了，我要插到首尔的后边，首尔最后一个。于是我写色after。好了，新的叫RL node，旧的叫no。OK，看效果还在。看一下，看着我是不是到后边来好用好了再测试一下。Reference no等于document.at element by，谁呢？我说啊，这个时候是东京，我放在东京的后边，过来再看。我点一下的后边啊，这样的话呢，这个操作就成功了，这就是我们自己定义的insert after的方法。

它可以把啊，我们的一个新节点放到指定节点的后边，而W3C标准只提供了一个颜色before，我们认为这个方法是对这个方法的一个有利的补充。大家要明白这个方法的基本思路是什么，而且它是如何实现的，而且会使用它。好OK，我们这边的话呢，我们继续来看我们的这个笔记，那到这块的话呢，就插入节点还有什么呀，还有一些呃，其他属性，比方说next sibling啊，Previous sibling啊，这些我们就不一个一个讲了，需要的时候你干什么，你过来看这个文档就可以了。