Question

让我们考虑以下情况：

 <div class="org"> <p>Some text</p> </div>

现在使用JQuery：

 $vdom = $(".org").clone();

现在我将对原始元素进行一些更改

 $(".org p ").text("Changed text");

如果我执行$vdom.find('p').text()，它仍然会提供“某些文字”。如何根据原始元素发生的变化自动更新克隆元素。

$vdom.find('p').text("changed text")，对于这个上下文很好，但是我希望自动化这个，其中对原始元素的每个更改都应该在克隆元素中持续存在。

是否有任何图书馆可以实现这一目标。

Answer 1

你必须将clonned元素插入到body中，以便将它放到DOM堆栈中，然后它可以使用如下全局选择器进行更改：

$(".org p ").text("Changed text");

运行此代码段并检查文本和控制台输出结果：

var $vdom;
    $('#cloneEl').on('click', function() {
    $vdom = $(".org").clone();
    $('body').append($vdom);
});

$('#changeText').on('click', function() {
    $(".org p ").text("Changed text");
    console.log($vdom.find('p').text());
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<button id="cloneEl">Clone org</button>
<button id="changeText">Change org text</button>

<div class="org"> <p>Some text</p> </div>

在原始元素更新-JQuery上自动更新克隆元素

1 个答案: