ホームページ > ウェブフロントエンド > jsチュートリアル > DOM 要素とイベントの詳細な説明

DOM 要素とイベントの詳細な説明

王林
リリース: 2020-05-25 17:55:07
転載
2751 人が閲覧しました

DOM 要素とイベントの詳細な説明

イベントとは何ですか?

イベントは、ユーザーのアクションまたは要素の状態を指します。指定された要素は、関連するイベントをリッスンし、イベント ハンドラーをバインドします。

イベント処理関数とは何ですか?

この要素はイベントをリッスンし、イベントが発生すると自動的に操作を実行します。

1. イベント関数の分類

1. マウス イベント

onclick //单击
ondblclick //双击
onmouseover //鼠标移入
onmouseout //鼠标移出
onmousemove //鼠标移动
ログイン後にコピー

2. ロードされたドキュメントまたは要素:

onload //元素或文档加载完毕
ログイン後にコピー

3. フォーム制御状態監視:

onfocus //文本框获取焦点
onblur //文本框失去焦点
oninput //实时监听输入
onchange //两次输入内容发生变化时触发,或元素状态改变时触发
onsubmit //form元素监听,点击提交按钮后触发,通过返回值控制数据是否可以发送给服务器
ログイン後にコピー

2. 要素ノードの取得

1. ラベル名

var elems = document.getElementsByTagName("");
/*参数 : 标签名
返回值 : 节点列表,需要从节点列表中获取具体的元素节点对象,添加相应下标。
*/
ログイン後にコピー
##から要素ノードリストを取得#2、class属性値に基づいて要素ノードリストを取得

DOM 要素とイベントの詳細な説明##3、id属性値に基づいて要素ノードリストを取得

DOM 要素とイベントの詳細な説明#4, name 属性値に基づいて要素リストを取得

DOM 要素とイベントの詳細な説明

3. イベントバインディングメソッド


1. インライン メソッド: イベント名がラベル属性として要素にバインドされます

例:

<button onclick="alert()">点击</button>
ログイン後にコピー

2. 動的バインディング: 要素ノードを取得し、イベントを動的に追加します

例:

btn.onclick = function (){
};
ログイン後にコピー

推奨チュートリアル:

js 入門チュートリアル

以上がDOM 要素とイベントの詳細な説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:cnblogs.com
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート