一、
document.body.innerHTML+=”<li></li>”
我们可以
用
document.body.innerHTML+=”<li></li>”
方法
向body内添加li元素，但循环添加太耗性能，可以先循环将要添加的字符串预先连接后保存到str里，再一次性添加给body：document.body.innerHTML=str，这样可以避免添加数量过多时造成的页面刷新迟缓卡顿问题
。
DOM中文档结构如下：
<ul></ul>
CSS中的样式如下：
*{
margin:0;
padding:0;
}
ul{
margin:100px;;
}
ul li{
list-style:none;
width:100px;
height:45px;
border:1px #000 solid;
background:#0FF;
}
JS中的样式如下：
var oUl = document.getElementsByTagName("ul")[0];
var str = "";
for(var i=0;i<5;i++){
str+="<li></li>"
}
oUl.innerHTML = str;
效果图如下：
二、（DOM元素操作）
向父元素中动态创建元素
用innerHTML的累加的方式创建元素，但是添加若次数过多会使性能降低；
-
创建一个li元素：
var oLi = document.createElement(“li”);
-
该元素被创建出来时并不属于页面，可以先给该元素添加内容，事件等：
oLi.innerHTML = obj.value;
-
把他放在其父元素中:（
在父级最后节点后添加该元素
）
oUl.appendChild(oLi);
DOM中文档结构如下：
<ul></ul>
CSS中的样式如下：
*{
margin:0;
padding:0;
}
ul{
margin:100px;;
}
ul li{
list-style:none;
width:100px;
height:45px;
border:1px #000 solid;
background:#0FF;
}
JS中的样式如下：
for(var i=0;i<5;i++){
var oLi = document.createElement("li");
oLi.innerHTML = i;
oUl.appendChild(oLi);
}
效果图如下：
