jQuery-$（document）.readyと$（window）.loadの違いは何ですか？

違いは何ですか

$(document).ready(function(){
 //my code here
});

そして

$(window).load(function(){
  //my code here
});

そして、私はそれを確認したいと思います：

$(document).ready(function(){

}) 

そして

$(function(){

}); 

そして

jQuery(document).ready(function(){

});

同じだ。

それらの違いと類似点を教えていただけますか？

$(document).ready(function() {
  // executes when HTML-Document is loaded and DOM is ready
  console.log("document is ready");
});


$(window).load(function() {
  // executes when complete page is fully loaded, including all frames, objects and images
  console.log("window is loaded");
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

クエリ3.0バージョン

重大な変更：.load（）、. unload（）、および.error（）が削除されました

これらのメソッドはイベント操作のショートカットですが、いくつかのAPI制限がありました。イベント.load()メソッドがajax .load() メソッドと競合しました。.error()この方法は、一緒に使用することができなかったwindow.onerror ため、DOMメソッドが定義されている方法で。あなたはこれらの名前でイベントを添付する必要がある場合は、使用.on()方法、例えば変更 $("img").load(fn)するに$(img).on("load", fn)。¹

$(window).load(function() {});

に変更する必要があります

$(window).on('load', function (e) {})

これらはすべて同等です。

$(function(){
}); 

jQuery(document).ready(function(){
});

$(document).ready(function(){
});

$(document).on('ready', function(){
})

document.readyjQueryイベントであり、DOMの準備ができたときに実行されます。たとえば、すべての要素が検出/使用されますが、必ずしもすべてのコンテンツが含まれるわけではありません。
window.onload画像などが読み込まれたときに、後で（最悪の場合や失敗した場合は同時に）起動します。したがって、たとえば画像の寸法を使用している場合は、代わりにこれを使用することがよくあります。

関連する質問も読んでください：
$（window）.load（）関数と$（document）.ready（）関数の違い

jQueryのAPIドキュメント

JavaScriptは、loadページがレンダリングされるときにコードを実行するためのイベントを提供しますが、このイベントは、画像などのすべてのアセットが完全に受信されるまでトリガーされません。ほとんどの場合、DOM階層が完全に構築されるとすぐにスクリプトを実行できます。に渡されたハンドラーは.ready()、DOMの準備ができた後に実行されることが保証されているため、通常、これは他のすべてのイベントハンドラーを接続して他のjQueryコードを実行するのに最適な場所です。CSSスタイルプロパティの値に依存するスクリプトを使用する場合は、スクリプトを参照する前に、外部スタイルシートを参照するか、スタイル要素を埋め込むことが重要です。

コードが読み込まれたアセットに依存している場合（たとえば、画像のサイズが必要な場合）、コードはload代わりにイベントのハンドラーに配置する必要があります。

2番目の質問への回答-

いいえ、競合なしモードでjQueryを使用しない限り、それらは同じです。

この3つの機能は同じです。

$(document).ready(function(){

}) 

そして

$(function(){

}); 

そして

jQuery(document).ready(function(){

});

ここで$は=のjQueryような定義に使用されます。$jQuery

今の違いは

$(document).readyがDOM読み込まれたときに発生するjQueryイベントなので、ドキュメント構造の準備ができると発生します。

$(window).load 画像が含まれているページのようにコンテンツ全体が読み込まれた後、イベントが発生します。

$(document).ready()と$(window).load()関数の違いは、$(window).load()ページ全体（画像、iframe、スタイルシートなど）が読み込まれると、内部に含まれるコードが実行されるのに対し、すべての画像、iframeなどが読み込まれる前に、DOM自体全体の後でドキュメント準備イベントが発生することです。準備ができています。

$(document).ready(function(){

}) 

そして

$(function(){

});

そして

jQuery(document).ready(function(){

});

上記3つのコードに違いはありません。

これらは同等ですが、他のJavaScriptフレームワークが同じドル記号$をショートカット名として使用している場合、競合が発生する可能性があります。

jQuery.noConflict();
jQuery.ready(function($){
 //Code using $ as alias to jQuery
});

準備完了イベントは常に、HTMLページがブラウザーに読み込まれ、関数が実行されるときに常に実行されます。ただし、ロードイベントは、ページのすべてのコンテンツがブラウザーに読み込まれたときに実行されます... .. jqueryスクリプトでnoconflict（）メソッドを使用する場合、$またはjQueryを使用できます...

$(document).ready(function(e) { 
    // executes when HTML-Document is loaded and DOM is ready  
    console.log("page is loading now"); 
});

$(document).load(function(e) { 
    //when html page complete loaded
    console.log("completely loaded"); 
});

$（window）.loadは、DOMとページ上のすべてのコンテンツ（すべて）がCSS、画像、フレームのように完全に読み込まれたときに発生するイベントです。最良の例の1つは、実際の画像サイズを取得する場合、または使用するすべての詳細を取得する場合です。

$（document）.ready（）は、DOMが読み込まれ、スクリプトで操作できるようになったら、コードを実行する必要があることを示しています。jQueryスクリプトを実行するために画像が読み込まれるのを待ちません。

<script type = "text/javascript">
    //$(window).load was deprecated in 1.8, and removed in jquery 3.0
    // $(window).load(function() {
    //     alert("$(window).load fired");
    // });

    $(document).ready(function() {
        alert("$(document).ready fired");
    });
</script>

$（window）.loadが$（document）.ready（）の後に起動されました

$(document).ready(function(){

}) 
//and 
$(function(){

}); 
//and
jQuery(document).ready(function(){

});

上記の3つは同じです。$はjQueryのエイリアス名です。他のJavaScriptフレームワークが同じドル記号$を使用すると、競合が発生する可能性があります。uは競合jQueryのチームに直面した場合のソリューションを提供していない無競合続きを読みます。

$（window）.loadは1.8で廃止され、jquery 3.0で削除されました