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

Question

（好吧，我知道问题可能听起来很糟糕，所以有人编辑，如果他们知道如何重新制定它）。

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

正如你可能看到的那样，我试图重新创建一个基本的Windows 7航空效果（好奇心，有趣，学习等等），但我偶然发现了一些问题。  （我只会含糊地解释，因为你可以在小提琴上看到它，否则它会是一个文本主持人）

• 文本卡在父级（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中看到的是如果我注释掉{{1 }}