更改属性时延迟dom元素的呈现

同意 @Crimson

reflows 将发生,其中一个是在隐藏 瓦片

为了避免闪存,您可以将父级替换为其自身的克隆,然后在文档外部处理原始父级。然后,完成后,您可以将克隆替换为原始:

var parent = /* define parent here */;
var clone = parent.cloneNode(true);

parent.parentNode.replaceChild(clone, parent);

/* Do stuff with parent and its childNodes... */

clone.parentNode.replaceChild(parent, clone);

在FF 3&中,速度似乎慢得多;3.5比IE 7&这与我的预期背道而驰。

当前,FF会在特性更改时立即重新计算布局。IE会一直等待,直到它必须重新绘制页面,或者您访问需要了解新布局的offsetWidth等属性。这并不总是能正常工作。

CMS的方法很好。如果您的所有分幅都与示例中的大小相同,则有一种更快的方法(如果分幅没有公共父级,也可以使用这种方法)。只需给它们一个类,并使用CSS一次性切换它们:

body.tiles100 .tile { width: 100px; height: 100px; }

document.body.className= 'tiles100';

如果您事先不知道可能大小的预定义选择,则必须通过document.styleSheets列表动态编写样式表规则。不过,这有点痛苦,因为IE中的脚本接口与其他浏览器使用的DOM标准不太匹配。再一次。