DOM
Manipuler des attributs
Recherche…
Remarques
Les attributs sont un type d'objet spécifique dans l'API DOM. Dans les versions antérieures de l'API DOM, ils ont hérité du type Node
, mais cela a été modifié dans la version 4.
Dans les exemples faisant référence à un dataset
de dataset
, les "navigateurs modernes" excluent spécifiquement les versions d'Internet Explorer inférieures à 11. Consultez caniuse.com pour plus d'informations à jour.
Obtenir un attribut
Certains attributs sont directement accessibles en tant que propriétés de l'élément (par exemple, alt
, href
, id
, title
et value
).
var a = document.querySelector("a"),
url = a.href;
D'autres attributs, y compris des attributs de données, sont accessibles comme suit:
var a = document.querySelector("a"),
tooltip = a.getAttribute("aria-label");
Les attributs de données peuvent également être accédés en utilisant le dataset
(navigateurs modernes)
// <a href="#" data-tracking-number="ABC-123">Widget</a>
var a = document.querySelector("a"),
tracker = a.dataset.trackingNumber;
Définition d'un attribut
Certains attributs sont directement accessibles en tant que propriétés de l'élément (par exemple, alt, href, id, title et value).
document.querySelector("a").href = "#top";
Les autres attributs, y compris les attributs de données, peuvent être définis comme suit:
document.querySelector("a").setAttribute("aria-label", "I like turtles");
Les attributs de données peuvent également être définis à l'aide du jeu de données (navigateurs modernes)
var a = document.querySelector("a");
a.dataset.test = "123";
a.dataset['test-2'] = "456";
résulte en
<a href="#" data-test="123" data-test-2="456">Widget</a>
Supprimer un attribut
Pour supprimer un attribut, y compris les propriétés directement accessibles
document.querySelector("a").removeAttribute("title");
Les attributs de données peuvent également être supprimés comme suit (navigateurs modernes):
// remove "data-foo" attribute
delete document.querySelector("a").dataset.foo;