高性能Javascript【一】ロードと実行

function loadScript(url, callback){
var script = document.createElement("script")
script.type = "text/javascript";
if (script.readyState){  //IE
script.onreadystatechange = function(){
//ie下readyState的状态的值loaded和complete可能只会出现一个
if (script.readyState == "loaded" || script.readyState == "complete"){
//避免loaded和complete重复处理
script.onreadystatechange = null;
callback();
}
};
} else {  //Others
script.onload = function(){
callback();
};
}
script.src = url;
document.getElementsByTagName("head")[0].appendChild(script);
}
c)XMLHttpRequestスクリプト注入(ajax)
ダウンロード後はすぐに自動的に実行されませんが、ドメイン間では実行できません.
推奨事項:
タグを動的に作成する方法loadScript.
YUI 3、Lazyload、LABjsの作り方も参考にできます.
YUI3:http://developer.yahoo.com/yui/3/yui/
ユーザーによる定義済みファイルの動的ロード
YUI().use('animation', function(Y) {
// Y.Anim is available
});
Lazyload:https://github.com/rgrove/lazyload 
複数を同時にロードし、順番に実行できます.
LazyLoad.js(['foo.js', 'bar.js', 'baz.js'], function () {
alert('all files have been loaded');
});
//Load a CSS file and pass an argument to the callback function. 
LazyLoad.css('foo.css', function (arg) {
alert(arg);
}, 'foo.css has been loaded');
LABjs:http://labjs.com/
チェーン操作をサポートし、wait処理は依存または前後関係を実行します.
<script>
$LAB
.script("framework.js").wait()
.script("plugin.framework.js")
.script("myplugin.framework.js").wait()
.script("init.js").wait();
</script>
tips
埋め込まれたスクリプトをlinkから入ってきたスタイルファイルの後に置かないでください.そうすると、スクリプトはスタイルファイルのダウンロードが終わった後、ページが正確なスタイル情報を取得してからスクリプトを実行します.  
bodyセクションにscriptを追加すると、scriptのスクリプトがbodyを操作する可能性があり、bodyがロードされていない場合、「操作が終了しました」というエラーが発生するため、headにラベルを追加すると安全です.http://www.nczonline.net/blog/2008/03/17/the-dreaded-operation-aborted-error/  
本ではLazyloadがCssファイルをロードするのにあまり意味がないと言っていますが、その中のコールバック関数は、cssファイルのロードが完了した後にいくつかの操作を行う必要がある場合があります.