在改變背景色中,關于this的一點問題
?window.onload = function(){
? ? ? ? ? ? ? ? ??
? ? ?// 鼠標移動改變背景,可以通過給每行綁定鼠標移上事件和鼠標移除事件來改變所在行背景色。
? ? ? ? var tr=document.getElementsByTagName('tr');
? ? ? ? var len=tr.length;
? ? ? ? for(var i=0;i<len;i++) {
? ? ? ? ? ? tr[i].onmouseover=function(){this.style.backgroundColor="#999";}
? ? ? ? ? ? tr[i].onmouseout=function(){this.style.backgroundColor="#fff";}
? ? ? ? }?
}
為什么把上面代碼的this改成tr[i]就無效了呢?也就是:
for(var i=0;i<len;i++) {
? ? ? ? ? ? tr[i].onmouseover=function(){tr[i].style.backgroundColor="#999";}
? ? ? ? ? ? tr[i].onmouseout=function(){tr[i].style.backgroundColor="#fff";}
? ? ? ? }?
2016-03-08
mark一下,雖然還是不太懂
http://www.cnblogs.com/syf/archive/2012/10/04/2711828.html
2016-03-07
@王大濤
for(var i=0;i<tr.length;i++){
tr[i].index = i; //這里的index可以自己隨便換,也就是給標簽tr自定義的屬性. 比如:tr[i].a = i;
tr[i].onmouseover=function(){tr[tr.index].style.backgroundColor="#999"}
tr[i].onmouseout=function(){tr[tr.index].style.backgroundColor="#fff";}
}
你這段的實現(xiàn)效果是不正確的。運行的效果實際上tr[tr.index]==tr[2]
而我原來的tr[i]位于function中,實際效果是tr[i]==tr[3] //如果審查元素手動添加一行<tr>就能發(fā)現(xiàn)。
據(jù)我朋友的解釋,這是帶參數(shù)的function在for語句中的問題。只是我不太理解其中的道理。
2016-03-07
這個問題不是 this的問題,而是變量作用域的問題;
?tr[i].onmouseover=function(){tr[i].style.backgroundColor="#999";}這行代碼中黑體的ti[i]是無效的.
因為在function(){tr[i].style.backgroundColor="#999";}這個函數(shù)中i的值是不知道的.所以不能用tr[i].style.backgroundColor="#999";這樣來設置樣式.?
一般我們會直接用this代表當前tr.如果不用this,我們可以用給標簽添加屬性的方法比如:
for(var i=0;i<tr.length;i++){
tr[i].index = i; //這里的index可以自己隨便換,也就是給標簽tr自定義的屬性. 比如:tr[i].a = i;
tr[i].onmouseover = function(){ tr[tr.index].style.backgroundColor = "#999"}
tr[i].onmouseout=function()tr[tr.index].style.backgroundColor="#fff";}
}