JavaScriptのイベント処理の変更点

追加された行はこの色です。
削除された行はこの色です。
JavaScriptのイベント処理へ行く。
JavaScriptのイベント処理の差分を削除

「[[.NET 開発基盤部会 Wiki>http://dotnetdevelopmentinfrastructure.osscons.jp]]」は、「[[Open棟梁Project>https://github.com/OpenTouryoProject/]]」,「[[OSSコンソーシアム .NET開発基盤部会>https://www.osscons.jp/dotNetDevelopmentInfrastructure/]]」によって運営されています。

-[[戻る>JavaScript]]

*目次 [#p190fedf]
#contents

*概要 [#g1ce1b86]
イベント処理は
-イベントリスナーにイベントハンドラ（delegate）を設定する。
-[[jQuery]]でも記述できる。

*初期処理 [#a4d8cbca]

**load [#c5a497c6]
loadイベントは以下のように記述できる。

-window.onloadを使う。
 window.onload = function() {
   // ・・・処理・・・
 };

-addEventListenerを使う。
 window.addEventListener("load", function() {
   // ・・・処理・・・
 }, false);

**ready [#ladf9363]
jQueryのreadyメソッドを使用する。

 $(document).ready(function () {
   // ・・・処理・・・
 });

-参考
--ready(fn) - jQuery 日本語リファレンス~
http://semooh.jp/jquery/api/events/ready/fn/

**比較 [#pf8630f0]
-[[load>#c5a497c6]]は、画像などのリソースのロードが済んだ時点、~
タグがロードされていないと処理できない初期処理はコチラで処理する。
-[[ready>#ladf9363]]はDOMロード後なのでonLoadより早いタイミングで動き出す。

-参考
--$(document).ready() と $(window).load() の違い | こととこネット~
http://blog.cototoco.net/work/201308/window-onload-%E3%81%A8jqurydocument-ready-%E3%81%AE%E9%81%95%E3%81%84/

*参考 [#yff6e559]
**JavaScript [#dae3a3f9]
-イベントリファレンス - Web 技術のリファレンス | MDN~
https://developer.mozilla.org/ja/docs/Web/Reference/Events
-EventTarget.addEventListener - Web API インターフェイス | MDN~
https://developer.mozilla.org/ja/docs/Web/API/EventTarget/addEventListener

**jQuery [#r9fbc3eb]
-Events - jQuery 日本語リファレンス~
http://semooh.jp/jquery/api/events/
-jQuery： イベントに応じて処理を実行するには？（イベントメソッド） - Build Insider~
http://www.buildinsider.net/web/jqueryref/015

JavaScriptのイベント処理 の変更点