至少会有一次渲染,是在页面加载的时候,是按照下面的步骤来的:1.解析html,生成dom树2.根据css文件计算出样式数据3.结合dom树和css文件,生成渲染树4.浏览器根据渲染树,将页面绘制到屏幕上 页面绘制到屏幕上之后,根据js脚本,还可能有重绘和重排的操作,重绘是指没有对任何dom节点的形状(大小)进行改变,只改变了背景颜色等样式;重排是指改变了dom节点的形状,需要重新计算生成整个渲染树,重排的开销比重绘大的多。 什么时候进行重绘或重排:1.当一段同步的js代码执行完,执行栈为空的时候,开始执行事件队列中的代码,在执行事件队列中的每一个代码块之前,都会进行一次重绘或重排。2.如果在js代码中用到了offsetxxx,因为需要立即获取最新的位置数据,浏览器会马上计算生成渲染树,这时会进行一次重绘或重排吗,还是只计算渲染树?(经过测试,使用到offsetxxx的时候,并不会重新将页面渲染到屏幕上,但是能获得正确的值,所以只是重新计算了渲染树)
至少会有一次渲染,是在页面加载的时候,是按照下面的步骤来的:
1.解析html,生成dom树
2.根据css文件计算出样式数据
3.结合dom树和css文件,生成渲染树
4.浏览器根据渲染树,将页面绘制到屏幕上
页面绘制到屏幕上之后,根据js脚本,还可能有重绘和重排的操作,重绘是指没有对任何dom节点的形状(大小)进行改变,只改变了背景颜色等样式;重排是指改变了dom节点的形状,需要重新计算生成整个渲染树,重排的开销比重绘大的多。
什么时候进行重绘或重排:
1.当一段同步的js代码执行完,执行栈为空的时候,开始执行事件队列中的代码,在执行事件队列中的每一个代码块之前,都会进行一次重绘或重排。
2.如果在js代码中用到了offsetxxx,因为需要立即获取最新的位置数据,浏览器会马上计算生成渲染树,这时会进行一次重绘或重排吗,还是只计算渲染树?(经过测试,使用到offsetxxx的时候,并不会重新将页面渲染到屏幕上,但是能获得正确的值,所以只是重新计算了渲染树)