13. 尚硅谷_佟刚_jQuery_创建节点及插入节点.wmv原创

我们来看这块。com操作到文档对象模型，一种与浏览器平台语言无关的接口，使用该接口可以轻松地访问页面中所有的标准组件。DOM承受的分类可以分为几种类型，第一个核心DOM，核心DOM呢，并不专属于JS，任何一个支持DOM，腾讯设计语言都可以用它。它的用途。非仅限于网页，它可以用来处理任何一种使用标记语言编写的文档。比方说XML，明天我们讲XL的时候，我们就会看，可能会用Java里边的这个do去操作XL文档。哎，DOM的第二个分类叫HTMLDOMHTMLDOM呢，它就是专门专门针对这个HTML的，使用JS跟DOM为HTML编写脚本，有很多专属于HTMLDOM的脚本，比方说那个in的HTML。

他就是它不是do标准，但是所有浏览器都支持它，还有一个是csf do针对于CSS的，就是比方设一个背景啊，让这个字体变出变成斜体啦，也就是CSS。我们先看核心道里边的查找节点，那这个查找节点呢，主要就是通过这个几块的选择器就可以了，好了，我们看叫查找属性节点，或者叫操作属性节点，我们还有一个什么，实际上还有一个叫。包括文本节点吧，是吧，我们在前面的话呢，我们讲过这样几个，第一个查找属性节点，通过选择期，第二个查找属性节点，我们通过这个HTTR方法，实际上不叫查找，应该叫什么呀，叫操作，我们不会特意去找到那个属性节点怎么样，我直接通过attribute at DR方法去读写属性值就可以了。

然后是操作文本节点，这个通过什么，通过text，诶，OK，我们看一下这个，我找到前面我们写的一个道。Copy。百度名就榜一。啊，测试。使用也操作。

文本节点。属性节点一。查找。人数节点。关于这个具体的这个写法的话呢，如何来办呢，后边我已经写了啊，就是通过啊这三种方式，这个是通过选择器，这个是通过X的方法，这是通过的方法，我们看一下效果就可以了，首先导进来。导进解宽。OK，我们看一下底下这个啊，底下刚好我们有个什么呀，我们有一个来我们先看。查找这个就是我们前面讲的这个，我们就不特意说了啊，我们看第一个这怎么办呢？先写的它方程第一个。

我们说要包括文本节点，这我们说了啊，通过。也query对象。对象的太子。我可以完成读写操作，那这个呢，刚才说那个练习指的实际上就是它第一个读，比方说我来读取北京节点这个文本值，看和读。北京节点是不是顶号啊，ID吗？北京的。

啊，读好了再看写。北京的T写个。北京上硅谷，上硅谷看效果杠一。那看不着看看不着鼠标是吧。上吧。OK，北京看着改了上海股，这是不是就是一个读写操作呀，这就是一个读写操作，好了我们再看。

操作属性节点怎么操作呢。我们可以通过这个和people的方法啊，通过点que对象的a drr方法，比方说我先读读谁呢，来读这个you nameme，这个text的这个value，然后再为其赋值，看效果啊了，直接写了哈。怎么写？首先它是个text，而且name名等于的name，我获取它的Y流属性值at tr，注意这么写的哈，Y流属性值。这样设好吧，下一个我其外流属性负值at tr。

再看外水，用负值为上尾部保存。保存再看。北京硅谷，注意底下这个底下，这是爱的硅谷吧。再看哎上对谷就是通过这样的方式，怎么样去操作属性节点。当然了，因为我这个我操出这个特殊这个属性叫Y流属性，这个Y流属性的话呢，直接的操作方式是使用VL方法，我们写一个注啊。数说直接操作Y流属性值。可以。

使用更便捷的。V方法，但是的话呢，我们通过这个举例子就可以，这就是什么呀，要操作文本节点跟操作属性节点而查找的话，我直接使用这个选择器就可以。很方便。查找之后是放建节点。我们在。GS do里边创建节点的话呢，相当麻烦，比方说可能要创建一个节点的话，我可能先需要创建一个节点，然后的话呢，操作属性再创建一个文本节点，然后文本节点加为这个元素节点的子节点，再把。这个元数节点加为某一个节点的子节点，或者是放在某一个节点的前边，放在后边那个方法还是我们自己定义的，还记得吧，很麻烦，我们看在GS里面这个会变得，呃，在j query里边这个会变得简单的多。首先看创建节点，创建节点的话呢，我们可以使用JA宽RY的工厂函数，就这个。

当乐福括号。然后的话呢，把我们要创建节点这个内容啊放到这个里面，它会根据传统的HTML标记字符串创建一个down对象，而且把这个down对象包装成一个解块对象返回，当然这个呢，不会自动的插到文档里面，第一个我们也需要调用对应的方法把它插到指定的位置，第二我们在创建这个节点的时候，我们需要注意到什么，它有标准的闭合标签。

我们在用JS创建节点的时候，Document create element，是不是写个P就可以呀，而这个肯定写一个完整的，呃，开始跟闭合，你光写一个P是不行的。好，创建文本节点怎么创建呢？直接在创建属性节点的时候，把这个文本加上，加到这个里边，创建属性节点，你也可以直接加就直接加就完了，好这个的话呢，并不足以让我们举例子，我们还需要有什么呀，还需要看如何进行插入，插入节点呢，我们有这样的。几个方法，第一个end直接放到指定结指定一个节点的结尾处，即加为这个结点的最后一个。时间点a to这两个怎么样互换主语和宾语？

To啊，我加为C。Pretend，这是什么呢？这是加到结尾处，这个是加到开始处pretend to也是跟pretend的主语跟宾语互换位置，OK，测试一下这四个方法，同时也看一下创建节点的这个方式。打开。测试使用j query放电。节点并发入节点到指定岗节点中，后来那我们看吧。

