前端高频面试题 - 对于重排和重绘的理解

1.重排

当dom元素发生变化并且涉及到元素的布局时，比如改变元素的宽度，元素的位置，这时浏览器就会重新计算属性并重新构建这个渲染树，这个过程就是重排。

2.重绘

当dom元素发生变化，重排完成之后，将重新构建的渲染树渲染描绘到页面上，这就是重绘。

ps：重排一定重绘，重绘不一定重排！

3.引起重绘(Repaint)的属性有哪些？

常见引起重绘的元素属性

color	border-style	visibility	background
text-decoration	background-image	background-position	background-repeat
outline-color	outline	outline-style	border-redius
outlinr-width	box-shadow	background-size

4.引起重排(回流reflow)的属性有哪些？

常见引起重排的元素属性

width	height	padding	margin
display	border-width	border	top
position	font-size	float	text-align
overflow-y	font-weight	overflow	left
font-family	line-height	vertical-align	right
clear	white-space	bottom	min-height
offsetTop	offsetLeft	offsetWidth	offsetHeight
scrollTop	scrollLeft	scrollWidth	scrollHeight
clientTop	clientLeft	clientWidth	clientHeight