在DOM准备好后检查元素是否存在

Question

我想在DOM准备好后检测元素是否可见。 此元素是第三方窗口小部件，加载速度比页面慢。

'dom ready'的console.log正在触发 - 就像它应该的那样，但我检查元素是否可见正在返回false，因为元素在dom准备好后加载。

dom加载后有没有办法监听元素？

<script>
    $(function(){
        console.log('dom ready');

        if($(element).is(':visible')){
            console.log('element is visible. do stuff.');
        }

    });
</script>

Answer 1

你可以从iframe中获取id，或者从正在加载的文档中获取id并执行类似的操作。

$('#external').load(function(){
    //lets do something when is loaded
    if($(element).is(':visible')){
       console.log('element is visible. do stuff.');
    }
});

一旦该脚本iframe完成加载，这将触发

Answer 2

尝试阅读文档，也许第三方小部件的API允许您在创建事件上附加侦听器。 那将是一个理想的解决方案。

如果无法尝试使用setTimeout函数：

$(function(){
    console.log('dom ready');
    setTimeout(function() {
        if($(element).is(':visible')){
            console.log('element is visible. do stuff.');
        }
    }, 10);
});

如果10 ms不够，除非有效，否则可能会增加此间隔，但我不建议使用此方法。