切换点击的图片（一组图片），2张进行切换

点击哪张图片，哪张图片切换。点击两次，图片还原。

html：

<ul>    <li></li>    <li></li>    <li></li></ul>

css：

li {    width: 112px;    height: 200px;    float: left;    margin-right: 20px;    background: url(img/1.jpg) no-repeat;}

js：

window.onload = function(){    var lis = document.getElementsByTagName('li');    for(var i=0;i<lis.length;i++){//循环遍历每一个li        lis[i].onOff = true;//给每个li添加一个开关，这样写的好处是不会相互影响        lis[i].onclick = function(){                        if(this.onOff){//如果点击的开关是真                this.style.background = 'url(img/2.jpg)';                this.onOff = false;//那么变成假            }else{//否则如果开关是假                this.style.background = 'url(img/1.jpg)';                this.onOff = true;//那么开关变成真            }                           }                   }}

注意：

1、设置开关,一个开关只能控制一组，我们现在有三组所以要设置三个开关，但三个开关不现实，所以我们要用自定义属性，给每一个li添加一个开关lis[i].onOff = true;
2、背景不能做判断， 相对路径不能做判断。所以我们要用开关。