DOM创建节点createElement():

时间：2022-07-02 13:48:20 编辑：袖梨来源：一聚教程网

作为一个js-DOM开发者，你必须知道的一些DOM方法：

1，创建节点。

createElement():

var a = document.createElement(“p”);

它创建的是一个元素节点，所以 nodeType 等于 1 。

a.nodeName 将返回 p ;

注意；createElement()方法创建出来的新元素节点不会被自动添加到文档里，既然没添加到文档里，说明它还是一个游离的状态。所以它也没有nodeParent属性。

如果想把它添加到文档里，可以使用 appendChild()或者insertBefore()方法或者replaceChild()方法。当然我们在前面的例子中，自己写了一个insertAfter()方法;

比如：

var a = document.createElement(“p”);

document.body.appendChild(a);

注意： appendChild()默认是添加到文档的最后。也就是lastChild子节点。

如果想添加到某个地方，可以使用insertBefore()。

如果想在元素插入之前给元素添加属性。可以这么做：

var a = document.createElement(“p”);

a.setAttribute(“title”,”my demo”);

document.body.appendChild(a);

createTextNode():

var b = document.createTextNode(“my demo”);

它创建的是一个文本节点，所以nodeType等于 3 。

b.nodeName 将返回 #text ;

跟createElement()一样，用createTextNode()创建的节点也不会自动添加到文档里。需要使用appendChild()或者insertBefore()方法或者replaceChild()方法。

他经常与createElement()配合使用，知道为什么吗？（一个元素节点，一个文本节点。）

var mes = document.createTextNode(“hello world”);

var container = document.createElement(“p”);

container.appendChild(mes);

document.body.appendChild(container);