ブラウザは DOM をロードした後、JavaScript を通じて DOM 要素にイベントを追加します。JavaScript では通常、window.onload() メソッドが使用されます。
jquery では、$(document).ready() メソッドを使用します。両者の違いを紹介しましょう。
|
window.onload() |
$(document).ready() |
実行タイミング |
ページのすべての要素 (画像や参照ファイルを含む) がロードされた後に実行されます。 |
|
window.onload() |
$(document).ready() |
执行时机 |
在页面所有元素(包括图片,引用文件)加载完后执行。 |
页面中所有HTML DOM,CSS DOM结构加载完之后就会执行,其他图片可能没有加载完.
如果想要网页所有内容(包括图片等)加载完毕,再注册事件,使用$(window).load(function);
等价于window.onload()
|
编写个数 |
不能同时写多个,后面的将会覆盖前面的。ex:
window.onload=function(){ alert("A"); }
window.onload=function(){ alert("B"); }
结果会执行“B”
如果想要顺序执行alert("A")和alert("B")需写成
window.onload=function(){
alert("A");
alert("B");
}
|
可以同时写多个 |
简写 |
无 |
$(document).ready(function(){
//to do;
});
可写成
$().ready(function(){ //$()不带参数默认是document
//to do;
});或
$(function(){
//to do;
});
|
ページ内のすべての HTML DOM 構造と CSS DOM 構造はロード後に実行されます。他の画像は読み込まれない場合があります。
イベントを登録する前に Web ページのすべてのコンテンツ (画像などを含む) をロードしたい場合は、$(window).load(function) を使用します。 ;
window.onload() と同等
|
書き込み番号 |
同時に複数の値を書き込むことはできません。後のもので前のものは上書きされます。例:
window.onload=function(){alert("A") }
window.onload=function(){alert("B") }
結果は「B」になります
alert("A")とalert("B")を連続して実行したい場合は、と記述する必要があります。
window.onload=function(){
alert("A");
alert("B");
}
|
同時に複数の書き込みが可能です |
略語 |
なし |
$(document).ready(function(){
//やるべきこと;
});
は として記述できます
$().ready(function(){ //パラメータなしの $() はデフォルトで document
//やるべきこと;
}) または
$(function(){
//やるべきこと;
});
|