修改容器的 innerHTML 属性时元素引用中断

Chr*_*ker 7 javascript mootools dom object pass-by-reference

通过代码创建元素时,我遇到了一个问题,即修改innerHTML元素的属性会破坏对修改之前注入到已修改元素中的其他元素的任何引用。

我这里有一个测试用例:http://jsfiddle.net/mJ7bF/1/,其中我希望link1引用的行为完全相同link2

第二个测试用例是相同的代码,但我没有使用innerHTML属性来添加<br>标签,而是使用对象创建换行符。此测试的行为符合预期:http ://jsfiddle.net/K4c9a/2/

我的问题不是关于这个特定的代码,而是关于它背后的概念:link1第一个测试用例中的引用会发生什么?如果它不引用节点cont注入到文档中时可见的 HTML/DOM 节点,那么它引用什么,以及它如何适应 javascript 对象的 ByReference 性质?

Dim*_*off 5

这里很少有东西。

首先。字符串是不可变的,因此 doelement.innerHTML += "<br>"相当于完整的读取和重写。

其次,为什么这不好:

除了性能之外,mootools(和 jquery)还为所有引用的元素分配特殊的唯一顺序 uid。您可以通过调用元素的选择器或创建元素等来引用元素。

然后考虑uid5. the的特定元素uid链接到一个名为 的特殊对象,Storage该对象位于闭包后面(因此它是私有的)。它有uidas 键。

然后元素存储在 aelement.store("key", value")element.retrieve("key")

最后,为什么这很重要:events存储到元素存储中(例如,Storage[5]['events']) - 如果您好奇的话,可以执行 element.retrieve("events") 并在 fireBug 中探索它。

当您重写innerHTML 时,旧元素将不再存在。然后重新创建它,但事件处理程序和对您之前绑定的函数的引用将不再起作用,因为它现在将获得一个 NEW uid

就是这样,希望它有意义。

要添加 br,只需执行new Element("br").inject(element)以下操作或为该批次创建一个模板化片段(最快)并添加 1 个大块,然后添加事件。