さて、JSONを使用して、ロード中のjquery全体をフォールバックで評価する小さなオブジェクトを作成しました(実際、すべてのjsファイルをロードするためにそれを使用しました)。
<script type="text/javascript">
/* Library loading object */
var ScriptLoader = {
//values
head_tag : document.getElementsByTagName('head')[0],
fallback : false,
//functions
createScript: function(script_path) {
var script_tag = document.createElement('script');
script_tag.type = 'text/javascript';
script_tag.src = script_path;
return script_tag;
},
addToHead : function(tag) {
ScriptLoader.head_tag.appendChild(tag);
},
addLoadEvent : function(func) {
var prev = window.onload;
if (typeof window.onload !== 'function') {
window.onload = func;
} else {
window.onload = function() {
prev();
func();
}
}
}
};
//Loading jquery, modernizr, and my js files when window is ready.
ScriptLoader.addLoadEvent(function() {
/* Load from jquery's cdn for speed + auto latest download */
var scripts = ['http://code.jquery.com/jquery-latest.min.js',
'scripts/modernizr.js',
'scripts/script.js'],
idx = 0;
for (; idx < scripts.length; idx++) {
ScriptLoader.addToHead(ScriptLoader.createScript(scripts[idx]));
}
});
//jquery fallback
ScriptLoader.addLoadEvent(function() {
if (typeof window.jQuery === undefined) {
ScriptLoader.fallback = true;
ScriptLoader.addToHead(ScriptLoader.createScript('scripts/jquery-mini-1.6.2.js'));
}
});
//grab info
(function() {
setTimeout(function() {
console.log('jquery loaded: ' + (window.jQuery !== undefined));
console.log('used fallback: ' + ScriptLoader.fallback);
}, 1000);
})();
現在、これは完全に機能していますが、オブジェクトの名前が頻繁に呼び出されていることに気付きましたか? その代わりにこれを単に使用する方法はありますか?私は機能レベルのスコープ全体を取得し、これが最も近い囲み機能に割り当てられることも認識していますが、それについては明確ではありません..
私も簡単に読んでいますが、クロージャを完全には理解していません..
ありがとう :)