documentFragment深入理解

documentFragment深入理解

documentFragment深入理解 抽疯的稻草绳关注

0.4482020.12.27 16:42:40字数 178阅读 3,225

documentFragment是一个保存多个element的容器对象(保存在内存)当更新其中的一个或者多个element时,页面不会更新。只有当documentFragment容器中保存的所有element更新后再将其插入到页面中才能更新页面。
documentFragment用来批量更新
列如将ul里面的li取出放到documentFragment,更新完毕后再将其插入到ul,一共有以下四步骤:

创建documentFragment对象fragment
取出ul中的所有子节点并保存到fragment
更新fragment中的所有节点(li的内容)
将fragment插入到ul

const ul = document.getElementById('test')

在fragment插入到ul之前页面不会更新,documentFragment用来批量更新元素
3人点赞Dom

Original: https://www.cnblogs.com/sexintercourse/p/16538720.html
Author: 漫思
Title: documentFragment深入理解

原创文章受到原创版权保护。转载请注明出处:https://www.johngo689.com/553430/

转载文章受原作者版权保护。转载请注明原作者出处!

(0)

大家都在看

亲爱的 Coder【最近整理,可免费获取】👉 最新必读书单  | 👏 面试题下载  | 🌎 免费的AI知识星球