javascript - 输入和 dom 值存储在哪里？

Question

这是一个非常基本的问题，但我不知道如何研究它。假设我有一个带有输入字段的 html 文件和一个 javascript 文件，其中包含一个用于获取输入中输入的值的函数:

HTML:

<input type='text' id='value' onclick='getValue()'>

JS 文件:

var val;
function getValue(){
    val = document.getElementById('value').value;
    console.log(val)
}

当用户输入一个值时，该值将存储在 DOM 中。然后，我从 DOM 中获取值并将其存储在浏览器中加载的脚本文件中。

因为它现在存储在我的脚本文件中。如果我重新加载页面，所有存储的值都将重置为其原始文件。

从 DOM 获取的值存储在我加载的 javascript 文件中是否准确？或者它存储在其他地方？

Answer 1

输入值存储在 DOM 树中(如果您想知 Prop 体位置:请参阅代码，例如:Chrome 和 Firefox 的代码)。您发布的 JavaScript 代码会复制该值。该副本独立于 DOM 树中存储的值，您可以删除输入元素，但 JavaScript 中仍会保留该副本。所以答案有三个:

• 该值首先位于 DOM 树中
• 当您在 DOM 树中复制和时，输入值的副本位于 JavaScript 堆栈中；至少我知道没有一步法来移动它。
• 如果删除 DOM 元素，您在 JavaScript 中创建的副本仍保留在 JavaScript 中

这使得使用两个不同的程序运行 JavaScript 和 DOM 解析成为可能。 Chrome 使用他们的 V8 机器来实现这一点，你可以将其放入薄包装中并单独运行。如果需要，您可以将结果称为“节点”。