如何去渲染数据?

1渲染数据

1字符串拼接,最常用的方法。

优点:只进行了一次dom回流

缺点:原有dom的事件都会丢失

原因:就是与innerhtml这个属性,这个属性是返回或设置dom中的内容。以字符串形式返回,拼接玩之后是string类型,而onmouse这些属性是dom

元素对象身上的,所以这些onmouse系列的属性就丢失了。

  1. dom循环
  2. 优点:原有的dom身上的事件不会丢失,不影响其他dom

    缺点:dom回流次数过多,严重影响网页性能。

    1. 模板

    模板的本质就是字符串

     

    1. 文档碎片

    优点: 既不影响原有dom的属性,也只回流一次。

  3. Dom回流

    每当对dom元素进行增删改的时候,浏览器就会重新加载一个,把新的结果渲染出来。

     

    无论上面的四种方法,新增的li没有onmouseover事件,如果保证新增的li也拥有添加的事件。用dom遍历添加事件是不行的,用事件委托。

 

原文地址:https://www.cnblogs.com/yangjingyang/p/10530084.html