オブジェクトの状態の変化は、 イベント 。 html には、ユーザーまたはブラウザーによって何らかのアクティビティが実行されたことを表すさまざまなイベントがあります。いつ JavaScript コードが HTML に含まれている場合、js はこれらのイベントに反応して実行を許可します。イベントに対して反応するこのプロセスは、 イベント処理 。したがって、js は HTML イベントを次のように処理します。 イベントハンドラ 。
例えば ユーザーがブラウザをクリックしたときに、イベントで実行されるタスクを実行する js コードを追加します。
HTML イベントとそのイベント ハンドラーの一部は次のとおりです。
マウスイベント:
| 実行されたイベント | イベントハンドラ | 説明 |
|---|---|---|
| クリック | クリック時 | 要素上でマウスをクリックしたとき |
| マウスオーバー | マウスオーバーで | マウスのカーソルが要素の上に来たとき |
| マウスアウト | オンマウスアウト | マウスのカーソルが要素から離れたとき |
| マウスダウン | オンマウスダウン | 要素上でマウスボタンを押したとき |
| マウスアップ | マウスアップ | 要素上でマウス ボタンを放したとき |
| マウスの移動 | マウス移動時 | マウスの移動が行われたとき。 |
キーボードイベント:
| 実行されたイベント | イベントハンドラ | 説明 |
|---|---|---|
| キーダウンとキーアップ | オンキーダウンとオンキーアップ | ユーザーがキーを押して放したとき |
フォームイベント:
| 実行されたイベント | イベントハンドラ | 説明 |
|---|---|---|
| 集中 | オンフォーカス | ユーザーが要素に注目したとき |
| 提出する | 送信時 | ユーザーがフォームを送信するとき |
| ぼかし | オンブラー | フォーカスがフォーム要素から離れた場合 |
| 変化 | 変更中 | ユーザーがフォーム要素の値を修正または変更するとき |
ウィンドウ/ドキュメントイベント
| 実行されたイベント | イベントハンドラ | 説明 |
|---|---|---|
| 負荷 | オンロード | ブラウザがページの読み込みを完了したとき |
| 降ろす | アンロード時 | 訪問者が現在の Web ページを離れると、ブラウザはその Web ページをアンロードします |
| サイズ変更 | サイズ変更中 | 訪問者がブラウザのウィンドウのサイズを変更したとき |
イベントとそのハンドラーに関するいくつかの例について説明します。
クリックイベント
Javascript Events今すぐテストしてください
MouseOverイベント
<p onmouseover="mouseoverevent()"> Keep cursor over me</p>今すぐテストしてください
フォーカスイベント
Javascript Events <h2> Enter something here</h2>今すぐテストしてください
キーダウンイベント
Javascript Events <h2> Enter something here</h2>今すぐテストしてください
ロードイベント
Javascript Events <br>今すぐテストしてください