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

热门教程

dom复制cloneNode节点与插入节点appendChild()

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

2, 复制节点。
cloneNode(boolean) :
它有一个参数。
var mes = document.createTextNode("hello world");
var container = document.createElement("p");
container.appendChild(mes);
document.body.appendChild(container);
var newpara = container.cloneNode(true);//true和false的区别
document.body.appendChild(newpara );
注意:
true的话:是

aaaa

 克隆。
false: 只克隆 

 ,里面的文本不克隆。
可以自己写个例子,然后用 firebug 看看。
克隆后的新节点,和createTextNode()一样  不会被自动插入到文档 。需要appendChild();
另外还有一个注意: 如果克隆后,id一样,不要忘记用 setAttribute(id ,  another_id );
改变新的节点的ID。
3, 插入节点。
appendChild() :
给元素追加一个子节点, 新的节点 插入到 最后。
var container = document.createElement("p");
var t =  document.createTextNode("cssrain");
container.appendChild(t);
document.body.appendChild(container);
他经常跟createElement()和createTextNode(),cloneNode()配合使用。
另外 appendChild()不仅可以用来追加新的元素,也可以你 挪动 文档中现有的元素。
看下面的例子:
msg

content

aaaaaaaa

//发现msg放到 content 后面去了 。
Js内部处理方式:
先把ID为msg的从文档中删除,然后再插入到content 后,作为content的最后一个节点。
结果为:
content
msg

aaaaaaaa

热门栏目