jQuery:将外部资源排除在$(window).load()中



我需要执行一些脚本,当我的域和子域上的所有资源都加载时,我做到了:

$(window).load(function(){
  // al my functions here...
}

问题在于,有时需要更长的时间来加载一些外部资源(我的域和子域上)。有没有办法将外部资源排除在加载事件之外?

编辑:我希望做类似的事情:

$(window).not(".idontcare").load(function()

但是它不起作用

我想您的外部资源依赖于 src属性。

如果是这样,在您的页面源代码中,您可以设置您不想等待的资源的src属性,而不是src,而是为external_src

然后您可以轻松地做:

$(document).ready(function(){
    $(window).load(function(){
        // all your functions here...
    });
    $('[external_src]').each(function() {
        var external_src = $(this).attr("external_src");
        $(this).attr("src", external_src); // now it starts to load
        $(this).removeAttr("external_src"); // keep your DOM clean
        //Or just one line:
        //$(this).attr("src", $(this).attr("external_src")).removeAttr("external_src");
    });
});

这样,只要DOM就准备就绪,外部资源应立即开始加载,而无需等待全窗口负载。

我的情况几乎相同。但是就我而言,我想从另一个站点(例如YouTube,vimeo等)排除所有加载内容的iframe。找到了解决方案的工作,因此,当Dom准备就绪时,所有iframe的场景是hide'src'属性,并在窗口完成时将其放回加载所有其他内容时。

(function($){
    //DOM is ready
    $(document).ready(function(){
        var frame = $('iframe'),
            frameSrc = new Array();
        if( frame.length ){
            $.each( frame, function(i, f){
                frameSrc[i] = $(f).attr('src');
                //remove the src attribute so window will ignore these iframes
                $(f).attr('src', '');
            });
            //window finish load
            $(window).on('load',function(){
                $.each( frame, function(a, x){
                    //put the src attribute value back
                    $(x).attr('src', frameSrc[a]);
                });
            });
        }
    });
})(jQuery);

您可以通过添加特殊类来标记网站中加载外部资源的所有元素,并使用$('.special_class')或类似的内容更改iFrame。我不知道这是最好的方法,但至少它在我这方面效果很好:D

不幸的是,window.onload事件非常严格。如您所知,当所有和所有资源都被转移和加载时,它将触发它, images iframes everything 。因此,对您的问题的快速答案是否定的,没有容易使用的方法来告诉该事件以忽略外部资源,在那里没有区别。

您需要自己处理,这可能是一件棘手的事情,根据这些资源的包括和找到这些资源。您甚至可能需要在源代码实现之前操纵源代码。

据我所知,脚本标签有一个异步标签。您可以包括:

<script src="script_path" async="true"></script>

这不会将它们包括在活动中。

也许

$(document).ready(...)

而不是$(window).load()会有所帮助?

即使所有图形尚未加载,也已经加载了html-document并准备就绪时,文档就绪事件已经执行。

,即使所有图形尚未加载。

最新更新