Méthodes HTML-DOM


Les méthodes sont des actions que nous pouvons effectuer sur des nœuds (éléments HTML).

Interface de programmation

permet d'accéder au DOM HTML via JavaScript (et d'autres langages de programmation).

Tous les éléments HTML sont définis comme des objets et les interfaces de programmation sont des méthodes objet et des propriétés d'objet.

Les méthodes sont des actions que vous pouvez effectuer (telles que l'ajout ou la modification d'éléments).

Les propriétés sont des valeurs que vous pouvez obtenir ou définir (comme le nom ou le contenu d'un nœud).

Méthode getElementById()

La méthode getElementById() renvoie l'élément avec l'ID spécifié :

Instance

<html><!DOCTYPE html>
<html>
<body>

<p id="intro">Hello World!</p>
<p>This example demonstrates the <b>getElementById</b> method!</p>

<script>
x=document.getElementById("intro");
document.write("<p>The text from the intro paragraph: " + x.innerHTML + "</p>");
</script>

</body>
</html>

Exécuter l'instance»

Cliquez sur le bouton "Exécuter l'instance" pour afficher l'instance en ligne

Objet HTML DOM - Méthodes et propriétés

Certaines méthodes HTML DOM couramment utilisées :

  • getElementById(id) - Récupère le nœud avec l'identifiant spécifié (element)

  • appendChild(node) - Insérer un nouveau nœud enfant (element)

  • removeChild(node) - Supprimer un nœud enfant ( élément) )

Certains attributs HTML DOM couramment utilisés :

  • innerHTML - valeur texte du nœud (élément)

  • parentNode - le nœud parent du nœud (élément)

  • childNodes - le nœud enfant du nœud (élément)

  • attributes - le nœud d'attribut du nœud (élément)

Vous en apprendrez plus sur les attributs dans le prochain chapitre de ce tutoriel.

Les objets dans la vraie vie

Une personne est un objet.

Les méthodes humaines peuvent être eat(), sleep(), work(), play(), etc.

Tous ont ces méthodes mais les exécutent à des moments différents.

Les attributs d'une personne incluent le nom, la taille, le poids, l'âge, le sexe, etc.

Tous les humains possèdent ces attributs, mais leurs valeurs varient d'une personne à l'autre.

Quelques méthodes d'objet DOM

Voici quelques méthodes courantes que vous apprendrez dans ce tutoriel :

方法描述
getElementById()返回带有指定 ID 的元素。
getElementsByTagName()返回包含带有指定标签名称的所有元素的节点列表（集合/节点数组）。
getElementsByClassName()返回包含带有指定类名的所有元素的节点列表。
appendChild()把新的子节点添加到指定节点。
removeChild()删除子节点。
replaceChild()替换子节点。
insertBefore()在指定的子节点前面插入新的子节点。
createAttribute()创建属性节点。
createElement()创建元素节点。
createTextNode()创建文本节点。
getAttribute()返回指定的属性值。
setAttribute()把指定属性设置或修改为指定的值。