javascript列表隔行变色，加点击事件颜色改变
请问大神，（1）的效果做出来了，如何实现（2）、（3）的效果？
<html>
<head>
<script>
window.onload=function()
{
var oLi=document.getElementsByTagName('li');
var arr=['red','yellow'];
var str='';
for(var i=0;i<oLi.length;i++)
{
oLi[i].style.background=arr[i%arr.length];
oLi[i].onmouseover=function()
{
str=this.style.background;
this.style.background='gray';
}
oLi[i].onclick=function(){
this.style.background='black';
}
oLi[i].onmouseout=function()
{
this.style.background=str;
}
}
}
</script>
</head>
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</body>
</html> 展开
<html>
<head>
<script>
window.onload=function()
{
var oLi=document.getElementsByTagName('li');
var arr=['red','yellow'];
var str='';
for(var i=0;i<oLi.length;i++)
{
oLi[i].style.backgroundColor=arr[i%arr.length];
oLi[i].onmouseover=function()
{
if(this.style.backgroundColor!='black')//判断当前色为黑色则不响应onmouseover
{
str=this.style.backgroundColor;
this.style.backgroundColor='gray';}
}
oLi[i].onclick=function(){
window.onload();//首先还原其他行改变过的颜色
this.style.backgroundColor='black';//设置本行为黑色
}
oLi[i].onmouseout=function()
{
if(this.style.backgroundColor!='black')//判断当前色为黑色则不响应onmouseout
this.style.backgroundColor=str;
}
}
}
</script>
</head>
<body>
<ul>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
<li></li>
</body>
</html>
感谢您的回答。
请问如果清空其他改变行的颜色，如果不用window.onload()方法，什么代码可以实现呢？
