Retour à l'article

Gérez vos évènements avec addEventListener

Cibler un élément ayant un ID #

Avec getElementById()

Div 1
#Div ciblée
Div 3

Evènement détecté sur #div ciblée: Aucun événement détecté...
( clic, double clic, mouseover )

Méthode avec getElementsByClassName()

Div 1
Div 2
Div 3
Div 4
Div 5
Div 6
Div 7
Div 8
Div 9
Div 10

Div détectée: ...


querySelectorAll() - Travailler sur chaque élément

[0]
[1]
[2]
[3]
[4]

var element = document.querySelectorAll(".demo-block");

element[0].style.backgroundColor="#1CE8D3";
element[1].style.backgroundColor="#1CE8AA";
element[2].style.backgroundColor="#1CE881";
element[3].style.backgroundColor="#1CE855";
element[4].style.backgroundColor="#1CE82E";


querySelectorAll() - Parcourir les éléments ayant une même Classe

Div 1
Div 2
Div 3
Div 4
Div 5
Div 6
Div 7
Div 8
Div 9
Div 10

Div détectée: ...
Evènement: ...
Clickez pour connaitre l' Id de la div: ...