标签:comm ase 内容 移除 append blog parent 参数 for
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>DocumentFragment类型</title>
</head>
<body>
<ul></ul>
</body>
<script>
let ul=document.getElementsByTagName(‘ul‘)[0],
docFrag=document.createDocumentFragment();
const brower=[
"ie",
"firefox",
"googgle"
];
console.log(brower);
brower.forEach(function (e) {
let li=document.createElement(‘li‘);
console.log(li);
li.textContent=e;
console.log(li);
docFrag.appendChild(li);
console.log(docFrag);
});
ul.appendChild(docFrag);
/*
nodeType 的值为 11;
nodeName 的值为"#document-fragment";
nodeValue 的值为 null;
parentNode 的值为 null;
子节点可以是 Element、ProcessingInstruction、Comment、Text、CDATASection 或EntityReference。
虽然不能把文档片段直接添加到文档中,但可以将它作为一个“仓库”来使用,即可以在里面保存将来可能会添加到文档中的节点。
要创建文档片段,可以使用 document.createDocumentFragment()方法,
文档片段继承了 Node 的所有方法,通常用于执行那些针对文档的 DOM 操作。如果将文档中的节
点添加到文档片段中,就会从文档树中移除该节点,也不会从浏览器中再看到该节点。添加到文档片段
中的新节点同样也不属于文档树。可以通过 appendChild()或 insertBefore()将文档片段中内容添
加到文档中。在将文档片段作为参数传递给这两个方法时,实际上只会将文档片段的所有子节点添加到
相应位置上;文档片段本身永远不会成为文档树的一部分
*/
</script>
</html>
标签:comm ase 内容 移除 append blog parent 参数 for
原文地址:http://www.cnblogs.com/gaoxuerong123/p/7803666.html