题解 | #虚拟DOM#
虚拟DOM
https://www.nowcoder.com/practice/a283d2c284ed49468c3b0f6ec0312b0f
说废话没用呢
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
</head>
<body>
<script>
var vnode = {
tag: 'ul',
props: {
class: 'list'
},
text: '',
children: [
{
tag: "li",
props: {
class: "item"
},
text: '',
children: [
{
tag: undefined,
props: {},
text: '牛客网',
children: []
}
]
},
{
tag: "li",
props: {},
text: '',
children: [
{
tag: undefined,
props: {},
text: 'nowcoder',
children: []
}
]
}
]
}
const _createElm = vnode => {
// 补全代码
let element = undefined
if (vnode.tag) {
element = document.createElement(vnode.tag)
const props = Object.keys(vnode.props)
props.forEach(prop => {
element.setAttribute(prop, vnode.props[prop])
})
if (vnode.children.length > 0) {
vnode.children.forEach(subVnode => {
const subElem = _createElm(subVnode)
if (typeof subElem === 'string') {
element.innerText = subElem
} else {
element.appendChild(subElem)
}
})
}
} else {
element = vnode.text
}
return element
}
</script>
</body>
</html>
#23届找工作求助阵地#
投递牛客等公司7个岗位 >