jQueryの「$(document).ready(function()」と「$(window).load(function()」には、違いがあります。
$(document).ready(function(){}) の省略系として、$(function(){})と言う書き方もあります。
順序でいえば、$(document).ready() が先に実行されて、$(window).load() の方が後に実行される事になります。
ready()は「jQueryイベント」であり、loadは生JavaScriptの「JavaScriptイベント」であり、
ready()は「DOM要素の準備が完了した時」に呼び出され、loadは「onloadに相当する」みたいです。
DOMは「Document Object Model」の略語です。xmlやhtmlの各要素、たとえば<p>とか<img>とかの種類の要素にアクセスする仕組みのことです。
ready()メソッド DOMツリーの構築が完了した時点で処理を実行する。$(document).ready(function()の場合、documentのDOM要素が完了する(=htmlの終了タグが読み込まれる)時に呼び出されます。$(“body”).readyだと、bodyタグが終わったら実行されます。
load()メソッド(onloadイベント) DOMツリーの構築だけでなく、画像などの関連データの読み込みが完了しないと処理されません。 window.onload = function() 最後の記述のみ実行されます。
今回使用したjquery.min.jsは、ver2.0.3です。
↓以下が実験のソースサンプルです。
▼JavaScript
<script type="text/javascript" src="jquery.min.js"></script>
▼HTML
<br />
<script type="text/javascript">// <![CDATA[
$(window).load( function() { alert('load1') });
$(window).load( function() { alert('load2') });
window.onload = function(){alert('onload function');}
$(document).ready( function(){alert('ready');});
$(function(){alert('function');});
// ]]></script>
<br />
今回、参考にさせていただいたのは、
『$(document).ready() と $(window).load() の違い』です。
ありがとうございます。
