javascript - 如何防止一个元素的子元素位于另一个元素之上

Question

(好吧，我知道这些问题可能听起来很糟糕，所以如果有人知道如何重新表述，就可以进行编辑)。

所以，基本上我有这个:jsFiddle

正如您可能看到的那样，我正在尝试重新创建一个基本的 Windows 7 气动效果(好奇心、乐趣、学习等没什么大不了的)，但我遇到了一些问题。 (我只会含糊地解释一下，因为你可以在 fiddle 上看到它，否则它就是一个 textathon)

• 文本卡在父级的 (div) 父级 (div) 元素之上。
• 文本以某种方式从重复元素 (div) 中泄漏，甚至认为它不是来自原始元素。

我知道这听起来很奇怪，但您最好在 fiddle 上看到它.

谢谢。

Answer 1

我认为您遇到的问题源于此:

$(container).find('*').each(function() {
  var e_clone = $(this).clone(false).appendTo(processor);
  // etc etc
});

通过使用 * 选择器然后运行 ​​.each，您将比我认为您可能想要的更多的标记克隆到 #processor 中。你在那里得到了 span.lol 的两个副本，因为首先它克隆了 #box(包括它的所有子项)，然后在下一次迭代中它复制了 >span.lol 它自己。

至于文本从父级“泄漏”，它确实发生在原件中......如果我注释掉对 的调用，至少这是我在 Chrome 中看到的玻璃('#container'，'#processor')。