img.onload与script.onload实现的不同写法

在http://www.cnblogs.com/outside/p/3714482.html中，如何使用img.onload已经很清楚，当使用同样的方法创建script就有问题了

var script = document.createElement("script");
script.src = "js/jquery.js";

script.onload = function(){console.log("script")};

这样写的话，本以为能像img一样，控制台输出script,但在firfox,ie（本次测试只在firfox,ie中测试）中均没有输出。

在网上搜索了一下，大概说ie使用的是onreadystatechange事件来监听资源下载状态的改变控制输出，firfox使用onload事件控制资源下载完成后输出。

以下代码在ie中起作用

var script = document.createElement("script");
script.src = "js/jquery.js";
script.onreadystatechange = function(){
　　if(this.readyState === "loaded" || this.readyState === "complete"){//ie7,8只认识complete
　　　　alert("ie");
　　}
}

当onreadystatechange换成script.onload = function(){console.log("script")};来测试，却没有输出，最后通过调试，发现在firfox中需要将script标签添加到dom中去才能触发事件（也即添加到dom中去才开始下载），这点跟ie不同（ie跟script添加src就开始下载资源了）。

最后在网上找了两段兼容代码，代码如下

第一：

var url = "js/jquery.js";
var script = document.createElement("script");
if(script.addEventListener){
　　script.addEventListener("load", callback, false);
}else if(script.attachEvent){
　　script.attachEvent("onreadystatechange", function(){

　　　　var target = window.event.srcElement;

　　　　 if(target.readyState == "loaded" || target.readyState == "complete"){

　　　　　　callback.call(target);

　　　　}

　　});
}
document.getElementsByTagName("head")[0].appendChild(script);

function callback(){
console.log("兼容")
}
script.src=url;

第二：

var script = document.createElement("script");
script.onload = script.onreadystatechange = function(){
　　if(!this.readyState || this.readyState=='loaded' || this.readyState=='complete'){
　　　　func();
　　　　script.onload = script.onreadystatechange = null;
　　}
};
document.getElementsByTagName("head")[0].appendChild(script);
function func(){
　　console.log("兼容")
}

script.src = "js/jquery.js";