DOM 基本チュートリアル イベントの種類_基礎知識
ユーザー イベント タイプの場合、最も一般的に使用されるのはマウス、キーボード、ブラウザです。
1. マウスイベント:
マウス イベントは頻繁に使用されます。次の例では、さまざまなマウス イベントをテストします。
<スクリプト言語="javascript">
関数ハンドル(oEvent) {
var disp = document.getElementById("display");
if(window.event)oevent = window.event; disp.innerHTML = "マウスイベント名:" oEvent.type "
";
}
window.onload = function() {
var oP = document.getElementById("box");
oP.onmousedown = ハンドル;
oP.onmouseover = ハンドル;
oP.onmouseup = ハンドル;
oP.onmouseout = ハンドル;
oP.onclick = ハンドル;
oP.ondblclick = ハンドル;
}
ボックスの内容
マウスキー値ボタンテスト(比較表付き)
oDiv.innerHTML = oEvent.button // ボタンの値を出力します
}
document.onmousedown = TestClick;
window.onload = TestClick //キーが押されていないことをテストします
2. キーボードイベント
キーボードイベントの種類は多くなく、3種類のみです。
キーダウン (キーを押したままにすると、連続的にトリガーされます)
keypress (キーが押されて文字が生成されるとトリガーされます。つまり、Shift、Alt、ctrl などのファンクション キーは無視されます)
keyup (キーが放されたときにトリガーされます)
キーボードモニタリングの例:
<スクリプト言語="javascript">
関数ハンドル(oEvent) {
If (window.event) oEvent = window.event // 処理の互換性、イベント オブジェクトを取得します
var oDiv = document.getElementById("display");
oDiv.innerHTML = oEvent.type " " //イベント名を出力します
; }
window.onload = function() {
var oTextArea = document.getElementById("textin");
oTextArea.onkeydown = handle; //すべてのキーボード イベントをリッスンします。 oTextArea.onkeyup = ハンドル;
oTextArea.onkeypress = ハンドル;
}
コードをコピー

ホットAIツール

Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。

Undress AI Tool
脱衣画像を無料で

Clothoff.io
AI衣類リムーバー

Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。

人気の記事

ホットツール

メモ帳++7.3.1
使いやすく無料のコードエディター

SublimeText3 中国語版
中国語版、とても使いやすい

ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境

ドリームウィーバー CS6
ビジュアル Web 開発ツール

SublimeText3 Mac版
神レベルのコード編集ソフト(SublimeText3)

ホットトピック









JavaScript は、Web ページ上のユーザーアクションと対話したり、ユーザーアクションに応答したりできるようにする幅広いイベントを提供します。これらのイベントの中で、キーボードとマウスのイベントが最もよく使用されます。この記事では、JavaScript のさまざまな種類のキーボード イベントとマウス イベントを見て、それらの使用方法の例を見ていきます。キーボード イベント キーボード イベントは、キーを押す、キーを離す、文字を入力するなど、ユーザーがキーボードを操作するときに発生します。キーボード イベントを使用すると、ユーザーがフォームに何かを正しく入力したかどうかを確認したり、特定のキーが押されたときに何かが起こったかどうかを確認したりするなど、いくつかの素晴らしいことを行うことができます。あたかもウェブサイトがユーザーが押すキーを聞いていて、それに応じて反応するかのようです。キーボード イベントは 3 種類に分類されます。 キーダウン イベント

DOM はドキュメント オブジェクト モデルであり、HTML プログラミング用のインターフェイスであり、ページ内の要素は DOM を通じて操作されます。 DOM は HTML ドキュメントのメモリ内オブジェクト表現であり、JavaScript を使用して Web ページと対話する方法を提供します。 DOM は、ドキュメント ノードをルートとするノードの階層 (またはツリー) です。

1. ネイティブ js は DOM ノードを取得します。 document.querySelector (セレクター) document.getElementById (id セレクター) document.getElementsByClassName (クラス セレクター).... 2. vue2 で現在のコンポーネントのインスタンス オブジェクトを取得します。コンポーネント インスタンスには、対応する DOM 要素またはコンポーネントへの参照を保存する $refs オブジェクトが含まれています。したがって、デフォルトでは、コンポーネントの $refs は空のオブジェクトを指します。まず ref="name" をコンポーネントに追加してから、this.$refs を渡します。

Vue3ref バインディング DOM またはコンポーネントの失敗理由分析シナリオの説明 Vue3 では、コンポーネントまたは DOM 要素をバインドするために ref を使用することがよくありますが、関連するコンポーネントをバインドするために ref が明確に使用されていることがよくありますが、ref バインディングが失敗することがよくあります。 ref バインディングが失敗する状況の例 ref バインディングが失敗するほとんどのケースは、ref がコンポーネントにバインドされているときにコンポーネントがまだレンダリングされていないため、バインディングが失敗することです。または、コンポーネントが最初にレンダリングされず、ref がバインドされていない場合、コンポーネントのレンダリングが開始されると、ref もバインドされ始めますが、ref とコンポーネントの間のバインディングが完了していません。このとき、問題が発生します。コンポーネント関連のメソッドを使用する場合。 ref にバインドされたコンポーネントが v-if を使用するか、その親コンポーネントが v-if を使用してページに

Web 開発において、DOM (DocumentObjectModel) は非常に重要な概念です。これにより、開発者は要素の追加、削除、変更など、Web ページの HTML または XML ドキュメントを簡単に変更および操作できるようになります。 PHP に組み込まれている DOM 操作ライブラリも開発者向けに豊富な機能を提供していますので、この記事では、皆様のお役に立てればと思い、PHP での DOM 操作ガイドを紹介します。 DOM の基本概念 DOM は、クロスプラットフォームで言語に依存しない API です。

DOM オブジェクトは「ドキュメント」、「要素」、「ノード」、「イベント」、「ウィンドウ」の 5 つ、2.「ウィンドウ」、「ナビゲーター」、「場所」、「履歴」、「画面」、その他 5 つです。 BOM オブジェクト。

BOM と DOM は、役割と機能、JavaScript との関係、相互依存性、さまざまなブラウザーの互換性、セキュリティ上の考慮事項の点で異なります。詳細な紹介: 1. 役割と機能: BOM の主な機能はブラウザ ウィンドウを操作することであり、ブラウザ ウィンドウへの直接アクセスと制御を提供しますが、DOM の主な機能は Web ドキュメントをオブジェクト ツリーに変換し、開発者は、このオブジェクト ツリーを使用して Web ページの要素やコンテンツを取得および変更します。 2. JavaScript などとの関係

dom内置オブジェクトの内容:1、document;2、window;3、navigator;4、location;5、history;6、screen;7、document.documentElement;8、document.body;9、document.head;10、document .title;11、document.cookie。
