使用javascript在两个位置绘制单个DOM元素

使用javascript在两个位置绘制单个DOM元素,javascript,jquery,html,jquery-ui,Javascript,Jquery,Html,Jquery Ui,我使用jQueryUI创建了一个包含可排序卡片的大表,每个卡片都由一个嵌套div标签的大树组成,并使用CSS进行样式设置。当我在特定条件下拖动一张卡时,我想创建一个稍微透明的“克隆”卡,在拖动时,它会悬浮在“真实”卡的右侧,但我不想为了实现这种视觉效果而复制所有HTML 那么,是否可以使用javascript在两个不同的位置在网页上绘制相同的DOM元素,而不实际复制HTML 感谢所有回答的人。每个DOM元素要么根本没有连接到DOM,要么连接到一个特定的父元素。不能在两个不同的位置显示同一图元。附

我使用jQueryUI创建了一个包含可排序卡片的大表,每个卡片都由一个嵌套div标签的大树组成,并使用CSS进行样式设置。当我在特定条件下拖动一张卡时,我想创建一个稍微透明的“克隆”卡,在拖动时,它会悬浮在“真实”卡的右侧,但我不想为了实现这种视觉效果而复制所有HTML

那么,是否可以使用javascript在两个不同的位置在网页上绘制相同的DOM元素,而不实际复制HTML


感谢所有回答的人。

每个DOM元素要么根本没有连接到DOM,要么连接到一个特定的父元素。不能在两个不同的位置显示同一图元。附加到新的父元素只会从旧元素移动元素


您可以使用(注意将新的事件处理程序附加到它,因为它们不是克隆的)或在JS工厂生成一些“模板”元素,并将每个元素附加到不同的父元素

完全相同的元素不可能同时位于两个位置。但是可以克隆该元素。还可以使用伪选择器(如
after:
before:
)创建阴影dom,以获得无需任何html的图形效果。您所要做的就是使用并添加几个类。谢谢大家的评论。如果Esailija是对的,那么我想我会努力实现你的想法,ZZBOV。我只是想知道是否有一种简单的方法可以在不克隆整张卡片的情况下实现这种效果。因为我无法再编辑我的评论,这里有一个影子dom的示例:div中的箭头根本不是html。有趣的是。。。我以前确实使用过它,但不了解它是如何工作的。带有true passed的jQuery clone将复制元素和事件处理程序。请参阅:@jholloman,您确定它将克隆使用常规DOM的
.addEventListener
添加的处理程序吗?我不知道有什么DOM函数允许枚举当前安装的事件,所以有些事情告诉我,jQuery只能克隆*属性处理程序上的
。以及那些通过jQuery本身安装的。这是一个很好的观点,我不知道它是否可以克隆到那个级别。