您现在的位置:首页 >> 前端 >> 内容

DOM元素中映射、重绘和回流的使用讲解

时间:2017/11/13 10:03:45 点击:

  核心提示:在DOM中存在映射机制、重绘和回流。映射机制所谓的映射原理就是,浏览器渲染页面的时候,每一个元素都设置了很多的内置属性(包含样式),当我们在JS中,把堆内存中的某一个。当内置属性的值修改了,大部分情况...

在DOM中存在映射机制、重绘和回流。

映射机制

所谓的映射原理就是,浏览器渲染页面的时候,每一个元素都设置了很多的内置属性(包含样式),当我们在JS中,把堆内存中的某一个。

当内置属性的值修改了,大部分情况下,浏览器都会监听到你的修改,然后按照最新修改的值,重新渲染页面中的元素。

但是我们应该注意的是:DOM的重新渲染比较消耗性能,我们最好尽量减少DOM的操作。

DOM的重绘

当一个元素的样式(特点:只有那些不修改元素位置的样式)发生改变,浏览器会把当前元素,重新的进行渲染,对于DOM的重绘,性能消耗比较低。

DOM的回流

当一个元素的位置发生改变,浏览器会重新把整个页面的DOM的结构进行计算,计算出所有的元素的最新位置,然后再进行重新的渲染,DOM的消耗非常大,我们在真实项目中是,应该减少DOM结构的改变。

1、新增或者删除一些元素。

2、把现有元素的位置改变。

Tags:DO OM M元 元素 
作者:网络 来源:CherryLee_