Node

Propriétés d'instance

En plus des propriétés ci-dessous, Node hérite des propriétés de son parent, EventTarget.

Node.baseURI Lecture seule

Retourne une chaîne de caractères représentant l'URL de base du document contenant le objet Node.

Node.childNodes Lecture seule

Retourne une liste de nœuds NodeList en direct contenant tous les enfants de ce nœud (y compris les éléments, texte et commentaires). Le fait que NodeList soit en direct signifie que si les enfants du Node changent, l'objet NodeList est automatiquement mis à jour.

Node.firstChild Lecture seule

Retourne un objet Node représentant le premier nœud enfant direct de l'actuel, ou null si le nœud n'a pas d'enfant.

Node.isConnected Lecture seule

Un booléen indiquant si le nœud est connecté ou non (directement ou indirectement) à l'objet contextuel, par exemple l'objet Document dans le cas du DOM normal, ou le ShadowRoot dans le cas d'un DOM fantôme (shadow DOM en anglais).

Node.lastChild Lecture seule

Retourne un objet Node représentant le dernier nœud enfant direct du nœud, ou null si le nœud n'a pas d'enfant.

Node.nextSibling Lecture seule

Retourne un objet Node représentant le nœud suivant dans l'arbre, ou null s'il n'y a pas de tel nœud.

Node.nodeName Lecture seule

Retourne une chaîne de caractères contenant le nom du objet Node. La structure du nom diffère selon le type de nœud. Par exemple, un HTMLElement contiendra le nom de la balise correspondante, comme 'AUDIO' pour un HTMLAudioElement, un nœud Text aura la chaîne '#text', ou un nœud Document aura la chaîne '#document'.

Node.nodeType Lecture seule

Retourne un unsigned short représentant le type du nœud. Les valeurs possibles sont :

Nom	Valeur
ELEMENT_NODE	1
ATTRIBUTE_NODE	2
TEXT_NODE	3
CDATA_SECTION_NODE	4
PROCESSING_INSTRUCTION_NODE	7
COMMENT_NODE	8
DOCUMENT_NODE	9
DOCUMENT_TYPE_NODE	10
DOCUMENT_FRAGMENT_NODE	11

Node.nodeValue

Retourne ou définit la valeur du nœud actuel.

Node.ownerDocument Lecture seule

Retourne l'interface Document à laquelle ce nœud appartient. Si le nœud est lui-même un document, retourne null.

Node.parentNode Lecture seule

Retourne un objet Node qui est le parent de ce nœud. S'il n'y a pas de tel nœud — par exemple, si ce nœud est au sommet de l'arbre, ou s'il ne participe pas à un arbre — cette propriété retourne null.

Node.parentElement Lecture seule

Retourne un objet Element qui est le parent de ce nœud. Si le nœud n'a pas de parent, ou si ce parent n'est pas un Element, cette propriété retourne null.

Node.previousSibling Lecture seule

Retourne un objet Node représentant le nœud précédent dans l'arbre, ou null s'il n'y a pas de tel nœud.

Node.textContent

Retourne ou définit le contenu textuel d'un élément et de tous ses descendants.

Méthodes d'instance

En plus des méthodes ci-dessous, Node hérite des méthodes de son parent, EventTarget.

Node.appendChild()

Ajoute l'argument childNode définit comme dernier enfant au nœud actuel. Si l'argument fait référence à un nœud existant sur l'arborescence DOM, le nœud sera détaché de sa position actuelle et attaché à la nouvelle position.

Node.cloneNode()

Clone un objet Node, et éventuellement, tout son contenu. Par défaut, cette méthode clone le contenu du nœud.

Node.compareDocumentPosition()

Compare la position du nœud actuel par rapport à un autre nœud dans tout autre document.

Node.contains()

Retourne une valeur true ou false indiquant si un nœud est ou non un descendant du nœud appelant.

Node.getRootNode()

Retourne la racine de l'objet contextuel qui comprend éventuellement la racine fantôme (shadow root en anglais) si elle est disponible.

Node.hasChildNodes()

Retourne un booléen indiquant si l'élément a ou non des nœuds enfants.

Node.insertBefore()

Insère un objet Node avant le nœud de référence, en tant qu'enfant d'un nœud parent définit.

Node.isDefaultNamespace()

