Cheatography
https://cheatography.com
DOM methods with JavaScript
This is a draft cheat sheet. It is a work in progress and is not finished yet.
Sélection des éléments
getElementById(id) |
Récupère un élément du DOM en utilisant son ID. |
getElementsByClassName(className) |
Récupère une liste d'éléments du DOM qui ont la classe spécifiée. |
getElementsByTagName(tagName) |
Récupère une liste d'éléments du DOM qui ont le nom de balise spécifié. |
querySelector(selector) |
Récupère le premier élément du DOM qui correspond au sélecteur CSS spécifié. |
querySelectorAll(selector) |
Récupère tous les éléments du DOM qui correspondent au sélecteur CSS spécifié. |
Modification des attributs et des classes
setAttribute(name, value) |
Définit la valeur d'un attribut sur un élément du DOM |
getAttribute(name) |
Récupère la valeur d'un attribut spécifié d'un élément du DOM |
classList.add(className) |
Ajoute une classe CSS à la liste des classes d'un élément du DOM |
classList.remove(className) |
Supprime une classe CSS de la liste des classes d'un élément du DOM |
classList.toggle(className) |
Ajoute une classe CSS si elle n'est pas déjà présente et la supprime si elle est présente |
|
|
Manipulation de la structure
createElement(tagName) |
Crée un nouvel élément du DOM avec le nom de balise spécifié. |
appendChild(node) |
Ajoute un nœud (élément, texte, etc.) en tant que dernier enfant d'un nœud parent. |
removeChild(node) |
Supprime un nœud enfant d'un nœud parent. |
insertAdjacentElement(position, newElement) |
permet d'insérer un nouvel élément (fourni en tant que paramètre) à une position spécifique par rapport à un élément existant dans le DOM |
position : valeurs possibles |
'beforebegin', 'afterbegin', 'beforeend', 'afterend' |
Gestion des événements
addEventListener(event, handler) |
Ajoute un gestionnaire d'événements à un élément du DOM pour écouter un événement spécifié |
removeEventListener(event, handler) |
Supprime un gestionnaire d'événements précédemment ajouté à un élément du DOM |
Manipulation du contenu
innerHTML |
Permet de récupérer ou définir le contenu HTML d'un élément |
innerText |
Récupère ou défini le texte visible contenu dans un élément, avec les balises HTML ignorées |
textContent |
Récupère ou défini le contenu texte de l'élément et de tous ses descendants, avec les balises HTML en tant que texte brut |
|
