我有以下代码需要确保对性能敏感:
var $content = $(htmlString);
//Stop new element from triggering reflow?
$content.css('display', 'none');
//add slide to DOM
$content.appendTo(options.els.$slider);
我不记得是否在任何 DOM 操作时触发了回流，或者是否存在向 DOM 添加流外元素等异常。如果 options.els.$slider 在流中，上面的代码会导致回流吗？
最佳答案
hide method (或更新问题显示的 css method)将 display 属性设置为 none:
display: none;
这将导致该元素从正常的文档流中移除。如果要求不从正常文档流中删除该元素，请改为更改 visibility CSS 属性:
$content.css('visibility', 'hidden');
然而，在将其添加到 DOM 之前设置 display 属性不应导致重排。
请注意，将元素添加到 DOM 后更改可见性将导致 repaint ， 然而。可以使用多种不同的工具分析绘制事件，包括 Chrome Developer Tools on the timeline tab .
关于javascript - 添加流外元素会导致回流吗？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/32893397/