document.createDocumentFragment(文档碎片)

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. 比较方法一和方法二程序执行所需要的时间，应该是方法一大于方法二。