$(document).ready()メソッドVS window.onload VS $(window).load()およびloadイベントの詳細

今日1つの問題を発見して、ページを修正する時、1つのボタンに対して条件の表示あるいは隠すことができなくて、同僚はsettimeoutで解決しました.しかし、settimeoutはやむを得ない時にしか使えないと思っています.
分析によると、この表示または非表示のボタンはincludeから入ってきたのでwindowを使います.onloadは解決して、後で資料を調べてそれと$(window)を発見します.load()メソッドは等価で、ページのすべてのコンテンツがロードされるまでトリガーされません.今window.onload、$(document).readyの2つの方法を簡単に比較します.
1.実行タイミングwindow.onload:ページ内のすべてのコンテンツのロードが完了するまで(画像を含む)$(document)を実行する必要があります.ready:ページ内のすべてのDOM構造の描画が完了すると実行され、DOM要素に関連付けられたものがロードされていない可能性があります.
2.個数1)を記述する.window.onload:次のコードを複数同時に作成できません.正しく実行できません.

   window.onload = function() {
    alert("test1")
   };
   window.onload = function() {
    alert("test2")
   };

結果は「test 2」のみ出力されます
説明:window.onloadは、2つのメソッドが順次トリガーされる結果を達成するために、以下に示すように、新しいJavaScriptメソッドを作成するしかありません.

function one() {
 alert("test1");
}
function two() {
 alert("test2");
}
window.onload=function() {
  one();
  two();
}

     2).$(document).ready:次のコードが正しく実行されます.

$(document).ready(function() {
   alert("Hello World!");
});
$(document).ready(fcuntion() {
   alert("Hello again!");
});

結果は2回とも出力されます
3.書き方を簡略化する1).window.onload:2なし.$(document).ready:

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

以下のように簡単に書くことができます.

$(function() {
    //...
});

また、$(document)にあるため注意が必要である.ready()メソッドに登録されているイベントは、DOMが準備完了すると実行されるため、要素の関連ファイルがダウンロードされない可能性があります.例えば、画像に関するHTMLのダウンロードが完了し、DOMツリーとして解析されているが、まだ画像のロードが完了していない可能性が高い(私の問題では、includeのファイルはまだロードされていない)ため、例えば画像の高さや幅のような属性はこの場合必ずしも有効ではない.この問題を解決するには、jQueryのページロードに関する別の方法であるloadメソッドを使用します.load()メソッドは、要素のonloadイベントに処理メソッドをバインドします.処理方法がwindowオブジェクトにバインドされている場合、ウィンドウ、フレーム、オブジェクト、画像などを含むすべてのコンテンツがロードされた後にトリガーされ、処理方法が要素にバインドされている場合、要素のコンテンツがロードされた後にトリガーされます.したがって

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

に等しい

window.onload = function() {
 //...
}

  
もちろん、エレメントにバインドされている場合は、エレメントのコンテンツのロードが完了するとトリガーされます.
注意:この要素が完全にロードされる前にloadの処理関数をバインドすると、ロードが完了した後にトリガーされます.後でバインドすると永遠にトリガーされません.だから$(document)にいないでください.ready()では、jQueryがすべてのDOMロードが完了した後にloadイベントをバインドするため、loadイベントをバインドします.
loadメソッドを呼び出す完全なフォーマットは、load( url, [data], [callback] )です. :

        url： 。
        data： ； Load html ， ， PHP ， ， 。
        callback： ； load ， 。

1. data

1）. php ， php

$("#myID").load("test.php");
// id #myID      test.php      

2）. php ， php

$("#myID").load("test.php",{"name" : "Adam"});
//   php          ，   ：test.php?name=Adam

 3）. php ， php 。 ：

$("#myID").load("test.php",{"name" : "Adam" ，"site":"61dh.com"});
//   php          ，   ：test.php?name=Adam&site=61dh.com

  4）. php ， php  

$("#myID").load("test.php",{'myinfo[]', ["Adam", "61dh.com"]});
//   php            。

： load， POST ， test.php ， GET 。 

2. callback

load ， ， callback 。 ：

$("#go").click(function(){
  $("#myID").load("welcome.php", {"lname" : "Cai", "fname" : "Adam", function(){
    $("#myID").fadeIn('slow');}
  );
});

  

：
load url 。
：$("body").load("test.html #a");