<html>
<head>
<meta http-equiv="Content-Type" content="text/html charset=UTF-8">
<title>RunJS 演示代码</title>
<script>
onload = function(){
var lis = ul.getElementsByTagName("li")
for(var i = 0 i < lis.length i++){
lis[i].onclick = function(){
window.dom ? window.dom.style.color = "black" : 0
this.style.color = "red"
window.dom = this
}
}
}
</script>
</head>
<body>
<ul id="ul">
<li>HTML属性</li>
<li>HTML事件</li>
<li>HTML音频</li>
<li>HTML画布</li>
</ul>
</body>
</html>
看看这个如何,是否符合阁下要求?
<!DOCTYPE html><html>
<head>
<meta http-equiv="Content-Type" content="text/html charset=gb2312">
<title></title>
<style type="text/css">
.menus{
float:left
color:#0C0
font-size:18px
border:2px #0C0 solid
width:120px
height:40px
text-align:center
padding-top:20px
margin-right:-2px
}
.add{
float:left
color:#999
background-color:#F8F8F8
font-size:32px
border:1px #CCC solid
border-left:2px #0C0 solid
width:120px
height:50px
text-align:center
padding-top:12px
cursor:pointer
}
</style>
<script type="text/javascript">
window.onload=function(){
var add1=document.getElementById("add")
add1.onclick=function(){
addElement()
}
}
var i=1
function addElement(){
var box=document.getElementById("box")
var oDiv=document.createElement("div")
oDiv.setAttribute("class","menus")
oDiv.appendChild(document.createTextNode(prompt("在此输入菜单名称")))
box.appendChild(oDiv)
i++
box.insertBefore(oDiv,box.childNodes[i])
}
</script>
</head>
<body>
<div id="box">
<div class="menus">菜单名称</div>
<div class="add" id="add"><b>+</b></div>
</div>
</body>
</html>