Jquery检测元素注入

时间:2013-05-16 07:59:58

标签: jquery dom

是否有一个函数来检测是否已对DOM进行了新的元素注入? 而不是在我的ajax调用之后不断检查以查看是否有如此注入的新图像:

$.ajax({
    ...
    ...
    success: function(data) {
        $('.content').replaceWith(data);
        if ($(data).find('img').length) alert('New images found!');
    }
});

我希望有一个功能存在,以检查是否有新的图像添加到DOM。例如:

$('img').injected(function() {
    console.log('Found new images: ' + this);
});

1 个答案:

答案 0 :(得分:0)

您可以通过突变观察者检测DOM变化。由于我不知道你的标记,我将使用通用元素。 .injectedElementParent是您要注入img的父级。

// select the target node
var target = document.querySelector('.injectedElementParent');

// create an observer instance
var observer = new MutationObserver(function(mutations) {
    mutations.forEach(function(mutation) {
        console.log(mutation);
    });    
});

// configuration of the observer:
var config = { attributes: true, childList: true, characterData: true }

// pass in the target node, as well as the observer options
observer.observe(target, config);