<div id="app">
<button id="btn">change</button>
</div>
<script>
let el = document.querySelector("-sharpapp");
let fragment = document.createDocumentFragment();
let vDiv = document.createElement("div");
vDiv.textContent = "init value";
fragment.appendChild(vDiv);
el.appendChild(fragment);
let btn = document.querySelector("-sharpbtn");
btn.onclick = function (e) {
vDiv.textContent = "change";
}
</script>
is the div operated in the click event in the above code a virtual dom or a real dom,? if it is a virtual dom, why change the value of the virtual dom and change the value of the real dom in the page?