Question

JS 给一个li添加样式，同时去掉其他li的样式

每个li上都要加方法太麻烦了。
windows.onload（） R然后在加循环 写事件那种

Answer 1

<script type="text/javascript" defer="defer">
function changeStyle(ele){
var liAry=document.getElementById("box").getElementsByTagName("li");
var liLen=liAry.length;
var liID=ele.id;
for(var i=0;i<liLen;i++)
{
if(liAry[i].id==liID)
{
liAry[i].style.backgroundColor="#cccccc";
}
else
{
liAry[i].style.backgroundColor="white";
}
}
}
</script>
<div id="box">
<li id='1' style="background-color:#cccccc;" onclick="changeStyle(this)">AAA</li>
<li id='2' onclick="changeStyle(this)">BBB</li>
<li id='3' onclick="changeStyle(this)">CCC</li>
</div>

Answer 2

<style>
.a1{color:red;}
.a2{color:green;}
</style>

<div id="box">
<li id='1' class="a1" >AAA</li>
<li id='2' class="a1">BBB</li>
<li id='3' class="a1">CCC</li>
</div>
<script type="text/javascript" defer="defer">
var liAry=document.getElementById("box").getElementsByTagName("li");
function changeStyle(){
for(var i=0,liLen=liAry.length;i<liLen;i++)
{
if(liAry[i].id==this.id)
{
liAry[i].className="a2"
}else{ liAry[i].className="" }
}
}
for(var i=0,liLen=liAry.length;i<liLen;i++)
{
liAry[i].onclick=changeStyle;
}
</script>