JS基础(一)dom小实例

DOM的新增示例

<script language="JavaScript">
            window.onload = function(){

                //createDocumentFragment()方法，它的作用是创建一个文档碎片，
                //把要插入的新节点先附加在它上面，然后再一次性添加到document中
                var body = document.body;
                var len = 100;
                var i = 0;
                var flagment = document.createDocumentFragment();//使用fragment来提高性能
                var ul = document.createElement('ul');
                var li;
                var textNode;

                console.log('flagment',flagment);
                body.appendChild(ul);
                for(; i < len; i++){
                    li = document.createElement('li');
                    textNode = document.createTextNode(i + 1);
                    li.appendChild(textNode);

                    flagment.appendChild(li);
                }
                console.log('flagment',flagment);
                ul.appendChild(flagment);
            }
        </script>