Qu’est-ce que le DOM des documents HTML et XML ?
Une interface de programmation construite comme un arbre hiérarchique d’objets représentant toute la page.
Que représente l’objet Window dans le navigateur ?
La fenêtre du navigateur, à partir de laquelle le JavaScript s’exécute.
Quel objet de Window représente la page web et permet de modifier ses éléments HTML ?
L’objet Document.
Que reçoit getElementById et que retourne-t-il ?
Il reçoit un identifiant et retourne un seul élément.
Que reçoit getElementsByTagName et dans quel ordre retourne-t-il les éléments ?
Il reçoit un nom de balise et retourne les éléments correspondants dans l’ordre du document.
Que reçoit querySelector et quel élément retourne-t-il ?
Il reçoit un sélecteur CSS et retourne le premier élément correspondant.
Que retourne querySelectorAll et dans quel ordre ?
Il retourne tous les éléments correspondants dans l’ordre de l’arbre du DOM.
Que permettent de lire ou modifier innerHTML et outerHTML ?
Le contenu HTML d’un élément.
À quoi servent outerText, innerText et textContent ?
Au texte seul, sans interpréter les balises.
Comment lire ou modifier directement un attribut d’élément en JavaScript ?
Comme une propriété portant le nom de l’attribut.
Comment convertir une propriété CSS avec tiret en propriété JavaScript ?
Supprimer le tiret et mettre en majuscule la première lettre du mot suivant.
Quelles étapes permettent de créer puis d’ajouter un élément au DOM ?
Créer un nœud, lui ajouter éventuellement du texte, puis l’insérer.
Quels types de contenu `append()` peut-il ajouter ?
Des chaînes de caractères et plusieurs nœuds.
Qu’accepte `appendChild()` et que retourne-t-il ?
Un seul nœud à la fois, qu’il retourne comme objet ajouté.
Où append() ajoute-t-il un nœud ou du texte dans un élément ?
À la fin de l’élément.
Où prepend() ajoute-t-il un nœud ou du texte dans un élément ?
Au début de l’élément.
Que signifie « beforebegin » pour insertAdjacent...() ?
Avant l’élément.
Que signifie « afterbegin » pour insertAdjacent...() ?
Au début de l’élément.
Que signifie « beforeend » pour insertAdjacent...() ?
À la fin de l’élément.
Que fait la méthode JavaScript addEventListener ?
Elle attache un écouteur en recevant le type d’événement et une fonction callback à exécuter.
Que désigne event.target en JavaScript ?
L’élément où l’événement s’est produit.
Que désigne event.currentTarget en JavaScript ?
L’élément auquel le gestionnaire est attaché.
Quelles sont les deux phases de propagation d’un événement dans le DOM ?
La capture descend jusqu’à la cible, puis le bouillonnement remonte jusqu’à Window.
Quelle phase addEventListener écoute-t-il par défaut ?
La phase de bouillonnement.
Que provoque un événement sur un enfant pendant le bouillonnement ?
Il déclenche aussi les écouteurs attachés à ses parents.
Qu’arrête stopPropagation() dans l’arbre DOM ?
La propagation de l’événement.
Quelle référence removeEventListener() exige-t-il pour retirer un écouteur ?
La même référence de fonction que celle transmise à addEventListener.
Quelle propriété privilégier pour insérer du texte simple dans le DOM ?
textContent.
Quel risque évite-t-on en privilégiant textContent au texte utilisateur ?
Le risque de faille XSS.
Que peut représenter chaque nœud du DOM ?
Un élément, un attribut ou un texte.
Comment s’écrit implicitement un appel à alert dans Window ?
Quels éléments <html> contient-il dans l’arbre du DOM ?
<head> et <body>, suivis des éléments imbriqués dans l’ordre du HTML.
Que décrit Navigator dans le BOM ?
L’état et l’identité du navigateur utilisé.
Dans le BOM, que représente l’objet History du navigateur ?
L’historique du navigateur.
Que ciblent p, .exemple, p.exemple et #demo ?
Ils ciblent respectivement les paragraphes, la classe exemple, les paragraphes de cette classe et l’élément d’identifiant demo.
Quelle propriété globale le navigateur crée-t-il pour un élément HTML à id unique ?
Une propriété globale de window.
Pourquoi l’accès global aux éléments HTML par id est-il déconseillé ?
Un id peut compromettre une variable de code.
Comment manipuler l’attribut HTML `class` en JavaScript ?
Avec la propriété `className`.
Quelles méthodes de `classList` servent à ajouter ou retirer des classes CSS ?
`classList.add()` et `classList.remove()`.
Quelle propriété JavaScript correspond à `font-size` ?
`fontSize`.
Quelle propriété JavaScript correspond à `background-color` ?
`backgroundColor`.
Quelle propriété JavaScript correspond à `border-style` ?
`borderStyle`.
Quelle propriété JavaScript correspond à `font-weight` ?
`fontWeight`.
Que fait `createElement()` sans effectuer automatiquement ?
Il crée un nouvel élément sans l’ajouter à l’arbre du DOM.
Quelles informations `forEach` fournit-il à chaque tour ?
L’élément courant et sa position dans la liste, à partir de 0.
Quelle est la valeur de retour de `append()` ?
Aucune valeur de retour.
Où `prepend()` et `append()` insèrent-ils du contenu dans un nœud ?
`prepend()` avant le premier enfant et `append()` après le dernier.
Où insertBefore(nouveau, référence) insère-t-il le nouveau nœud ?
Juste avant l’enfant de référence.
Que permettent d’insérer insertAdjacentElement(), insertAdjacentHTML() et insertAdjacentText() ?
Un élément, du HTML et du texte, respectivement.
Comment removeChild() et remove() diffèrent-ils par l’élément sur lequel ils s’appellent ?
removeChild() s’appelle sur le parent, tandis que remove() s’appelle sur l’élément à supprimer.
Quels événements souris JavaScript correspondent aux actions décrites ?
click correspond au clic simple, dblclick au double-clic, mouseover à l’entrée, mouseout à la sortie, mousemove au déplacement, mousedown à la pression, mouseup au relâchement et contextmenu au clic droit.
Quelle méthode est recommandée pour attacher un gestionnaire d’événement en JavaScript ?
La méthode addEventListener est recommandée.
Que contient event.type en JavaScript ?
Le type de l’événement sous forme de chaîne.
Quelle option active l’écoute de la phase de capture avec addEventListener ?
L’option `{ capture: true }` passée comme dernier paramètre.
Qu’empêche preventDefault() pour un événement ?
Le comportement par défaut du navigateur associé à l’événement.
Quelle méthode d’écoute d’événements privilégier à l’attribut HTML onclick ?
addEventListener.
Quel avantage addEventListener offre-t-il pour les écouteurs d’un même élément ?
Il permet d’enregistrer plusieurs écouteurs.
Quelle fonction privilégier pour retirer un écouteur avec removeEventListener() ?
Une fonction nommée.
Que représente le BOM dans le navigateur ?
L’ensemble des objets exposés par Window qui représentent le navigateur lui-même, et non uniquement la page.
Quelles informations navigator fournit-il sur le navigateur ?
Son nom, sa version et sa langue.
Que représente l’objet location ?
L’URL courante.
Quelle propriété de location permet de rediriger la page ?
La propriété href.
Quelles méthodes de history permettent de naviguer dans l’historique ?
back() et forward().
Quelles fonctions Window affichent des dialogues ?
alert(), confirm() et prompt().
Quelles fonctions Window exécutent du code après un délai ?
setTimeout() et setInterval().
Que reçoit `getElementsByClassName` et dans quel ordre retourne-t-il les éléments correspondants ?
Un nom de classe ; les éléments correspondants dans leur ordre dans le document.
Teste tes connaissances avec un QCM de 20 questions sur DOM et manipulation des éléments.
1. Comment le DOM représente-t-il un document HTML ou XML ?
2. Dans un script exécuté par un navigateur, quel objet global représente la fenêtre du navigateur et sert de point de départ à l’exécution de JavaScript ?
Révisez le cours complet dans la fiche de révision de DOM et manipulation des éléments.
Voir la fiche →Importe ton cours et l'IA génère des flashcards en 30 secondes.
Générateur de flashcards