创建动态列表

<input type="button" value="点击" id="btn"/>
<div id="dv"></div>
<script src="commer.js"></script>
<script>
var kungfu=["降龙十八掌","黯然销魂掌","九阴真经","如来神掌","吸星大法","玉女心经"];
//点击按钮动态的创建列表,列表加到div中
ver("btn").onclick=function () {
//创建ul,把ul立即加入到父级元素div中
var ulObj=document.createElement("ul");
ver("dv").appendChild(ulObj);
//动态的创建li,加到ul中
for(var i=0;i<kungfu.length;i++){
var list=document.createElement("li");
//设置li中间的文字内容
list.innerHTML=kungfu[i];
ulObj.appendChild(list);
//为li添加鼠标点击进入事件
list.onmouseover=mouseoverHandle;
//为li添加鼠标点击离开事件
list.onmouseout=mouseoutHandle;
}
};
//此位置.按钮的点击事件的外面
function mouseoverHandle() {
this.style.backgroundColor = "red";
}
function mouseoutHandle() {
this.style.backgroundColor = "";
}

//如果是循环的方式添加事件,推荐用命名函数
//如果不是循环的方式添加事件,推荐使用匿名函数
原文地址:https://www.cnblogs.com/lujieting/p/10046562.html