イベントトリガーの3つの要素：誰が？どのトリガーによって？トリガーの後に何をすべきか？
イベントの書き方：
w3c標準：イベントは行に書き込まれますが、構造と動作を分離する必要があるため、通常はJavaScriptを使用してイベントをバインドします。まれに、イベントが行に書き込まれます。
イベントバインディングメソッド：
browser.on + event handle = function（）{のノード（オブジェクト）
何をすべきか （ブラウザーに配置され、実行されず、イベントが発生したときに実行されます。）
}
例： oDiv.onclick = function（）{alert（1）}
イベントの概要：
イベントは、ブラウザの前処理関数を定義することです。イベントがトリガーされると、関数が実行されます。これがイベントです。
イベントタイプ：
イベントを書くときはいつでも書いてください
マウスイベント：
1. クリックイベント
oDiv.onclick = function））
2. イベントをダブルクリックします
oDiv.ondbclick = function））
3. 右マウスボタンイベント（コンテキストメニュー）
oDiv.oncontextmenu = function（）{
//コンテキストコンテキスト
//メニューメニュー}
4. マウスダウンイベント
oDiv.onmousedowm = function（）{
console.log（ 'press'）}
5. マウスアップイベント
oDiv.onmouseup = function（）{
console.log（ 'lift'）}
6.1 マウスイン
oDiv.onmouseover = function（）{
console.log（ 'マウスオーバー'）}
6.2 マウスが移動したが、子要素を横切ってもトリガーされない
oDiv.onmouseenter = function））{
console.log（ 'マウスを入力してください'）}
7.1 マウスアウト
oDiv.onmouseout = function））{
console.log（ 'マウスアウト'）}
7.2 マウスは外に出ますが、子要素と交差してもトリガーされません
oDiv.onmouseleave = function））{
console.log（ '休暇を取り消す'）}
8. マウス移動イベント
oDiv.onmousemove = function（）{
console.log（ 'mobile'）}
キーボードイベント：
var oInput = document.querySelector（'input'）
1. キーボードを押します
oInput.onKeydown = function（）{
console.log（ 'press'）}
2. キーボードが上がっている
oInput.onKeyup = function（）{
console.log（ 'lift'）}
3. キーボードタップ
oInput.onKeypress = function（）{
console.log（ 'keyboard strike'）}
このプレスイベントは、キーボードを持ち上げずに押し続けてもトリガーされます
フォームイベント：
単一選択、複数選択では、これらの要素をバインドするためのドロップダウンメニューは、一般的に変更を使用します
例：
フォーカスイベントを取得：フォーカス
oText.onfocus = function（）{console.log（ 'get the focus'）}
ロストフォーカスイベント：onblur
oText.onblur = function（）{console.log（ '失われたフォーカス'）
// value属性を使用してテキストボックスのコンテンツを取得します
console.log（this.value）}
フォーム送信イベント：フォームの外側のレイヤー全体に書き込みます
例：varo Form = document.querySelector（ '＃form'）
oForm.onsubmit = function（）{
//フォームが送信される前に何らかの処理を行います
//たとえば、テキストボックスにコンテンツがない場合、送信されません
if（oText.value === ''）{
//フォームの送信を許可しません。falseを返すと防止できます
falseを返す}
console.log（ '送信'）}
イベントイベント
イベントがトリガーされると、イベントに関連するいくつかのプロパティとメソッドのカプセル化を含むメッセージ（イベントオブジェクト）が表示されます（イベントの要素、キーボードキーの状態、マウスの位置、マウスボタンの状態など）。 、イベントがトリガーされた場合のみ。
oDiv.onmousedown = function（e）{
アラート（e）;}
JS 美徳の欠如：イベントオブジェクトの互換性の問題があります。
したがって、イベントオブジェクトを使用する前に、互換性を確保しましょう。
eが有効な場合はe自体、eが無効な場合はwindow.eventと同じ
e = e || window.event;
警告（e.buttons）は、.buttonsの戻り値を監視します。
マウスのイベントとメソッド。
| 属性名 |
意味 |
| e。ボタン |
マウスクリックボタンに戻る（左ボタン1、右ボタン2、中ボタンスクロールホイール4） |
| e.offsetX / offsetY |
イベントをトリガーしたボックス（イベントソース）の座標を取得する クリックが最小の要素のエッジの座標 |
| e.clientX / clientY |
表示領域の座標を取得します（ブラウザの配置に従って） 場所に関係なく、ブラウザの表示領域の端に固定されます |
| e.screenX / screenY |
画面全体の座標を取得 ブラウザの大きさに関係なく、画面全体の座標を取得します |
| e.pageX / e.pageY |
ドキュメントの座標を取得（スクロールバーを含む） |
キーボードのキーコードを取得する
キーボードの各キーには、ユーザーが現在操作しているキーボードのキーを識別する一意のコードがあります
互換性の問題がある
e.keyCode || e.which
特別なキーコード：Alt ctrlを押してシフトするかどうか
e.altKey
e.ctrlKey
e.shiftKey
戻り値はブール値です。
キーの組み合わせを判断するために使用できます
if（e.keyCode == 13 && e.altKey）{
警告（ 'Enterとaltが同時に押された））}
デフォルトの動作（ブラウザ）
タグなどのHTML要素にはデフォルトの動作がいくつかあり、クリック後にジャンプアクションがあります。フォームフォームの送信タイプの入力にはデフォルトの送信ジャンプイベントがあり、リセットタイプの入力にはフォームのリセット動作があります。ただし、デフォルトのイベントが不要な場合があるため、デフォルトのイベントを防止する必要があります
falseを返す;
デフォルトの動作を防ぐための互換性のある表現、デフォルトの動作を持つイベントのみがこれを記述する必要があります
さまざまなインシデントでは、さまざまなアクションがブロックされます。
if（e.preventDefault）{
e.preventDefault（）;
}そうしないと {
window.event.returnValue = false;
// falseを返す;}
エラーに焦点を合わせる：
未定義からクラスリストを読み取れません
Uncaught TypeError：未定義のプロパティ 'classList'を読み取れません