DOM的回流和重绘

DOM的回流和重绘

回流:

  • 1当页面中的元素的位置,大小或者结构、定位发生改变,会引发浏览器对当前页面结构进行重新计算,非常消耗 性能。(一次回流会触发很多DOM操作,浏览器会重新计算元素的尺寸和位置,并且还会触发该元素的子元素,原 先的元素和发生改变的元素进一步重排,然后调用最后的重绘),既然回流这么不好,那我还要告诉你一个坏消息, 回 流很容易触发,啧啧啧!!!

    回流发生在一下情况:

    1.修改页面上的内容,例如输入文本框的文本,移动DOM元素
    2.为DOM元素设置动画、事件
    3.进行元素的测量,例如offsetHeight或getComputedStyle
    4.更改css样式,添加或者删除样式表,更改元素的className
    5.调整窗口大小、滚动

重绘

当元素的背景、透明度、颜色发生变化,那么浏览器会对元素进行重新描绘;这个过程就是浏览器的重绘;

猜你喜欢

转载自blog.csdn.net/weixin_44063225/article/details/109873831