diff
2023-06-24 20:26:00 3 举报
diff算法简易流程图
作者其他创作
大纲/内容
oldVNode是虚拟节点
根据真实dom节点创建虚拟节点,将id和class属性和标签选择器拼到虚拟节点的sel上
N
oldVnode是否有children属性
将dom的text清空,将newVnode的children插入到dom
新旧节点是否为同一节点
newVnode是否有text属性
最复杂的处理情况
开始
Y
将dom的innerHTML替换为newVnode的text值
不做处理
N,有children属性
newVnode的text与oldVnode的text是否相同
在旧节点的下一个兄弟节点之前插入新节点(根据newVnode创建的真实节点),然后删除旧节点
oldVnode和newVnode是否为同一对象
N,有text属性
接收oldVNode和newVNode参数
精细化比较
0 条评论
下一页