我正在重建我的延迟加载模块以接受异步请求,但我有一个大问题:
Internet Explorer 不支持 script.onload/onerror!!!
旧脚本确实全局评估了使用 ajax 同步调用读取的目标脚本源,
它工作得很好,它是跨浏览器的,我可以让它异步编辑 1 个变量,但调试起来非常棘手(所有源代码都在一行中执行,浏览器不会提供太多有关错误的信息,将代码除以与正则表达式的行是不可能的,因为 js 具有无限深度的块,而正则表达式根本不擅长于此)。
这是我用来创建脚本的代码(经典):
var script = document.createElement('script');
script.type = 'text/javascript';
script.src =name;
script.name =name;
script.async = true;
script.onload=<my_onload_code>;
script.onerror=<my_onerror_code>;
它不适用于 IE,因为它不支持脚本的 onload 和 onerror;
下面的代码是一个修复,但仅在脚本不是异步时才有效
if(script.onreadystatechange!==undefined)//only IE T_T
script.onreadystatechange = function() {
if (script.readyState == 'loaded')//ERROR LOADING
<my_onerror_code>;
else
if(script.readyState == 'complete')//loaded
<my_onload_code>;
};
我可以每隔 X 毫秒测试一次,直到加载脚本,但这是一个丑陋的解决方案,我想避免它。
EDIT:这是我尝试每隔 X 毫秒检查脚本是否已加载的代码,它并没有那么糟糕,而且比 ajax 效果更好;问题是我不知道脚本加载成功还是错误(onload 或错误)。
var script = document.createElement('script');
script.type = 'text/javascript';
script.src =name;
script.name =name;
script.async = true;
script.onload=function(){Lazy_loader.onload(this);};
script.onerror=function(){Lazy_loader.onerror(this);};
if(script.onreadystatechange!==undefined){//ie fix T_T
script.timer=setInterval(function(){
if (script.readyState == 'loaded' || script.readyState == 'complete')}//ERROR LOADING
if(LOADED???)//loaded
Lazy_loader.onload(script);
else
Lazy_loader.onerror(script);
clearInterval(script.timer);
}
},100);
}
document.getElementsByTagName('head')[0].appendChild(script);
我尝试使用 addEventListener/attachEvent 函数,但它似乎不起作用(即使使用来自网络的 addEvent 函数)
总结选项似乎是:
- 使用AJAX和全局eval加载脚本(调试地狱)
- 仅在 IE 中使用 AJAX 和全局 eval(可能是一个解决方案,我不使用 IE)
- 仅当脚本包含错误时才使用 AJAX 和全局 eval(我需要检查计时问题,因为使用我的代码,即使调用是异步的,我也会“模拟”同步代码)
- 每 X 次测试 script.onreadystatechange (仅在 IE 上),直到加载(丑陋!!!)
- 使用 window.onload :避免,它需要对所有页面充电,我需要在仅启动一个脚本时调用它(请参阅尾页的详细信息)
- 在每个脚本的源代码上添加代码(避免像尾页上所说的那样)
- 修复 IE 的 script.onload(使用 addEventListener/attachEvent?!?)
PLEASE PAY ATTENTION:
i don't want to use window.onload because it's fired only when ALL the page is loaded,i need to fire it when only the target script is loaded(my lazy loading script is a lot more complex so please don't ask why);
i DO NOT WANT to use ANY third party library(like jquery,prototype,etc.),
i don't even want to edit the target script source(like when using JSPON or adding a script to alert that the script is loaded).
希望这还不算太多!
谢谢。