Javascript-火狐 : Table Rows are impossible to highlight

Question

document.onmouseover= function(event) {
    if (event===undefined) event= window.event;                     
    var target= 'target' in event? event.target : event.srcElement; 
    if(target.tagName == 'TR') {            
            target.style.backgroundColor = 'red';
        }else{
            target.style.backgroundColor = "yellow";
        }
};
document.onmouseout= function(event) {
    if (event===undefined) event= window.event;                     
    var target= 'target' in event? event.target : event.srcElement; 
    target.style.backgroundColor = "transparent";
};

TR 元素从不突出显示，也不会为此触发 onmouseover 事件。 TD 元素工作正常。如何解释此行为以及如何在它触及 TR 元素时触发 onmouseover？

Answer 1

如何将您的代码更改为:

var rows = document.getElementsByTagName('TR');
for (var i = 0, l = rows.length; i < l; i++) {
  rows[i].onmouseover = function (event) {
    this.style.backgroundColor = 'red';
  }

  rows[i].onmouseout = function (event) {
    this.style.backgroundColor = "transparent";
  }
}

演示:http://jsfiddle.net/Asv4v/3/