Sixteen_mm
2016-04-02 14:22
我的: window.onload = function(){
changecolor();
}
// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
function changecolor(){
var cc=document.getElementsByTagName("tr");
for(var i=0;i<cc.length;i++)
{
cc[i].onmouseover=function(){
cc[i].style.backgroundColor="#f2f2f2";
}
cc[i].onmouseout=function(){
cc[i].style.backgroundColor="#fff";
}
}
}
把cc[i]改成this就可以了,这是为什么呢?
别人的: window.onload = function(){
var tr=document.getElementsByTagName("tr");
for(var i= 0;i<tr.length;i++)
{
bgcChange(tr[i]);
}
// 鼠标移动改变背景,可以通过给每行绑定鼠标移上事件和鼠标移除事件来改变所在行背景色。
}
function bgcChange(obj)
{
obj.onmouseover=function(){
obj.style.backgroundColor="#f2f2f2";
}
obj.onmouseout=function(){
obj.style.backgroundColor="#fff";
}
}
不懂这些区别在哪里?
this代表当前作用域,,而tr[i],当鼠标放到某一行 应该没有办法自动识别出i=?
我们可以看看整个函数执行的过程。
首先i=0,同时为 tr[0]绑定事件onmouse,接着i=1,i=2,当i=3的时候,由于i<tr.length(tr.length=3);所以跳出了循环。
这时候i=3,并且保存到了内存当中。
于此同时,tr[i].onmouseover/tr[i].onmouseout这两个事件是没有执行的,而for循环已经结束了。
i在内存保存=3;当鼠标经过触发事件的时候,执行函数cc[i].style.backgroundColor="#f2f2f2";/ cc[i].style.backgroundColor="#fff";,由于cc[3]这个节点是不存在的,所以控制台报错 can not ......。
都表示上下文环境
JavaScript进阶篇
468060 学习 · 21891 问题
相似问题
回答 2
回答 2