Latest web development tutorials
×

JavaScript コース

JavaScript コース JavaScript 簡単な紹介 JavaScript 使用法 JavaScript 輸出 JavaScript 文法 JavaScript ステートメント JavaScript ノート JavaScript 変数 JavaScript データの種類 JavaScript オブジェクト JavaScript 関数 JavaScript スコープ JavaScript イベント JavaScript 文字列 JavaScript 演算子 JavaScript 比較します JavaScript If...Else JavaScript switch JavaScript for JavaScript while JavaScript Break & Continue JavaScript typeof JavaScript 型変換 JavaScript 正規表現 JavaScript エラー JavaScript デバッギング JavaScript 可変リフト JavaScript strictモード JavaScript 不適正使用 JavaScript フォーム認証 JavaScript 予約済みキーワード JavaScript JSON JavaScript void JavaScript コードの仕様

JS 関数

JavaScript 関数定義 JavaScript 関数の引数 JavaScript 関数呼び出し JavaScript クロージャ

JS HTML DOM

DOM 簡単な紹介 DOM HTML DOM CSS DOM イベント DOM EventListener DOM 要素

JS 応用チュートリアル

JavaScript オブジェクト JavaScript Number JavaScript String JavaScript Date JavaScript Array JavaScript Boolean JavaScript Math JavaScript RegExp オブジェクト

JS ブラウザ BOM

JavaScript Window JavaScript Window Screen JavaScript Window Location JavaScript Window History JavaScript Navigator JavaScript ポップ JavaScript 時間指定イベント JavaScript Cookies

JS 倉庫

JavaScript 倉庫 JavaScript テスト jQuery JavaScript テスト Prototype

JS 例

JavaScript 例 JavaScript Objectインスタンス JavaScript ブラウザのオブジェクトインスタンス JavaScript HTML DOM 例 JavaScript サマリー

JS リファレンスマニュアル

JavaScript オブジェクト HTML DOM オブジェクト

JavaScriptのイベント

HTMLイベントは、HTML要素のものに行われました。

HTMLページではJavaScriptを使用している場合、JavaScriptはこれらのイベントをトリガすることができます。


HTMLイベント

HTMLイベントは、ブラウザの動作は、ユーザの行動することができますすることができます。

HTMLイベントの例を以下に示します。

  • HTMLページがロードが完了します
  • ときに、HTML入力フィールドの変更
  • HTMLボタンがクリックされます

イベントが発生した場合、通常、あなたが何かを行うことができます。

イベントがトリガされるとJavaScriptは、いくつかのコードを実行することができます。

HTMLエレメントは、HTML要素を追加するJavaScriptコードを使用してイベント属性に追加することができます。

単一引用符:

<一部-HTML要素いくぶんイベント= 'いくつかのJavaScript'>

二重引用符:

<一部-HTML要素いくぶんイベント= "いくつかのJavaScript">

次の例では、ボタン要素はonclickの属性(プラスコード)を追加しました:

<ボタンのonclick = 'getElementByIdを( "デモ")。InnerHTMLの=日付()'>現在の時刻は?? </ button>のです

»をお試しください

上記の例では、JavaScriptコードのコンテンツID = "デモ"要素。

次の例では、コードは( この.innerHTMLを使用して要素自体の内容を変更します

<ボタンのonclick = "this.innerHTML =日付()">現在の時刻です?</ボタン>

»をお試しください

ノート JavaScriptコードは通常、数行のコードです。 より一般的にはイベントプロパティによって呼び出されます。

<ボタンのonclick = "displayDate()">現在の時刻です?</ボタン>

»をお試しください


共通のHTMLイベント

ここではいくつかの一般的なHTMLのイベントのリストです:

イベント 説明
onchange HTML要素の変更
onclickの HTML要素をユーザーがクリック
onmouseover属性 ユーザーがHTML要素上でマウスを動かします
れるonmouseout ユーザーがHTML要素からマウスを移動します
onkeydownを ユーザがキーを押します
onloadイベント ブラウザがページの読み込みが完了しました

もっとイベントリスト: JavaScriptのリファレンス- HTML DOMイベント


何をしてJavaScriptを行うことができますか?

イベントは、フォームの検証、ユーザ入力、ユーザーの行動やブラウザアクションを処理するために使用することができます。

  • イベントがトリガされたときに、ページのロードを
  • イベントがトリガされたときにページを閉じます
  • ユーザーがアクションを実行するボタンをクリックします
  • ユーザー入力の正当性を検証します
  • 以下のように...

あなたはJavaScriptイベントコードを実行するための様々な方法を使用することができます。

  • HTMLイベント属性は、直接JavaScriptコードを実行することができます
  • HTMLイベント属性はJavaScript関数を呼び出すことができます
  • あなたは、HTML要素のための独自のイベントハンドラを指定することができます
  • あなたは、イベントの発生を防止することができます。
  • 以下のように...
ノート HTML DOMの章では、イベントとイベントハンドラの知識についての詳細を学びます。