我有一个由插件创建的div,并在页面呈现后出现(总是在不同的时间)。
我需要检查此div是否存在,然后执行一组函数。但是,如果尚不存在,我要等到它出现后再执行该功能集。
这是我现在正在使用的:
var check = setInterval(function(){
if ($('#target-div').length){
console.log('execute set of functions')
clearInterval(check);
}
}, 100);
但是,有没有一种方法可以永久检查div是否退出(例如在后台运行它或在其他地方运行),并在创建后立即退出-停止但不退出setInterval
?
因为我进行了多次类似的检查,因此每次必须设置一个新的/不同的setInterval时,情况一团糟。
谢谢。
不要使用DOM轮询来进行此操作,因为这是一种反模式。请改用突变观察者。这是一个侦听器,可以将其设置为在对DOM进行某些更改时触发。子节点或属性修改。试试这个:
var $div = $("#container");
new MutationObserver(function(mutations) {
console.log('.foo was appended');
}).observe($div[0], {
childList: true
});
setTimeout(function() {
$div.append('<div class="foo">foo</div>');
}, 2000);
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<div id="container">
Appending an element in 2 seconds...
</div>
请注意,这是一个非常基本的示例。您可以通过MutationObserver()
任何所需的方式调整提供的处理程序功能,因为该mutations
参数提供了有关刚刚发生的更改的大量信息。
有关更多信息,请参见上面的MDN文档链接。
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句