これは確かに役立ちます
上記のリンクから、
jQueryがロードされる前にjQuery.readyコールバックをセットアップします
例えば
このように本体に jQuery があるとします。
<div id="main">
<script>
$(function(){
$("#main").prepend( "<p>Heyo!</p>" );
});
</script>
</div>
<div>...more HTML...</div>
<script src="/js/jquery.js"></script>
jQueryが一番下にロードされており、その前にそれを使用しようとしているため、うまくいきません。
そこで、この回避策を実行します。
<head>
<script>
(function(a){
_ready = {
q: function () {
return r;
}
};
$ = function (f) {
if (typeof f === "function") {
r.push(arguments);
}
return $;
};
jQuery=$.ready=$;
}([]));
</script>
</head>
<body>
<div id="main">
<script>
$(function() {
$( "#main" ).prepend( "<p>Heyo!</p>" );
});
</script>
<div>...more HTML...</div>
</div>
<script src="/js/jquery.js"></script>
<script>
(function( i, s, q, l ) {
for( q = window._ready.q(), l = q.length; i < l; ) {
$.apply( this, s.call( q[ i++ ] ) );
}
window._ready.q = undefined;
}( 0, Array.prototype.slice ));
</script>
<script src="/js/scripts.js"></script>
</body>
最初のスクリプトが行うことは、最初の引数が関数である $.ready への呼び出しの引数を配列に格納することにより、jQuery の ready 関数をエミュレートすることです。この配列は、グローバル スコープのメソッドに対してプライベート_ready.q
であり、呼び出されると配列を返します。
2 番目のスクリプトは、呼び出して配列をループ処理し_ready.q()
、偽の $.ready に最初に渡された引数を実際の $.ready に適用します。
PSは、空の配列が変数 name で渡される自己呼び出し関数ですr
。これを参照