Maison  >  Article  >  interface Web  >  Explication détaillée des éléments et événements du DOM

Explication détaillée des éléments et événements du DOM

王林
王林avant
2020-05-25 17:55:072647parcourir

Explication détaillée des éléments et événements du DOM

Qu'est-ce qu'un événement ?

Les événements font référence aux actions de l'utilisateur ou à l'état d'un élément. L'élément spécifié écoute les événements pertinents et lie les gestionnaires d'événements.

Qu'est-ce qu'un gestionnaire d'événements ? L'élément

écoute les événements et effectue automatiquement des opérations lorsque l'événement se produit.

1. Classification des fonctions d'événement

1. Événement de souris

onclick //单击
ondblclick //双击
onmouseover //鼠标移入
onmouseout //鼠标移出
onmousemove //鼠标移动

2. Document ou élément chargé :

onload //元素或文档加载完毕

3. Surveillance de l'état du contrôle du formulaire :

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

2. Obtenez les nœuds d'élément

1 Obtenez la liste des nœuds d'élément en fonction du nom de l'étiquette

var elems = document.getElementsByTagName("");
/*参数 : 标签名
返回值 : 节点列表,需要从节点列表中获取具体的元素节点对象,添加相应下标。
*/
2 , Obtenez la liste des nœuds d'éléments en fonction de la valeur de l'attribut de classe

Explication détaillée des éléments et événements du DOM

3 Obtenez la liste des nœuds d'éléments en fonction de la valeur de l'attribut id

Explication détaillée des éléments et événements du DOM4. Obtenez la liste des éléments en fonction de la valeur de l'attribut name

Explication détaillée des éléments et événements du DOM

3. Méthode de liaison d'événement


1. Méthode en ligne : le nom de l'événement est lié à l'élément en tant qu'attribut d'étiquette

Exemple :

<button onclick="alert()">点击</button>

2. Liaison dynamique : obtenez le nœud de l'élément et ajoutez dynamiquement l'événement

Exemple :

btn.onclick = function (){
};

Tutoriel recommandé :

Tutoriel d'introduction à js

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Déclaration:
Cet article est reproduit dans:. en cas de violation, veuillez contacter admin@php.cn Supprimer