React 如何只更新真实 DOM 树的单个部分?

How is React able to only update single part of the real DOM tree?

React 的 Virtual DOM 如何只渲染 DOM 的特定部分并保留树的其余部分?

不确定我是否正确,但是如果我在普通 HTML 文件中更改 Div 的内容,我必须刷新页面才能看到更改,对吗?这意味着我将不得不重新绘制整个东西,重新创建整个 DOM 树。我不能自己直接“仅”更新 Div 元素。我需要刷新页面并重新创建整个树。

我知道虚拟 DOM 是什么,它如何将新版本与旧版本进行比较,差异等等。我也阅读了对账文件,但这也没有回答我的问题。在 React 有了新的 Virtual DOM 之后会发生什么,它需要转换成 Real DOM?

我想问的是:本质上,React 只是普通的 HTML & JS,最终必须成为真正的 DOM。那么他们如何只更新 DOM 中的单个 Div 元素而不需要重新加载整个页面呢?因为如果我们在 HTML 中手动执行此操作,则需要刷新整个页面才能看到更改,据我所知,我们不能像 React 那样只更新其中的一部分。

简短的回答是您不需要重新加载页面来更新DOM树。您可以通过检查任何元素并编辑其内容来自己尝试。 React 也可以用类似的方式更新 DOM。它是即时的,因为内容在内存中而不是保存在文件中(需要重新加载)。

DOM 更新示例 :)

您可以将 DOM 更新为 javascript。在更新文件时需要重新加载页面而没有反应的原因是因为当你在浏览器中加载页面时,浏览器将页面的文件加载到它的 memory/your ram 执行代码(html、css 和 javascript)。用于更新 DOM 的反应代码在页面的 javascript.

但是,如果您更改文件中的 html,chrome 不知道所以不会知道,因此您必须为 [=18= 重新加载页面] 将新的页面资源加载到它的内存中并执行那里的任何代码。