回流与重绘

1.基本概念

  回流:DOM结构的增删改

  重绘:颜色背景字体等视觉上页面的改变

2.特点

  回流一定会触发重绘

  重绘不一定触发回流

3.避免回流

  更改样式时尽量更改class样式名,而不是直接更改CSS样式属性

  避免使用table布局

  尽可能少使用行内样式

  尽量在DOM树末端改变样式,改变子节点

  在实现动画时,使用position的absolute和fixed

4.如何分辨重绘

  改变字体

  增删样式表

  内容变化,例如输入框内输入了文字

  激活CSS伪类,如“:hover”

  脚本操作DOM(回流->重绘都会发生)

  计算offsetWidth和offsetHeight属性

  设置style属性的值回流

————学习记录

posted @ 2020-07-15 22:09  桃李子  阅读(83)  评论(0编辑  收藏  举报