变量如何将其值绑定到DOM？

Question

这可能很疯狂,但很长一段时间我很有趣:)

我想知道一个javascript变量如何绑定它自己做DOM后附加到正文,例如？

var p = document.createElement('p');
p.innerHTML = 'Hello World';

document.body.appendChild(p);

所以现在我有了这个p变量,它包含该特定段落的精确引用,无论它位于体内的哪个位置.

p.innerHTML = 'new content';

很容易找到段落并改变它的价值

所以我的问题是......如何进行这种绑定？

如果我想在变量消失后重新创建它？是否有任何方法可以再次附加它,而无需通过DOM运行并找到它？

我想在某种程度上,DOM内的每个节点都有其特定的标识符,该标识符不是id属性,而是稍后可以引用的某种UUID？

喜欢:

console.log(p.localName); //aoi12e2kj2322444r4t
p = null;

所以我仍然可以恢复该段节点认为这个uuid？

在这种环境下,我不会访问任何外部节点的属性,例如name,id,data等.

所以我很想知道如何在变量和DOM节点之间创建这种绑定？

Answer 1

绑定在第一行创建，您可以在其中将结果分配给document.createElementto p。这与您向变量分配某些内容的任何其他时间没有什么不同，它总是将变量名称绑定到值。就脚本而言，没有发生其他绑定。这p是一个 HTMLElement，这就是公开的所有元素。

请注意，对于p.innerHTML = 'new content';，不必找到该元素，因为p已经引用了该元素。这就是 DOM 的作用：它公开文档和文档元素。

如果您稍后想要对同一元素进行另一个引用，则必须使用 DOM 方法（例如getElementById）来查找它。这就是他们存在的目的。

至于 DOM 如何公开元素，这是内部实现的，并且因浏览器或库的不同而有所不同（因为 DOM 不仅仅在浏览器中使用）。