浏览器如何从内部HTML属性更新DOM

How browsers update DOM from innerHTML property?

本文关键字：属性 更新 DOM HTML 内部 浏览器      更新时间：2023-09-26

我试图弄清楚当javascript更改Node.innerHTML属性时，浏览器如何执行DOM更新工作。

给定代码：

> var obj=document.createElement("DIV");
> obj.innerHTML='<P><SPAN>A</SPAN></P><DIV>B</DIV>';
> obj.childNodes
[<p>​<span>​A​</span>​</p>​, <div>​B​</div>​]

这对我来说似乎很神奇，因为我认为 innerHTML 是一个属性，而不是一个函数，所以......

如何通知javascript字段中的更改以调用函数来更新DOM树？

当在javascript中更改变量时，是否有任何类型的侦听器来调用函数，或者在每个javascript行上仅执行一些守护程序监视器Node.innerHTML变量？

如果你想知道为什么它很重要，我正在写一个 DOMParser，这对我来说是一个问题。

使用给定的参考资料，我了解到浏览器引擎可以提供Object.watch（gecko）或Object.observe（chrome）之类的方式。

但是有一种方法可以在nodejs中做到这一点？

因为我认为 innerHTML 是一个属性，而不是一个函数

Javascript 支持二传手。 https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Functions/set

在这成为语言标准本机对象（如 DOM 节点）的一部分之前，已经在内部使用了 setter 功能。

相关文章：