我正在使用jQueryUI創建一張可排序卡片的大表,每個卡片由嵌套div標記的大樹與使用CSS的樣式組成。當我在某些條件下拖動一張卡片時,我想創建一個稍微透明的卡片「克隆」,它在拖動時懸停在「真實」卡片的右側,但我不想實際上覆制所有的HTML以實現這種視覺效果。使用javascript在兩個地方繪製單個DOM元素
那麼,是否有可能使用JavaScript來在兩個不同的地方在網頁上繪製相同的DOM元素,而沒有真正複製HTML?
感謝任何回答的人。
我正在使用jQueryUI創建一張可排序卡片的大表,每個卡片由嵌套div標記的大樹與使用CSS的樣式組成。當我在某些條件下拖動一張卡片時,我想創建一個稍微透明的卡片「克隆」,它在拖動時懸停在「真實」卡片的右側,但我不想實際上覆制所有的HTML以實現這種視覺效果。使用javascript在兩個地方繪製單個DOM元素
那麼,是否有可能使用JavaScript來在兩個不同的地方在網頁上繪製相同的DOM元素,而沒有真正複製HTML?
感謝任何回答的人。
每個DOM元素根本不連接到DOM或連接到一個特定的父級。你不能在兩個不同的地方顯示相同的元素。附加到一個新的父母只會從舊的元素移動元素。
您可以使用cloneNode
(注意附加新的事件處理程序,因爲它們未被克隆),或者在JS工廠生成一些「模板」元素並將它們附加到不同的父項。
帶有true傳遞的jQuery克隆將複製元素和事件處理程序。請參閱:http://docs.jquery.com/Clone – jholloman 2012-07-26 17:25:27
@jholloman,你確定它會克隆處理程序添加常規DOM的'.addEventListener'?我不知道允許枚舉當前安裝的事件的DOM函數,所以有些事情告訴我jQuery只能克隆'.on *'屬性處理程序以及通過jQuery自身安裝的屬性處理程序。 – 2012-07-26 17:42:03
這是一個很好的觀點,我不知道它是否可以克隆到該級別。 – jholloman 2012-07-26 17:53:39
這是不可能的,一次完全相同的元素在2個地方。儘管可以克隆該元素。還有一種可能性,就是用'after:'和'before:'之類的僞選擇器創建陰影dom,以獲得沒有任何html的圖形效果。 – Esailija 2012-07-26 16:17:45
你所做的是使用['clone'](http://api.jquery.com/clone)並添加幾個類。 – zzzzBov 2012-07-26 16:17:46
感謝您的評論,夥計們。如果Esailija是對的,那麼我想我會嘗試實現你的想法,zzzzBov。我只是想知道是否有一種簡單的方法可以在不克隆整個卡的情況下實現這種效果。 – ihake 2012-07-26 16:24:01