虚拟DOM及其更新原理(diff算法)
虚拟DOM:通过js的普通对象来模拟DOM树,比如:
//实现 <h1 class="b">我是内容</h1>
//则使用js对象模拟的形式是
{
name:"p",
props:{
class:"b"
},
children:[
"我是内容"
]
}
更新原理(diff):只更新发生改变的数据和DOM。
代码演示如下:
<body>
<button class="btn">按钮</button>
<ul>
<li>9</li>
<li>8</li>
<li>7</li>
<li>1</li>
<li>2</li>
</ul>
</body>
import $ from "jquery";
$(".btn").click(function () {
var arr = $("li");
var newa