一聚教程网:一个值得你收藏的教程网站

热门教程

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);

热门栏目