首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >在DOM环境中什么时候会发生回流?

在DOM环境中什么时候会发生回流?
EN

Stack Overflow用户
提问于 2009-02-04 05:50:42
回答 3查看 27.6K关注 0票数 52

什么类型的活动会触发使用DOM的网页回流?

似乎有不同的观点。根据http://www.nczonline.net/blog/2009/02/03/speed-up-your-javascript-part-4/的说法,这种情况时有发生

添加或删除DOM节点时的

  • 。动态应用样式(如element.style.width="10px").
  • When )时的
  • 。检索必须计算的度量值,如访问offsetWidth、clientHeight或任何计算的CSS值(通过DOM兼容浏览器中的getComputedStyle()或IE中的currentStyle )。

然而,根据http://dev.opera.com/articles/view/efficient-javascript/?page=3的说法,只有在已经有回流操作排队时,进行测量才会触发回流。

还有没有人有更多的想法?

EN

回答 3

Stack Overflow用户

回答已采纳

发布于 2009-08-14 14:33:38

这两篇文章都是正确的。可以放心地假设,当您正在做一些合理地要求DOM中元素的尺寸的事情时,您将触发回流。

此外,据我所知,这两篇文章都说了同样的话。

第一篇文章说在以下情况下会发生回流:

当您检索必须计算的度量时,例如访问 offsetWidthclientHeight或任何计算的CSS值(通过符合DOM的浏览器中的getComputedStyle()或IE中的currentStyle ),而DOM更改正在排队等待进行。

第二篇文章说:

如前所述,浏览器可能会为您缓存多个更改,并且仅在这些更改都已完成时回流一次。但是,请注意,对元素进行测量的将强制它回流,因此测量将是正确的。这些变化可能会也可能不会明显地重新绘制,但回流本身仍然必须在幕后发生。

此效果是在使用offsetWidth,等属性或getComputedStyle.等方法进行测量时产生的即使不使用这些数字,只要在浏览器仍在缓存更改时使用这些数字中的任何一个,就足以触发隐藏的回流。如果重复进行这些测量,您应该考虑只进行一次测量,并存储结果,以便以后使用。

我认为这和他们之前说的意思是一样的。Opera将尽最大努力为您缓存值并避免回流,但您不应该依赖它这样做的能力。

对于所有的意图和目的,只要相信他们说的话,当他们说所有三种类型的交互都会导致回流时。

干杯。

票数 49
EN

Stack Overflow用户

发布于 2010-09-21 23:20:53

查看Understanding Internet Explorer Rendering Behaviour的“由属性读取访问触发的渲染”部分,其中IE中的以下代码将导致渲染活动。

代码语言:javascript
复制
function askforHeight () {
  $("#lower").height();  
}
票数 4
EN

Stack Overflow用户

发布于 2009-02-04 07:45:02

代码语言:javascript
复制
document.body.style.display = 'none';
document.body.style.display = 'block';

这通常会解决那些令人费解的布局错误。

票数 1
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/510213

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档