React 如何仅更新真实 DOM 树的单个部分？

如何解决React 如何仅更新真实 DOM 树的单个部分？

React 的虚拟 DOM 如何仅渲染 DOM 的特定部分并保留树的其余部分？

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

我知道虚拟 DOM 是什么，它如何将新版本与旧版本进行比较，以及诸如此类的东西。我还阅读了对帐文件，但这也没有回答我的问题。当 React 拥有需要转换为真实 DOM 的新虚拟 DOM 后会发生什么？

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

解决方法

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

DOM 更新示例 :)

,

您可以使用 javascript 更新 DOM。更新文件时需要重新加载页面而反应不需要的原因是因为当您在浏览器中加载页面时，浏览器会将页面文件加载到它的内存中/您的 ram 执行代码（html、css 和javascript）。用于更新 DOM 的响应代码位于页面的 javascript 中。

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