维护 jQuery.clone(） 元素对原始元素的引用

Maintain reference in jQuery.clone() element to original element

本文关键字：元素 原始 引用 jQuery clone 维护      更新时间：2023-09-26

我很惊讶地看到jQuery在调用源元素的$.clone()操作的结果元素中不包含任何功能。我的解决方法是简单地将原始元素的jQuery对象包含在克隆的数据存储中，如下所示

var $elOriginal = $('SomeUniqueSelector');
var $elClone = $elOriginal);
// Save a jQuery object of the original element in the 
// clone's data store
$elClone.data('original', $elOriginal);

当我需要引用原始文件时，我会深入研究克隆的数据存储，

$elOriginal = $elClone.data('original');

就个人而言，我对这种方法并不感到兴奋。（当然，我考虑过用id标记原始元素并简单地存储它，但随后我被迫向元素添加一个 id。不优雅。

有人有更好的主意吗？

编辑，更新

jQuery的prevObject属性似乎保存了对原始对象的引用

试用 （v3）

var $elOriginal = $("div");
var $elClone = $("div").clone(true, true);
$elClone.html(123);
$("body").append($elClone);
console.log($elClone.prevObject.html())


    var $elOriginal = $("div");
    var $elClone = $("div").clone(true, true);
    $elClone.html(123);
    $("body").append($elClone);
    console.log($elClone.prevObject.html())
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div>abc</div>

使用 withDataandEvents 和 deepWithDataAndEvents 复制元素的事件和数据以及克隆元素的所有子元素。

$elClone.clone(true, true);

从文档中 -

通常，绑定到原始元素的任何事件处理程序都不会复制到克隆中。可选的 withDataAndEvents 参数允许我们更改此行为，并改为复制所有事件处理程序，绑定到元素的新副本。从 jQuery 1.4 开始，所有元素数据（通过 .data（） 方法附加）也会复制到新副本中。 从jQuery 1.5开始，可以使用deepWithDataAndEvents来增强withDataAndEvents，以复制克隆元素的所有子元素的事件和数据。

相关文章：