Accepte une URI d'espace de noms comme argument et retourne un booléen avec la valeur true si l'espace de noms est l'espace de noms par défaut sur le nœud donné ou false dans le cas contraire.

Node.isEqualNode()

Retourne un booléen qui indique si oui ou non deux nœuds sont du même type et si tous leurs points de données de définition correspondent.

Node.isSameNode()

Retourne un booléen indiquant si oui ou non les deux nœuds sont identiques (c'est-à-dire qu'ils font référence au même objet).

Node.lookupPrefix()

Retourne une chaîne de caractères contenant le préfixe pour une URI d'espace de noms donnée, s'il est présent, ou null dans le cas contraire. Lorsque plusieurs préfixes sont possibles, le résultat dépend de l'implémentation.

Node.lookupNamespaceURI()

Accepte un préfixe et retourne l'URI d'espace de noms qui lui est associée sur le nœud donné si elle est trouvée (et null sinon). Fournir null pour le préfixe retournera l'espace de noms par défaut.

Node.normalize()

Nettoie tous les nœuds de texte sous cet élément (fusionne les adjacents, supprime les vides).

Node.removeChild()

Supprime un nœud enfant de l'élément actuel, qui doit être un enfant du nœud actuel.

Node.replaceChild()

Remplace un objet Node enfant du nœud actuel par le second donné en paramètre.

Événements

selectstart

Se déclenche quand l'utilisateur·ice commence une nouvelle sélection dans ce nœud.

Exemples

Supprimer tous les enfants imbriqués dans un nœud

Cette fonction supprime chaque premier enfant d'un élément, jusqu'à ce qu'il n'en reste aucun.

function removeAllChildren(element) {
  while (element.firstChild) {
    element.removeChild(element.firstChild);
  }
}

L'utilisation de cette fonction se fait en un seul appel. Ici, nous vidons le corps du document :

removeAllChildren(document.body);

Une alternative pourrait être de définir le textContent comme une chaîne de caractères vide : document.body.textContent = "".

Parcourir récursivement les nœuds enfants

La fonction suivante appelle récursivement une fonction de rappel pour chaque nœud contenu par un nœud racine (y compris la racine elle-même) :

function eachNode(rootNode, callback) {
  if (!callback) {
    const nodes = [];
    eachNode(rootNode, (node) => {
      nodes.push(node);
    });
    return nodes;
  }

  if (callback(rootNode) === false) {
    return false;
  }

  if (rootNode.hasChildNodes()) {
    for (const node of rootNode.childNodes) {
      if (eachNode(node, callback) === false) {
        return;
      }
    }
  }
}

La fonction appelle récursivement une fonction pour chaque nœud descendant de rootNode (y compris la racine elle-même).

Si callback est omis, la fonction retourne un tableau (Array) à la place, qui contient rootNode et tous les nœuds contenus à l'intérieur.

Si callback est fourni et qu'il retourne false quand il est appelé, le niveau de récursion actuel est interrompu, et la fonction reprend l'exécution au niveau du dernier parent. Ceci peut être utilisé pour interrompre les boucles une fois qu'un nœud a été trouvé (comme rechercher un nœud de texte qui contient une certaine chaîne de caractères).

La fonction a deux paramètres :

rootNode

L'objet Node dont les descendants seront parcourus récursivement.

callback Facultatif

Une fonction de rappel optionnelle qui reçoit un objet Node comme seul argument. Si elle est omise, eachNode retourne un tableau (Array) de tous les nœuds contenus dans rootNode (y compris la racine elle-même).

Ce qui suit démontre une utilisation concrète de la fonction eachNode() : rechercher du texte sur une page web.

Nous utilisons une fonction d'encapsulation nommée grep pour faire la recherche :

function grep(parentNode, pattern) {
  let matches = [];
  let endScan = false;

  eachNode(parentNode, (node) => {
    if (endScan) {
      return false;
    }

    // Ignore tout ce qui n'est pas un nœud de texte
    if (node.nodeType !== Node.TEXT_NODE) {
      return;
    }

    if (typeof pattern === "string" && node.textContent.includes(pattern)) {
      matches.push(node);
    } else if (pattern.test(node.textContent)) {
      if (!pattern.global) {
        endScan = true;
        matches = node;
      } else {
        matches.push(node);
      }
    }
  });

  return matches;
}

Spécifications

Compatibilité des navigateurs