These two days work with the dynamic loading of CSS and JS place more, here a little to do the next finishing.
var tool = {
Loadstyle:function (URL) {
var head = document.getElementsByTagName (' head ') [0],//Get Header Label
link = document.createelement (' link '); Create a LINK tag
Head.appendchild (link); Add link tag to header tag
Link.href = URL; Set Link's address
Link.rel = ' stylesheet ';
},
Loadscript:function (URL, fn) {
var head = document.getElementsByTagName (' head ') [0],
Script = document.createelement (' script ');
Head.appendchild (script);
script.src = URL;
Script.charset = ' utf-8 ';
Script.onload = Script.onreadystatechange = function () {
if (!this.readystate | | this.readystate = = = ' Loaded ' | | this.readystate = = ' complete ') {//The code here is explained below
if (FN) {
FN ();
}
Script.onload = Script.onreadystatechange = null;
}
};
}
};
if (!this.readystate | | this.readystate = = = ' Loaded ' | | this.readystate = = = ' complete ')
If there are more expressions, in doing this piece, on the Internet to check the relevant information, I think the following explanation is more reasonable:
Because onreadystatechange is used in IE, the Gecko,webkit browser and opera support onload. In fact this.readystate = = ' complete ' does not work well, the theoretical state of the change is the following steps:
0 uninitialized
1 loading
2 Loaded
3 Interactive
4 Complete
But some states will be skipped. Based on experience in IE7, only one of the loaded and completed can be obtained, and cannot all occur, perhaps because the judgment is not read from the cache affecting the state of the change, or it may be other reasons. Better to change the judging condition to this.readystate = = ' Loaded ' | | This.readystate = = ' complete '
JS dynamic loading CSS and JS