dom事件轻松搞定二级菜单

需求：

在页面显示的二级菜单，点击某个菜单时：
1、变换自身样式，同时清除其他菜单样式
2、点击某菜单，其对应二级菜单显示，其他二级菜单不显示

思路：

1、获取元素
2、循环每个要点击的元素，即每个菜单
1）留一个标记，否则每次循环，下标都是循环完的i
2）给每个元素添加点击事件：排他思想
<1>先清除所有人的样式
<2>给当前点击元素赋予样式

    //获取元素
var left_li = document.querySelectorAll('.left_ul li');
var right_li = document.querySelectorAll('.right_ul li');
    //循环每个要点击的元素
for(var i = 0; i < left_li.length; i++){
    //留一个标记,否则下标永远是循环完的i
    left_li[i].ind = i;
    //给每个元素添加点击事件
    left_li[i].onclick = function(){
    //排他思想  清除所有人的样式
    for(var j = 0; j < left_li.length; j++){
        left_li[j].className = '';
        right_li[j].className = '';
    }
    //给当前点击元素赋予样式 
    left_li[this.ind].className = 'sj';
    right_li[this.ind].className = 'wsz';
}

}