回流与优化

reflow(回流)和repaint(优化):reflow是说假如某个子元素样式发生改变,直接影响到其父元素以及往上追溯很多的祖先元素包括它的兄弟元素。
reflow是说如果改变某个元素的背景色、文字颜色、边框颜色等不影响它周围内部布局的属性,将只会引起浏览器重绘。
导致reflow发生的情况有:1.改变窗口大小。2.改变文字大小。3.内容的改变。4.激活伪类。5.操作css类。6.脚本操作DOM.7.计算offsetWidth和offsetHeight。8.设置style属性。


如何减少回流:不要通过父级改变子元素样式,最好直接改变子元素样式。当然了,改变子元素样式的时候最好不要影响父元素和子元素的尺寸和大小。尽量通过class来设计元素样式,切记用style。

猜你喜欢

转载自blog.csdn.net/zhuxiaobeicheng/article/details/80856833