Check to see if element exists after DOM is ready

I'm trying to detect whether an element is visible after the DOM is ready. This element is a third party widget that loads slower than the page does.

My console.log for 'dom ready' is firing - like it should, but my check to see if the element is visible is returning false, as the element loads after the dom is ready.

Is there a way to listen for elements after the dom has loaded?

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

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

    });
</script>

you can get the id from the iframe, or from the document that is being loaded and do something like this..

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

This will trigger once that script, iframe is done loading


Try to read a documentation, maybe third-party widget's API allows you to attach listener on create event. That would be an ideal solution.

If it is not possible try using setTimeout function:

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

If 10 ms is not enough, you may increase this interval unless it works, although I don't recommend using this approach.

链接地址: http://www.djcxy.com/p/95236.html

上一篇: 重复在一个跨越里面不工作?

下一篇: 在DOM准备就绪后检查元素是否存在