Question

我有：

$elements = $('.elements');
$element = $('.element');


function appendText(element){
    element.append('<em> appended text</em>');
}

appendText($element);

$('button').on('click', function(){
        $elements.append('<span class="element">Span Element Appended after load</span>');
        appendText($element);
});

在按钮单击后，appendText函数仅附加到初始元素，这是由于我认为的JS缓存所致。

我知道我可以做appendText（$（＆＃39; element＆＃39;））;问题将得到解决，但我现在不想改变我的所有代码。

有没有办法让jQuery认为这个$ element变量不是一个缓存的元素，每次调用那个变量时都会查看完整的DOM？

如果您希望更好地发挥或理解，请找到jsfiddle：http://jsfiddle.net/adyz/733Xd/

Answer 1

如果你添加：

$element = $('.element:last-child')

前

appendText($element);

我认为会解决你的问题这里是jsFindle：http://jsfiddle.net/733Xd/5/。

祝你好运！

Answer 2

这是一件昂贵的事情。出于性能原因，我会建议不要这样做。

我在去年https://github.com/fmsf/jQuery-obj-update

的开头做了这个插件

它不会在每次通话时触发，您必须自己请求更新：

$element.update();

代码足够小，可以粘贴在答案上：

(function ( $ ) {
  $.fn.update = function(){
    var newElements = $(this.selector),i;    
    for(i=0;i<newElements.length;i++){
      this[i] = newElements[i];
    }
    for(;i<this.length;i++){
      this[i] = undefined;
    }
    this.length = newElements.length;
    return this;
  };
})(jQuery);

Answer 3

我认为下面会解决你的问题

   appendText($element); //here you always referring to the node which was there initial.

   http://jsfiddle.net/s9udJ/

Answer 4

可能的解决方案是

$(function(){

$elements = $('.elements');
$element = $('.element');

function appendText(element){
    element.append('<em> appended text</em>');
}

appendText($element);

$('button').on('click', function(){
        $elements.append('<span class="element">Span Element Appended after load</span>');
        appendText($elements.find('span').last());
});



})

Answer 5

我不认为你提出的要求很容易 - 当你致电$element = $('.element');时，你定义了一个等于一组对象的变量（好吧，一个对象）。在调用appendText($element);时，您正在对该对象进行操作。它不是缓存 - 它只是JS（和其他编程语言）的工作方式。

我能看到的唯一解决方案是，每次jquery调用其中一个DOM操作方法时，都会有一个更新变量的函数，如下所示：

<div class='a'></div>
$(document).ready(function()
{
    var element = $('.a');

    $.fn.appendUpdate = function(elem)
    {
        // ugly because this is an object
        // also - not really taking account of multiple objects that are added here
        // just making an example

        if ($(elem).is(this.selector))
        {
            this[this.length] = $(this).append(elem).get(0);
            this.length++;
        }

        return this;
    }

    element.appendUpdate("<div class='a'></div>");
    console.log(element);
});

然后，您可以使用sub()推出自己的append =上述版本。这样你的变量就是最新的，你真的不需要改变你的代码。我还需要说我对我写的东西感到不寒而栗（拜托，拜托，请不要使用它）。

Fiddle

jQuery选择器 - 在变量中追加/加载后也选择新元素

5 个答案: