JavaScript的自定义属性（事件内获得事件外的变量值）

写轮播图点击下方圆点banBtnLi[i],切换到第i个图片
banBtnLi是按钮集合，假设banBtnLi.length是4
banImhLi是装图片的li，自然banImgLi.length也是4
点击banBtnLi[i]先清空所有banBtnLi和banImgLi 的class，再给相应的banBtnLi和banImgLi加上class
因为在function中获取不到外层for中的i值，所以要定义一个banBtnLi的属性banBtnLi.index,把i的值赋给它，
在onmouseover方法中this就是指banBtnLi[i],用this.index就可以获取到外层i的值
方法如下

for(var i=0;i<banBtnLi.length;i++){

　　banBtnLi[i].index = i;

　　banBtnLi[i].onmouseover = function () {

　　　　for (var j=0;j<banImgLi.length;j++) {

　　　　　　banImgLi[j].className = "";

　　　　　　banBtnLi[j].className = "";

　　　　}

　　　　banImgLi[this.index].className = "banner-present";

　　　　banBtnLi[this.index].className = "banner-btn-present";

　　}

};

这里给出各个变量的输出值，更容易理解每个变量应该等以几

for(var i=0;i<banBtnLi.length;i++){

    banBtnLi[i].index = i;

    banBtnLi[i].onmouseover = function () {

        for (var j=0;j<banImgLi.length;j++) {

            banImgLi[j].className = "";

            banBtnLi[j].className = "";

        }

        console.log(banBtnLi[i]);//undefined

        // console.log(banBtnLi[i].index);//报错

        console.log(i);//

        console.log(j);//

        console.log(this.index);//指几是几:0或1或2

        banImgLi[this.index].className = "banner-present";

        banBtnLi[this.index].className = "banner-btn-present";

    }

};