在IE11&中,script.readyState未定义。 FF

时间:2014-09-02 06:57:52

标签: javascript internet-explorer-11

我刚刚开发了一个动态脚本加载器,它在IE9中工作正常但在IE11中没有,而在FF中也没有。

这是我的代码:

function getResourceScript(filename)
{
    var script = document.createElement('script');
    script.setAttribute('src', mShuttlePath + "scripts/" + filename);
    script.setAttribute('type', 'text/javascript');
    script.setAttribute('language', 'javascript');
    document.getElementsByTagName('head')[0].appendChild(script);
}

function documentLoadInit()
{
    if (document.readyState == 'complete')
    {
        // check if all scripts are loaded
        for (var n = 0; n < document.scripts.length; n++)
        {
            if (document.scripts[n].readyState != "complete" && document.scripts[n].readyState != "loaded")
            {
                setTimeout(documentLoadInit, 49);
                return false;
            }
        }
        Init();
    }
    else
    {
        setTimeout(documentLoadInit, 49);
    }

}
getResourceScript("core/core.js");
getResourceScript("core/ajax.js");

这里的主要问题是,在IE11中删除了script.readyState - 我发现了很多!

但如何更换呢?如何检查脚本何时加载/完成?

有什么想法吗?

2 个答案:

答案 0 :(得分:4)

来自MSDN:

  

注意:对于脚本元素,不再支持readyState。从Internet Explorer 11开始,使用onload。有关信息,请参阅兼容性更改。

因此,不是检查readyState,而是可以使用以下内容:

if (!script.addEventListener) {
    //Old IE
    script.attachEvent("onload", function(){
        // script has loaded in IE 7 and 8 as well.
        callBack();
    });
}
else
{
    script.addEventListener("load", function() {
        // Script has loaded.
        callBack();
    });
}

另外,我非常确定您可以改进代码。在这种情况下setInterval()更合适。阅读一些关于如何使用dom事件的内容,如果您仍然遇到兼容性问题,可以使用以下内容:

function loadExtScript(src, test, callback) {
  var s = document.createElement('script');
  s.src = src;
  document.body.appendChild(s);

  var callbackTimer = setInterval(function() {
    var call = false;
    try {
      call = test.call();
    } catch (e) {}

    if (call) {
      clearInterval(callbackTimer);
      callback.call();
    }
  }, 100);
}

该函数将测试作为参数。由于您是该应用程序的设计者,因此您将了解成功的测试是什么。一旦此测试为真,它将执行回调。

答案 1 :(得分:1)

实际上我认为你在准备好文件之前就已经准备好了。您需要设置状态更改侦听器,并在每次文档状态更改时进行检查。

document.onreadystatechange = function () {
  if (document.readyState == "complete") {
    initApplication();
  }
}

阅读文档:https://developer.mozilla.org/en-US/docs/Web/API/document.readyState