javascript - What is difference between these two statements? -

this question has answer here:

• javascript closure inside loops – simple practical example 31 answers

     var tr = document.getelementsbytagname('tr');         tr[0].onmouseover = function(){           tr[0].style.backgroundcolor = '#ccc';          }         tr[1].onmouseover = function(){           tr[1].style.backgroundcolor = '#ccc';          }         tr[2].onmouseover = function(){           tr[2].style.backgroundcolor = '#ccc';          } 

the first right, when use for loop in following code snippet, "uncaught typeerror: cannot read property 'style' of undefined".

     var tr = document.getelementsbytagname('tr');         for(var i=0;i<tr.length;i++){           tr[i].onmouseover = function(){             tr[i].style.backgroundcolor = '#ccc';            }                     } 

you need update from

 tr[i].onmouseover = function(){     tr[i].style.backgroundcolor = '#ccc';   }    

to

 tr[i].onmouseover = function(event){     event.currenttarget.style.backgroundcolor = '#ccc';   }    

problem - time trying access tr[i] in event handler value of i updated 3 , hence error occured