patch方法: (vue中)
//patch方法
Function createElement(vnode){
let tag = vnode.tag. // 目标元素
let attires = vnode.attrs || {} // 属性
let children = vnode.children || [] // 子节点
if(!tag){
return null
}
// 1. 创建对应在的dom
let elem = document.createElement(tag)
let attrName
// 2. 给dom 添加属性
for(attrName in attires){
if(attires.hasOwnProperty(attrName)){
elem.setAttribute()
}
};
//3. 将子元素添加到目标元素之上
children.forEach(function(childVnode){
elem.appendChild(createElement(childVnode))
})
return elem
}
Function updateChildren(vnode,newVnode){
let children = vnode.children || [] // 现有节点
let newChildren = newVnode.children || [] // 新节点
children.forEach(function(childrenVnode,index){
// 循环的每一项
let newChildrenVnode = newChildren[index]
// 第一层没有变化
if(chidrenVnode.tag === newChildrenVnode.tag){
// 深层次对比-递归
updateChildren(childrenVnode, newChildrenVnode)
} else {
// 两者tag 不一样
replaceNode(childrenVnode, newChildrenVnode)
}
})
}