document.createDocumentFragment实际上是为了减少Dom次数， 提高页面效率和性能；因为每当javascript对Dom操作一次， 页面将刷新一次并更新内容；而利用document.createDocumentFragment创建一个文档碎片， 将所有Dom操作追加到该文档碎片， 最后一次性将该文档碎片添加到document中。相比前者，后者只需要对Dom操作一次， 页面也就只被刷新一次， 由于页面刷新次数大大减少， 从而提高页面显示的效率。
<html>
<head>
<title>document.createDocumentFragment()测试页面</title>
</head>
<body>
<script type="text/javascript">
var d1 = new Date();
for (var i = 0; i < 1000; i++) {
var op = document.createElement("P");
var oText = document.createTextNode("test1");
op.appendChild(oText);
document.body.appendChild(op);
}
var d2 = new Date();
document.write("方法一用时：" + (d2.getTime() - d1.getTime()) + "<br/>");
alert(d2.getTime() - d1.getTime());
//---+-----
var d3 = new Date();
var oFrag = document.createDocumentFragment();
for (var i = 0; i < 1000; i++) {
var op = document.createElement("P");
var oText = document.createTextNode("test2");
op.appendChild(oText);
oFrag.appendChild(op);
}
document.body.appendChild(oFrag);
//这段代码中
var d4 = new Date();
document.write("方法二用时：" + (d4.getTime() - d3.getTime()) + "<br/>");
alert(d4.getTime() - d3.getTime());
</script>
</body>
</html>
PS. 比较方法一和方法二程序执行所需要的时间， 应该是方法一大于方法二。