当有大量 DOM 加载了带有 :hover 伪类样式的 javascript 元素(如长表)时,效果在 Chrome 和 Safari 中呈现缓慢/滞后。与 webkit 相比,Firefox 使用 :hover 处理大量行的速度似乎相当快。
例如,您可以通过使用 :hover 效果生成 10,000 行来查看差异。 http://jsfiddle.net/jschin/VwmjT/
var table = document.createElement('table');
for (var i=0; i<10000; i++) {
var r = document.createElement('tr');
for (var j=0; j<3; j++) {
var c = document.createElement('td');
c.appendChild(document.createTextNode(i*j));
r.appendChild(c);
}
table.appendChild(r);
}
document.getElementById('b').appendChild(table);
我知道 10,000 行是个坏主意。我知道你应该分页。我只是好奇这是为什么。