AI写作智能体 自主规划任务,支持联网查询和网页读取,多模态高效创作各类分析报告、商业计划、营销方案、教学内容等。 广告
**重绘**:当我们对 DOM 的修改导致了样式的变化、却并未影响其几何属性(比如修改了颜色或背景色)时,浏览器不需重新计算元素的几何属性、直接为该元素绘制新的样式,跳过了上图回流环节。 常见引起重绘属性和方法 * color * boder-style * visibility * text-decoration * background ,background-image, backgound-position, background-repeat, backgound-size * outline,outline-color, outline-width, outline-style * box-shadow **回流**:当我们对 DOM 的修改引发了 DOM 几何尺寸的变化(比如修改元素的宽、高或隐藏元素等)时,浏览器需要重新计算元素的几何属性(其他元素的几何属性和位置也会因此受到影响),然后再将计算的结果绘制出来,这个过程就是回流(也叫重排)。 任何会改变元素几何信息 (元素的位置和尺寸大小) 的操作,都会触发回流, * 添加或者删除可见的 DOM 元素; * 元素尺寸改变——边距、填充、边框、宽度和高度; * 内容变化,比如用户在 input 框中输入文字; * 浏览器窗口尺寸改变——resize 事件发生时; * 计算 offsetWidth 和 offsetHeight 属性; * 设置 style 属性的值。