使用自定义属性思想，解决参数不正确问题

使用自定义属性思想，解决参数不正确问题

需求：点击哪个LI，就让其有SELECT样式类(对应的DIV也有这个样式类)，其余的LI(DIV)都把SELECT样式类移除即可
根据上面，可以修改需求为，不管点击哪个LI，我们先让其所有的LI(DIV)都移除SELECT，再让当前点击的有SELECT样式

    

        
新闻
        
电影
        
音乐
    
    
热烈庆祝中国召开十九大
    
羞羞的铁拳
    
不是诗

//首先取到取到DOM对象
var tabBox=document.getElementById('tabBox');
var oList=tabBox.getElementsByTagName('li');
var oDivList=tabBox.getElementsByTagName('div');
//创建一个函数实现页卡切换功能
funciton change(index) {
    //设置形参，因为实现方法的时候，我们不清楚用户点击的是哪一个LI，当用户点击的时候，执行这个change方法，并且把这个LI的索引传递给我们，我们就可以在oList集合中通过索引获取到当前点击的这个LI对象
    //利用循环，先移除所有的LI(DIV)移除SELECT
    for(var i=0;i

理性分析一下:
第一轮：
oList[0].onclick=function(){
console.log(i);
}
//给元素点击事件绑定方法，点击才会执行，此处绑定属于创建函数，空间中存储的都是字符串，i不是变量是字符
第二轮：
oList[1].onclick=function(){
console.log(i);
}
第三轮：
oList[2].onclick=function(){
console.log(i);
}
三次循环结束，因为进行了步长累加所以i=3;可是通过循环，我们只是给点击事件绑定了一个方法(存在内存中的字符串)，并没有执行。

假设用户点击第二个LI：开始执行第二个绑定的方法(方法执行：形成一个新的作用域，把之前存储的字符串变为代码执行console.log(i);但是此时i已经变为3了，所以无论点击哪一个都为3的原因就在于此，从函数原理核心来看，就说得通了)

for(var i=0;i

再来分析一下:
i=0：oList[0].myIndex=0;
i=1：oList[1].myIndex=1;
i=2：oList[2].myIndex=2;
总结：
在使用参数的时候需要考虑参数的的正确存在方式。