在for循环中this的问题

var oLi = document.getElementById("tab").getElementsByTagName("li");

var oUl = document.getElementById("content").getElementsByTagName("ul");

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

{

oLi[i].index = i;

oLi[i].onmouseover = function ()

{

for(var n = 0; n < oLi.length; n++) oLi[n].className="";

this.className = "current";

for(var n = 0; n < oUl.length; n++) oUl[n].style.display = "none";

oUl[this.index].style.display = "block"

}

}

完整代码如上，为什么要要给每个遍历到的li标签用index属性来附上编号，后面的oUl[this.index].style.display = "block" 中的this.index 换成i的话，就无法实现功能，我想问下是什么原理？