一。创建一个。什么节点呢，这么一个节点。一。一解，个ID等于I，硅谷上硅谷，然后。二并把其加入到。Sticky。啊，对的子节点吧。行好了，以前写这个事的话呢，很麻烦，现在这个写法啊，我写一个。

一提上股。ID等于。因为这个直接加，加为谁呢？加为heated节点。P子节点，这就写完了。看效果先。Downtown刷新一下。哦，有点问题啊，怎么了，P不对吧，不叫P应该叫什么？什么叫Li啊，写错了Li。

嗯。好，再看。怎上来了，这么上来的好了，那加完之后的话呢，我们得看这个ID有没有效啊，于是我来扼乐它一个，看看ID有没有效，怎么写呢，这么写井号艾特归谷啊，我想看看这个。ID是不是有效的，开心是不是有效啊，哎，这样这个就加完了，这就喷度方法，呃，喷度什么意思啊。上杆子，把这个加为某个节点的子节点，好，我再调过来，再看一下，我们说pen跟pen to啊，是主语跟宾语互换位置，于是的话呢，调过来写，应该这么写p.a panda，然后加一个进来，哎，我在加的时候呢，我可以直接写它。

嗯。Control。C。这个我先。Yeah。好看效果。杨就说确定吗，我们。加个标记来看。这不一样，正位股这个时候带来一个中括号一样的，这就是aend跟a pen to，它俩可以互换主语和宾语，能想明白什么时候是a pen，什么是我，什么时候是a pen to吧，A pen to是不是有一个投怀送抱的感觉啊，我要嫁给谁，我要加为谁谁的直接点，而这个喷呢，你过来啊，我把你加进来。

OK，那么对应的还有什么？还有一个叫to，把这两个。复制一下，看一下来第一个。是什么把它加到第一个子集点的前边，再看再刷新啊这的哎，加到第一个子节点的前边，看这个这个变成re re。Pen。再看是不一样啊，OK，这就是我们这块的讲到的这个创建元素节点以及添加子节点的四个方法做一个小结。

第一稿创建节点。第二个加节点，添加节点吧，添加节点，诶创建节点，这个跟以前的GS比超级简单，使用什么呀，使用。HTML。方式。D口，然后我们说元素节点。元素节点，文本节点还有什么？

属性。几点可以一网？好了，我们直接看什么呢？我们直接说例子就可以了，就这么着。这就是。这是一个最好的例子，然后我说返回什么呢？返回对应节点的几对象，几块的对象，为什么几块对象，因为我们看到什么呀，我们看到我这块，我照的这个方法，比方说这个n to，我是不是在掉一块比上的方法，这个好了天节点四个方法。

看哪四个一。叫a panda，这个时候的话呢，我个人认为哈，我们直接拿这个例子说是最好说的。温度怎么加呢？我把新创建这个节点加到指定节点的最后，就是说我把新创建这个节点加为这个节点的最后一个子节点，有两种方式，一个是喷涂，一个是嗯。看to和看更好看的话呢，就是主语跟宾语互换位置。主语和宾语啊，位置不同，那同样有一个什么呀，同样我们说，哎，有一个叫。

没看懂。嗯，就分吧。举两个，这个是一样的，主语跟宾语同，那这有啥区别，这个是不是放后边啊，这个是放前边，此外的都一样，于是这两个我们也复制一下。哎，直接看例子是最实在的行了，这样的话呢，我们关于创建节点，以及把新创建的节点加为指定节点的子节点就搞定了。我们再来看刚入点的四个方法，刚才呢，这四个方法是APP，它什么样？它是把节点插入到指定节点的子节点，再说一遍啊，他说是把新创建的节点插入为指定节点的子节点。那同样我们跟。

GS down相对应过还有一个，把创建的节点插入为指定节点，前面那个节点或者是后边那个节点测试一下。我看一下。这次使用query。25节点啊，前面这四个的话，我们就不测了啊，我们就测后边这四个，我还是把这个节点创建好。

这里边儿的话呢，还是这四个方法，这就不错了，大家看一个是。呃，创建一个节点，然后把这个节点加给谁啊，我们说加这个吧，加为北京这个节点。加入到北京节点的后面，后面应该是新创建的，我插入到后边叫。点色卡到北京保存看一下，到三。是不是在后边杠三后边好了啊，跟它主语跟宾语互换的一个方法，这么写，还是把这个节点放到北京节点的后边直接写个。

大美股看效果。一样的，只不过这个时候什么呢？加了一个中括号，就这么加好了，那除了后面以外的话呢，还有前边，前面这个应该是创建一个节点上规谷，这写法应该是颜色。In应该写的是北京，把这个加到北京点的前边，看北京上硅谷没问题，再看还有一个方法，我是把北京作为主语，那就是北京的前边。

Before。写个什么呀，写个双规骨，注意这个时候怎么了，这个时候这个将放在北京节点的前边，看这样写这就完了，但是这个里边什么样，有一个主括号，OK，这就是我们插入节点的又四个方法，分别是in色的after after颜色before before实际上是不是俩呀，两对，那现在的话呢，这个隐色的@跟@我如何去区分，哪个是主语放前面，哪个是宾语放前面，你想引色的after插入到什么什么的后边，In这个in色after这个后边，这是不是一个英语的一句话呀。这个插入在这个的后边，所以说这个时候这个是那个什么呀，这个是啊，新创建的那个，而它呢，这个的后边是什么，所以说你只要有基本的英语的话呢，我从语义上可以说得通，那这个的道理是一样的，至于说before跟after before在前面，After在后边。