JavaScriptイベント
HTML イベントは、HTML 要素に対して発生するものです。
JavaScript を HTML ページで使用すると、これらのイベントをトリガーできます。
HTML イベント
HTML イベントは、ブラウザーのアクションまたはユーザーのアクションです。
以下は HTML イベントの例です:
HTML ページの読み込みが完了
HTML 入力フィールドが変更されました
HTML ボタンがクリックされました
通常、イベントが発生すると、何かを行うことができます。
JavaScript は、イベントがトリガーされたときに一部のコードを実行できます。
イベント属性は HTML 要素に追加でき、HTML 要素は JavaScript コードを使用して追加できます。
一重引用符:
<some-HTML-element some-event='some JavaScript'>
二重引用符:
<some-HTML-element some-event="some JavaScript"> ;
次の例では、onclick 属性 (およびコード) がボタン要素に追加されます:
Example
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>php中文网(php.cn)</title>
</head>
<body>
<button onclick="getElementById('demo').innerHTML=Date()">现在的时间是?</button>
<p id="demo"></p>
</body>
</html>上記の例では、JavaScript コードは id= のコンテンツを変更します。デモ」要素。
コードを実行して試してください
次のインスタンスでは、コードは独自の要素のコンテンツを変更します (this.innerHTML を使用):
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>php中文网(php.cn)</title> </head> <body> <button onclick="this.innerHTML=Date()">现在的时间是?</button> </body> </html>
コードを実行して試してください
ヒント: JavaScript コード通常は数行のコードです。より一般的なものはイベント属性を通じて呼び出されます：
commonHTMLイベント
一般的なHTMLイベントのリストです：eventdescription| onchange | html要素の変更 |
|---|---|
| onclick | ユーザーが HTML 要素をクリックします |
| onmouseover | ユーザーが HTML 要素の上にマウスを移動します |
| onmouseout | ユーザーがマウスを HTML 要素から遠ざける |
| onkeydown | ユーザーがキーボードのキーを押しました |
| onload | ブラウザはページの読み込みを完了しました |
JavaScript でできることは何ですか? イベントはフォームの検証、ユーザー入力、ユーザーの動作、ブラウザーのアクションを処理するために使用できます:
JavaScriptイベントコードを実行するには、複数のメソッドを使用できます:
|
