`
ayue222
  • 浏览: 48049 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

如何判断脚本加载完成

阅读更多
在“按需加载”的需求中,我们经常会判断当脚本加载完成时,返回一个回调函数,那如何去判断脚本的加载完成呢?

我们可以对加载的 JS 对象使用 onload 来判断(js.onload),此方法 Firefox2、Firefox3、Safari3.1+、Opera9.6+ 浏览器都能很好的支持,但 IE6、IE7 却不支持。曲线救国 —— IE6、IE7 我们可以使用 js.onreadystatechange 来跟踪每个状态变化的情况(一般为 loading 、loaded、interactive、complete),当返回状态为 loaded 或 complete 时,则表示加载完成,返回回调函数。

对于 readyState 状态需要一个补充说明:

在 interactive 状态下,用户可以参与互动。
Opera 其实也支持 js.onreadystatechange,但他的状态和 IE 的有很大差别。
具体实现代码如下:

function include_js(file) {
    var _doc = document.getElementsByTagName('head')[0];
    var js = document.createElement('script');
    js.setAttribute('type', 'text/javascript');
    js.setAttribute('src', file);
    _doc.appendChild(js);
    if (!/*@cc_on!@*/0) { //if not IE
        //Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload
        js.onload = function () {
            alert('Firefox2、Firefox3、Safari3.1+、Opera9.6+ support js.onload');
        }
    } else {        //IE6、IE7 support js.onreadystatechange
        js.onreadystatechange = function () {
            if (js.readyState == 'loaded' || js.readyState == 'complete') {
                alert('IE6、IE7 support js.onreadystatechange');
            }
        }
    }
    return false;
}//execution function

include_js('http://www.planabc.net/wp-includes/js/jquery/jquery.js');
分享到:
评论

相关推荐

    js 判断脚本加载完毕的代码

    记录一段代码,用来判断脚本是否加载完毕。

    Unity3D切换场景时判断场景是否加载完成1

    Unity3D切换场景时判断场景是否加载完成 Posted on 2013年02月27日 by U3d / Unity3D脚本/插件/被围观 282 次 Uni

    怎么判断js脚本加载完成

    在“按需加载”的需求中,我们经常会判断当脚本加载完成时,返回一个回调函数,那如何去判断脚本的加载完成呢? 我们可以对加载的 JS 对象使用 onload 来判断(js.onload),此方法 Firefox2、Firefox3、Safari3.1+...

    判断脚本加载是否完成的方法

    在“按需加载”的需求中,我们经常会判断当脚本加载完成时,返回一个回调函数,那如何去判断脚本的加载完成呢?

    浏览器环境下JavaScript脚本加载与执行探析之defer与async特性

    defer和async特性相信是很多JavaScript开发者”熟悉而又不熟悉”的两个特性,从字面上来看,二者的功能很好理解,分别是”延迟脚本”和”异步脚本”的作用。...在《浏览器环境下JavaScript脚本加载与执行探

    JS脚本加载后执行相应回调函数的操作方法

    项目中经常会遇到这样的问题:当某个 js 脚本加载完成后再执行相应任务,但很多朋友可能并不知道怎么判断我们要加载的 js 文件是否加载完成,如果没有加载完成我们就调用 js 文件里面的函数是不会成功的。...

    基于javascript原生判断DOM是否加载完毕

    readyState document.readyState ...当 onload 事件触发时,页面上所有的DOM,样式表,脚本,图片,flash都已经加载完成了 根据执行时DOM是否已经装载完毕来决定是对回调函数进行同步调用还是异步调用。具体代码如下

    JS动态加载脚本并执行回调操作

    我们可以动态的创建 [removed] 元素,然后通过更改它的 src 属性来加载脚本,但是怎么知道这个脚本文件加载完成了呢,因为我们有些函数需要在脚本加载完成生效后才能开始执行。 经过对网络上资源的搜索,我发现在 IE...

    vue动态加载js.zip

    vue动态加载JavaScript:动态的创建Script元素,然后通过更改它的 src 属性来加载脚本,脚本文件加载完成后,在脚本加载完成生效后才能执行回调函数。

    LoadRunner脚本调试

    在脚本录制完成后或者手工编写脚本后,我们需要对脚本进行调试运行,脚本调试的过程类似于程序的调试,可以设置断点,按步骤执行等等;脚本调试作为脚本开发的一个重要的过程,是非常重要的,只有通过调试的脚本才能...

    探析浏览器执行JavaScript脚本加载与代码执行顺序

    JavaScript在浏览器中被解析和执行时具有阻塞的特性,也就是说,当JavaScript代码执行时,页面的解析、渲染以及其他资源的下载都要停下来等待脚本执行完毕①。这一点是没有争议的,并且在所有浏览器中的行为都是一致...

    跟我学习javascript的异步脚本加载

    标签里的大脚本会滞压所有页面渲染工作,使得用户在脚本加载完毕之前一直处于“白屏死机”状态。而<body>标签末尾的大脚本只会让用户看到毫无生命力的静态页面,原本应该进行客户端渲染的地方却散布着不起作用...

    Defer-JS:将脚本的加载推迟到页面加载完成后

    延迟JS 将脚本的加载推迟到页面完成... 该脚本实际上确保脚本在页面加载完成后才加载。 只需将脚本从 defer.js 文件中复制出来,并将其放置在结束正文标记之前的脚本标记中(当然,将您的脚本添加到数组并删除注释)。

    laad.js:非常简单的异步脚本加载 - laad.js

    JavaScript 脚本加载库(yep-nope.js、require.js、Lab.js、head.js $script.js、etc.js、etc.js)现在非常普遍。 事实上,有太多的时间来比较它们,足以编写你自己的。 这是我的。 它仅限于最基本的任务,即加载和...

    load-script:加载脚本并返回承诺的助手

    将脚本加载到客户端JavaScript中并返回Promise 用法 这个瘦小的帮助程序可以帮助您将诸如 , 类的脚本加载到客户端javascript中。 因此,您不必在脚本src中指定全局回调,该脚本在完全加载脚本后将被调用。 它受启发...

    gerobak:脚本加载器

    扩展以根据自定义数据属性动态加载脚本。 如何使用它 确保包含rsvp.js和basket.js或只使用gerobak.full.min.js 。 将gerobak-load="your/dir/to/script.js"放在文档的任何位置。 完毕。 Gerobak 会自动为您读取并...

Global site tag (gtag.js) - Google Analytics