From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- files/fr/web/api/domtokenlist/add/index.html | 79 +++++++++++++++ files/fr/web/api/domtokenlist/contains/index.html | 78 +++++++++++++++ files/fr/web/api/domtokenlist/entries/index.html | 72 +++++++++++++ files/fr/web/api/domtokenlist/foreach/index.html | 98 ++++++++++++++++++ files/fr/web/api/domtokenlist/index.html | 117 ++++++++++++++++++++++ files/fr/web/api/domtokenlist/item/index.html | 73 ++++++++++++++ files/fr/web/api/domtokenlist/keys/index.html | 76 ++++++++++++++ files/fr/web/api/domtokenlist/length/index.html | 68 +++++++++++++ files/fr/web/api/domtokenlist/remove/index.html | 85 ++++++++++++++++ files/fr/web/api/domtokenlist/replace/index.html | 80 +++++++++++++++ files/fr/web/api/domtokenlist/supports/index.html | 66 ++++++++++++ files/fr/web/api/domtokenlist/toggle/index.html | 82 +++++++++++++++ files/fr/web/api/domtokenlist/value/index.html | 65 ++++++++++++ files/fr/web/api/domtokenlist/values/index.html | 74 ++++++++++++++ 14 files changed, 1113 insertions(+) create mode 100644 files/fr/web/api/domtokenlist/add/index.html create mode 100644 files/fr/web/api/domtokenlist/contains/index.html create mode 100644 files/fr/web/api/domtokenlist/entries/index.html create mode 100644 files/fr/web/api/domtokenlist/foreach/index.html create mode 100644 files/fr/web/api/domtokenlist/index.html create mode 100644 files/fr/web/api/domtokenlist/item/index.html create mode 100644 files/fr/web/api/domtokenlist/keys/index.html create mode 100644 files/fr/web/api/domtokenlist/length/index.html create mode 100644 files/fr/web/api/domtokenlist/remove/index.html create mode 100644 files/fr/web/api/domtokenlist/replace/index.html create mode 100644 files/fr/web/api/domtokenlist/supports/index.html create mode 100644 files/fr/web/api/domtokenlist/toggle/index.html create mode 100644 files/fr/web/api/domtokenlist/value/index.html create mode 100644 files/fr/web/api/domtokenlist/values/index.html (limited to 'files/fr/web/api/domtokenlist') diff --git a/files/fr/web/api/domtokenlist/add/index.html b/files/fr/web/api/domtokenlist/add/index.html new file mode 100644 index 0000000000..472030ca72 --- /dev/null +++ b/files/fr/web/api/domtokenlist/add/index.html @@ -0,0 +1,79 @@ +--- +title: DOMTokenList.add() +slug: Web/API/DOMTokenList/add +tags: + - API + - Ajout + - Chaînes de caractères + - DOM + - Listes + - Méthodes +translation_of: Web/API/DOMTokenList/add +--- +

{{APIRef("DOM")}}

+ +

La méthode add() de l'interface {{domxref("DOMTokenList")}} ajoute  le token (marque) à la liste.

+ +

Syntaxe

+ +
tokenList.add(token1[, token2[, ...]]);
+ +

Paramètres

+ +
+
token
+
Une {{domxref("DOMString")}} (chaîne de caractères) représentant la marque (token) que vous souhaitez ajouter à la liste.
+
+ +

Valeur renvoyée

+ +

Vide.

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons une liste des classes définies sur un élément {{htmlelement("span")}} en tant que DOMTokenList, en utilisant {{domxref("Element.classList")}}. Nous ajoutons alors une nouvelle marque à la  liste et écrivons la liste dans un  {{domxref("Node.textContent")}} du <span>.

+ +

Tout d'abord, le code HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant, le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+classes.add("d");
+span.textContent = classes;
+
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Vous pouvez ajouter plusieurs token :

+ +
span.classList.add("d", "e", "f");
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#dom-domtokenlist-add','add()')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.add")}}
+ +
 
+ +
 
diff --git a/files/fr/web/api/domtokenlist/contains/index.html b/files/fr/web/api/domtokenlist/contains/index.html new file mode 100644 index 0000000000..282e4743b2 --- /dev/null +++ b/files/fr/web/api/domtokenlist/contains/index.html @@ -0,0 +1,78 @@ +--- +title: DOMTokenList.contains() +slug: Web/API/DOMTokenList/contains +tags: + - API + - Chaînes de caractères + - DOM + - Listes + - Méthodes + - Recherche contenu +translation_of: Web/API/DOMTokenList/contains +--- +

{{APIRef("DOM")}}

+ +

La méthode contains() de l'interface {{domxref("DOMTokenList")}} renvoie un {{domxref("Boolean")}} (booléen) — true (vrai) si la liste sous-jacente contient le symbole donné, sinon false (faux).

+ +

Syntaxe

+ +
tokenList.contains(token);
+ +

Paramètres

+ +
+
token
+
Une {{domxref("DOMString")}} (chaîne de caractères) représentant la "token" (marque) dont vous voulez vérifier l'existence dans la liste.
+
+ +

Valeur renvoyée

+ +

Un {{domxref("Boolean")}} (booléen)— true (vrai) si la liste sous-jacente contient la marque donnée, sinon false (faux).

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies sur un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Nous testons ensuite l'existence de "c" dans la liste, et écrivons le résultat dans le {{domxref("Node.textContent")}} du <span>.

+ +

Tout d'abord, le code HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant, le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+var result = classes.contains("c");
+if(result) {
+  span.textContent = "The classList contains 'c'";
+} else {
+   span.textContent = "The classList does not contain 'c'";
+}
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#dom-domtokenlist-contains','contains()')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.contains")}}
+ +
 
+ +

 

diff --git a/files/fr/web/api/domtokenlist/entries/index.html b/files/fr/web/api/domtokenlist/entries/index.html new file mode 100644 index 0000000000..8e8527b904 --- /dev/null +++ b/files/fr/web/api/domtokenlist/entries/index.html @@ -0,0 +1,72 @@ +--- +title: DOMTokenList.entries() +slug: Web/API/DOMTokenList/entries +tags: + - API + - Chaînes de caractères + - DOM + - Itérateurs + - Listes + - Méthodes +translation_of: Web/API/DOMTokenList/entries +--- +
{{APIRef("DOM")}}
+ +

La méthode DOMTokenList.entries() renvoie un {{jsxref("Les_protocoles_iteration",'itérateur')}} permettant de parcourir toutes les paires clé / valeur contenues dans cet objet. Les valeurs sont des objets {{domxref("DOMString")}} (chaînes de caractères), chacun représentant une seule marque.

+ +

Syntaxe

+ +
tokenList.entries();
+ +

Valeur retournée

+ +

Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies sur un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Nous récupérons un itérateur contenant les paires clé / valeur en utilisant entries(), puis parcourons chacune d'entre elles en utilisant une boucle for ... of , et les écrivons dans un  {{domxref("Node.textContent")}}  du <span>.

+ +

D'abord le HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+var iterator = classes.entries();
+
+for(var value of iterator) {
+  span.textContent += value + ' ++ ';
+}
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#interface-domtokenlist','entries() (as iterable<Node>)')}}{{Spec2('DOM WHATWG')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.entries")}}
+ +

Voir aussi

+ + diff --git a/files/fr/web/api/domtokenlist/foreach/index.html b/files/fr/web/api/domtokenlist/foreach/index.html new file mode 100644 index 0000000000..a472bdc26d --- /dev/null +++ b/files/fr/web/api/domtokenlist/foreach/index.html @@ -0,0 +1,98 @@ +--- +title: DOMTokenList.forEach() +slug: Web/API/DOMTokenList/forEach +tags: + - API + - Boucle + - Chaînes de caractères + - DOM + - Itérateurs + - Méthodes + - Pour chaque +translation_of: Web/API/DOMTokenList/forEach +--- +

{{APIRef("DOM")}}

+ +

La méthode forEach() de l'interface {{domxref("DOMTokenList")}} appelle le retour donné en paramètre, un pour chaque paire de valeurs dans la liste, dans l'ordre d'insertion.

+ +

Syntaxe

+ +
tokenList.forEach(callback);
+tokenList.forEach(callback, argument);
+
+ +

Paramètres

+ +
+
callback
+
Fonction à exécuter pour chaque élément, prenant éventuellement 3 arguments : +
+
currentValue
+
L'élément en cours de traitement dans le tableau.
+
currentIndex
+
L'index de l'élément en cours de traitement dans le tableau.
+
listObj
+
Le tableau que forEach() est en train d'appliquer.
+
+
+
argument {{Optional_inline}}
+
Valeur à utiliser comme {{jsxref("this")}} lors de l'exécution du callback (rappel).
+
+ +

Valeur renvoyée

+ +

{{jsxref('undefined')}} (indéfinie).

+ +

Exemple

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Nous récupérons un itérateur contenant les valeurs avec forEach() et écrivons chacune d'elles dans le  {{domxref("Node.textContent")}} du <span> pendant l'exécution de la fonction interne forEach().

+ +

HTML

+ +
<span class="a b c"></span>
+ +

JavaScript

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+var iterator = classes.values();
+
+classes.forEach(
+  function(value, key, listObj) {
+    span.textContent += value + ' ' + key + "/" + this + '  ++  ';
+  },
+  "arg"
+);
+ +

Résultat

+ +

{{ EmbedLiveSample('Example', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#interface-domtokenlist','forEach() (as iterable<Node>)')}}{{Spec2('DOM WHATWG')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.forEach")}}
+ +
 
+ +

Voir aussi

+ + diff --git a/files/fr/web/api/domtokenlist/index.html b/files/fr/web/api/domtokenlist/index.html new file mode 100644 index 0000000000..0784f5b071 --- /dev/null +++ b/files/fr/web/api/domtokenlist/index.html @@ -0,0 +1,117 @@ +--- +title: DOMTokenList +slug: Web/API/DOMTokenList +tags: + - API + - Chaînes de caractères + - DOM + - Interface + - Listes + - Marques +translation_of: Web/API/DOMTokenList +--- +
{{APIRef("DOM")}}
+ +

L'interface DOMTokenList représente un ensemble de "token" (marques) séparées par un espace. On obtient un tel ensemble grâce aux propriétés {{domxref("Element.classList")}}, {{domxref("HTMLLinkElement.relList")}}, {{domxref("HTMLAnchorElement.relList")}} ou {{domxref("HTMLAreaElement.relList")}}. Les positions de cette liste sont numérotées à partir de 0. DOMTokenList est toujours sensible à la casse.

+ +

Propriétés

+ +
+
{{domxref("DOMTokenList.length")}} {{ReadOnlyInline}}
+
Un entier qui représente le nombre d'objets qui sont stockés dans l'objet.
+
{{domxref("DOMTokenList.value")}} {{ReadOnlyInline}}
+
retourne la valeur de la liste comme une {{domxref("DOMString")}}  (chaîne de caractères).
+
+ +

Méthodes

+ +
+
{{domxref("DOMTokenList.item()")}}
+
renvoie un élément de la liste à partir de son index (ou {{jsxref("undefined")}} lorsque le nombre passé est supérieur ou égal à la longueur de la liste).
+
{{domxref("DOMTokenList.contains()")}}
+
renvoie true (vrai) si la chaîne de caractères contient la marque (token) passée en argument, false (faux) sinon.
+
{{domxref("DOMTokenList.add()")}}
+
ajoute une marque à la chaîne sous-jacente.
+
{{domxref("DOMTokenList.remove()")}}
+
retire une marque de la chaîne sous-jacente.
+
{{domxref("DOMTokenList.replace()")}}
+
remplace une marque existant par une nouvelle.
+
{{domxref("DOMTokenList.supports()")}}
+
renvoie true (vrai) si une marque passée en argument appartient bien aux marques prises en charge pour l'attribut correspondant.
+
{{domxref("DOMTokenList.toggle()")}}
+
retire une marque de la chaîne de caractères sous-jacente et renvoie false. Si la marque n'existe pas, elle est ajoutée et la méthode renvoie true.
+
{{domxref("DOMTokenList.entries()")}}
+
renvoie un {{jsxref("Iteration_protocols","itérateur","",1)}} qui permet de parcourir l'ensemble des clés/valeurs contenues dans cet objet.
+
{{domxref("DOMTokenList.forEach()")}}
+
exécute une fonction pour chaque élément de la DOMTokenList.
+
{{domxref("DOMTokenList.keys()")}}
+
renvoie un {{jsxref("Iteration_protocols", "itérateur","",1)}} qui permet de parcourir l'ensemble des clés contenues dans cet objet.
+
{{domxref("DOMTokenList.values()")}}
+
renvoie un {{jsxref("Iteration_protocols", "itérateur","",1)}} qui permet de parcourir l'ensemble des valeurs contenues dans cet objet.
+
+

Exemples

+
+
+ +

Dans l'exemple suivant, nous récupérons la liste d'un ensemble de classes définies sur un élément {{htmlelement("p")}} en tant que DOMTokenList en utilisant  {{domxref("Element.classList")}}, ajoutons une classe en utilisant  {{domxref("DOMTokenList.add()")}}, puis mettons à jour le {{domxref("Node.textContent")}} du <p> pour qu'il soit égal à la  DOMTokenList.

+ +

D'abord HTML :

+ +
<p class="a b c"></p>
+ +

Puis Javascript :

+ +
var para = document.querySelector("p");
+var classes = para.classList;
+para.classList.add("d");
+para.textContent = 'paragraph classList is "' + classes + '"';
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Découpage des espaces et suppression des doublons

+ +

Les méthodes qui modifient la DOMTokenList (comme {{domxref("DOMTokenList.add()")}}) suppriment automatiquement les espaces en excès et les valeurs en double de la liste. Par exemple :

+ +
<span class="    d   d e f"></span>
+ +
var span = document.querySelector("span");
+var classes = span.classList;
+span.classList.add("x");
+span.textContent = 'span classList is "' + classes + '"';
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Trimming_of_whitespace_and_removal_of_duplicates', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName("DOM WHATWG", "#interface-domtokenlist", "DOMTokenList")}}{{Spec2("DOM WHATWG")}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList")}}
+ +
+

Voir aussi

+
+ + diff --git a/files/fr/web/api/domtokenlist/item/index.html b/files/fr/web/api/domtokenlist/item/index.html new file mode 100644 index 0000000000..1591d5c9fc --- /dev/null +++ b/files/fr/web/api/domtokenlist/item/index.html @@ -0,0 +1,73 @@ +--- +title: DOMTokenList.item() +slug: Web/API/DOMTokenList/item +tags: + - API + - Chaînes de caractères + - DOM + - Listes + - Méthodes +translation_of: Web/API/DOMTokenList/item +--- +

{{APIRef("DOM")}}

+ +

La méthode item() de l'interface {{domxref("DOMTokenList")}} renvoie un élément de la liste par son index.

+ +

Syntaxe

+ +
tokenList.item(index);
+ +

Paramètres

+ +
+
index
+
Une {{domxref("DOMString")}} (chaîne de caractères) représentant l'index de l'élément dont on veut le retour.
+
+ +

Valeur retournée

+ +

Une {{domxref("DOMString")}} (chaîne de caractères) représentant l'élément renvoyé. Le retour est undefined (indéfini) si le nombre est plus grand que ou égal à la longueur de la liste.

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Nous récupérons le dernier élément dans la liste en utilisant item(length-1) et l'écrivons dans le {{domxref("Node.textContent")}} du <span>.

+ +

D'abord le code HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+var item = classes.item(classes.length-1);
+span.textContent = item;
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#dom-domtokenlist-item','item()')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.item")}}
+ +
 
+ +

 

diff --git a/files/fr/web/api/domtokenlist/keys/index.html b/files/fr/web/api/domtokenlist/keys/index.html new file mode 100644 index 0000000000..85855c60c6 --- /dev/null +++ b/files/fr/web/api/domtokenlist/keys/index.html @@ -0,0 +1,76 @@ +--- +title: DOMTokenList.keys() +slug: Web/API/DOMTokenList/keys +tags: + - API + - Boucle + - Clés + - DOM + - Itérateur + - Listes + - Méthodes + - for of +translation_of: Web/API/DOMTokenList/keys +--- +

{{APIRef("DOM")}}

+ +

La méthode keys() de l'interface {{domxref("DOMTokenList")}} renvoie un {{jsxref("Les_protocoles_iteration",'itérateur')}} permettant de parcourir toutes les clés contenues dans cet objet. Les clés sont de type unsigned integer (entier non signé).

+ +

Syntaxe

+ +
tokenList.keys();
+ +

Paramètres

+ +

Aucun.

+ +

Valeur retournée

+ +

Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Ensuite nous récupérons un itérateur contenant les clés en utilisant values(), alors, nous itérons ces clés avec une boucle for ... of et écrivons chacune dans le {{domxref("Node.textContent")}} du <span>.

+ +

D'abord, le HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant le JavaScript:

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+var iterator = classes.keys();
+
+for(var value of iterator) {
+  span.textContent += value + ' ++ ';
+}
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#interface-domtokenList','keys() (as iterable<Node>)')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.keys")}}
+ +
 
+ +
 
diff --git a/files/fr/web/api/domtokenlist/length/index.html b/files/fr/web/api/domtokenlist/length/index.html new file mode 100644 index 0000000000..020d7bd7f6 --- /dev/null +++ b/files/fr/web/api/domtokenlist/length/index.html @@ -0,0 +1,68 @@ +--- +title: DOMTokenList.length +slug: Web/API/DOMTokenList/length +tags: + - API + - DOM + - Listes + - Longueur + - Propriétés +translation_of: Web/API/DOMTokenList/length +--- +

{{APIRef("DOM")}}

+ +

La propriété en lecture seule length (longueur) de l'interface {{domxref("DOMTokenList")}} est un integer (entier) représentant le nombre d'objets stockés dans la liste.

+ +

Syntaxe

+ +
tokenList.length;
+ +

Value

+ +

Un integer (entier).

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}, puis écrivons la longueur (length) de la liste dans le {{domxref("Node.textContent")}} du <span>.

+ +

D'abord le HTML:

+ +
<span class="a b c"></span>
+ +

Maintenant le JavaScript:

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+var length = classes.length;
+
+span.textContent = 'classList length = ' + length;
+
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#dom-domtokenlist-length','length')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.length")}}
+ +
 
+ +
 
diff --git a/files/fr/web/api/domtokenlist/remove/index.html b/files/fr/web/api/domtokenlist/remove/index.html new file mode 100644 index 0000000000..b3721f931c --- /dev/null +++ b/files/fr/web/api/domtokenlist/remove/index.html @@ -0,0 +1,85 @@ +--- +title: DOMTokenList.remove() +slug: Web/API/DOMTokenList/remove +tags: + - API + - DOM + - Listes + - Méthodes + - Suppression +translation_of: Web/API/DOMTokenList/remove +--- +

{{APIRef("DOM")}}

+ +

La méthode remove() de l'interface {{domxref("DOMTokenList")}} supprime sur la liste la marque (token) spécifiée.

+ +

Syntaxe

+ +
tokenList.remove(token1[, token2[, ...]]);
+ +

Paramètres

+ +
+
tokenN...
+
Une {{domxref("DOMString")}} (chaîne de caractères) représentant la marque que vous voulez supprimer sur la liste. Si la chaîne de caractères n'existe pas sur la liste, aucune erreur n'est levée et rien ne se passe.
+
+ +

Valeur retournée

+ +

Vide.

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies dans l'élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Nous retirons ensuite une marque sur la liste et écrivons la liste dans le {{domxref("Node.textContent")}} du <span>.

+ +

D'abord, le HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+classes.remove("c");
+span.textContent = classes;
+
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Pour supprimer plusieurs classes à la fois, vous pouvez utiliser un tableau (array) avec la syntaxe de décomposition. L'ordre des classes n'a pas d'importance :

+ +
let span = document.getElementsByTagName("span")[0],
+  classes = span.classList;
+
+classes.remove(...['c', 'b']);
+span.textContent = classes;
+
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#dom-domtokenlist-remove','remove()')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.remove")}}
+ +
 
+ +
 
+ +

 

diff --git a/files/fr/web/api/domtokenlist/replace/index.html b/files/fr/web/api/domtokenlist/replace/index.html new file mode 100644 index 0000000000..64de0066fd --- /dev/null +++ b/files/fr/web/api/domtokenlist/replace/index.html @@ -0,0 +1,80 @@ +--- +title: DOMTokenList.replace() +slug: Web/API/DOMTokenList/replace +tags: + - API + - DOM + - Listes + - Méthodes + - Remplacement +translation_of: Web/API/DOMTokenList/replace +--- +

{{APIRef("DOM")}}

+ +

La méthode replace() de l'interface {{domxref("DOMTokenList")}} remplace une marque (token) existante par une nouvelle marque.

+ +

Syntaxe

+ +
tokenList.replace(oldToken,newToken);
+ +

Paramètres

+ +
+
oldToken
+
Une {{domxref("DOMString")}} (chaîne de caractères) représentant la marque que vous voulez remplacer.
+
newToken
+
Une {{domxref("DOMString")}} (chaîne de caractères) représentant la marque avec laquelle vous voulez remplacer l'ancienne.
+
+ +

Valeur retournée

+ +

Vide.

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Nous remplaçons alors la marque dans la liste et écrivons la liste dans le {{domxref("Node.textContent")}} du <span>.

+ +

D'abord, le HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+try {
+  classes.replace("c", "z");
+  span.textContent = classes;
+} catch(e) {
+  span.textContent = e;
+}
+
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#dom-domtokenlist-replace','replace()')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.replace")}}
+ +
 
+ +
 
diff --git a/files/fr/web/api/domtokenlist/supports/index.html b/files/fr/web/api/domtokenlist/supports/index.html new file mode 100644 index 0000000000..b536c5f40c --- /dev/null +++ b/files/fr/web/api/domtokenlist/supports/index.html @@ -0,0 +1,66 @@ +--- +title: DOMTokenList.supports() +slug: Web/API/DOMTokenList/supports +tags: + - API + - DOM + - Méthodes +translation_of: Web/API/DOMTokenList/supports +--- +

{{APIRef("DOM")}}{{SeeCompatTable}}

+ +

La méthode supports() de l'interface {{domxref("DOMTokenList")}} renvoie true (vrai) si une marque (token) donnée se trouve parmi les marques prises en charge dans l'attribut associé. Cette méthode est destinée à la détection des fonctionnalités.

+ +

Syntaxe

+ +
var boolean = element.supports(token)
+ +

Paramètres

+ +
+
token
+
Une {{domxref("DOMString")}} (chaîne de caractères) contenant la marque à interroger.
+
+ +

Renvoie

+ +

un {{jsxref("Boolean")}} (booléen) indiquant si la marque a été trouvée.

+ +

Exemple

+ +
var iframe = document.getElementById('display');
+if (iframe.sandbox.supports('an-upcoming-feature')) {
+  // code de support pour la future et mystérieuse fonctionnalité
+} else {
+  // code de secours
+}
+
+if (iframe.sandbox.supports('allow-scripts')) {
+  // instruction cadre de l'exécution de JavaScript
+   // NOTE: ceci fonctionne bien mais est juste un exemple!
+}
+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('Credential Management')}}{{Spec2('Credential Management')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.supports")}}
+ +
 
+ +
 
diff --git a/files/fr/web/api/domtokenlist/toggle/index.html b/files/fr/web/api/domtokenlist/toggle/index.html new file mode 100644 index 0000000000..5dcf5826cf --- /dev/null +++ b/files/fr/web/api/domtokenlist/toggle/index.html @@ -0,0 +1,82 @@ +--- +title: DOMTokenList.toggle() +slug: Web/API/DOMTokenList/toggle +tags: + - API + - Basculement + - DOM + - Listes + - Méthodes +translation_of: Web/API/DOMTokenList/toggle +--- +

{{APIRef("DOM")}}

+ +

La méthode toggle() (bascule) de l'interface {{domxref("DOMTokenList")}} supprime une marque (token) donnée de la liste et renvoie false (faux). Si token n'existe pas, il est ajouté et la fonction renvoie true.

+ +

Syntaxe

+ +
tokenList.toggle(token, force);
+ +

Paramètres

+ +
+
token
+
Une {{domxref("DOMString")}} (chaîne de caractères) représentant la marque que l'on veut activer.
+
force {{optional_inline}}
+
Un {{domxref("Boolean")}} (booléen) qui, si inclus, transforme la bascule (toggle) en opération unique. Si elle est définie false (faux), la marque sera seulement supprimée et aucun ajout ne suivra. Si elle est définie true (vrai), la marque sera seulement ajoutée et pas supprimée après.
+
+ +

Valeur retournée

+ +

Un {{domxref("Boolean")}} (booléen) — false (faux) si la marque n'est pas dans la liste après l'appel ou true (vrai) si elle y est.

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Nous remplaçons alors une marque dans la liste et écrivons la liste dans le {{domxref("Node.textContent")}} du <span>.

+ +

D'abord, le HTML :

+ +
<span class="a b">classList is 'a b'</span>
+ +

Maintenant le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+span.onclick = function() {
+  var result = classes.toggle("c");
+  if(result) {
+    span.textContent = "'c' added; classList is now '" + classes + "'.";
+  } else {
+    span.textContent = "'c' removed; classList is now '" + classes + "'.";
+  }
+}
+
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#dom-domtokenlist-toggle','toggle()')}}{{Spec2('DOM WHATWG')}}Définition initiale.
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.toggle")}}
+ +
 
+ +
 
diff --git a/files/fr/web/api/domtokenlist/value/index.html b/files/fr/web/api/domtokenlist/value/index.html new file mode 100644 index 0000000000..179b6dc852 --- /dev/null +++ b/files/fr/web/api/domtokenlist/value/index.html @@ -0,0 +1,65 @@ +--- +title: DOMTokenList.value +slug: Web/API/DOMTokenList/value +tags: + - API + - DOM + - Méthodes + - Valeur +translation_of: Web/API/DOMTokenList/value +--- +

{{APIRef("DOM")}}

+ +

La propriété value (valeur) de l'interface {{domxref("DOMTokenList")}} renvoie la valeur de la liste en tant que {{domxref("DOMString")}} (chaîne de caractères), ou efface et définit la liste à la valeur donnée.

+ +

Syntaxe

+ +
tokenList.value;
+ +

Valeur

+ +

Une {{domxref("DOMString")}} (chaîne de caractères).

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies sur un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}, puis écrivons alors la valeur de la liste dans le {{domxref("Node.textContent")}} du <span>.

+ +

D'abord le HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+span.textContent = classes.value;
+
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#dom-domtokenlist-value','value')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.value")}}
+ +
 
+ +
 
diff --git a/files/fr/web/api/domtokenlist/values/index.html b/files/fr/web/api/domtokenlist/values/index.html new file mode 100644 index 0000000000..2abea40a04 --- /dev/null +++ b/files/fr/web/api/domtokenlist/values/index.html @@ -0,0 +1,74 @@ +--- +title: DOMTokenList.values() +slug: Web/API/DOMTokenList/values +tags: + - API + - DOM + - Itérateurs + - Listes + - Méthodes + - Valeurs +translation_of: Web/API/DOMTokenList/values +--- +

{{APIRef("DOM")}}

+ +

La méthode values() (valeurs) de l'interface {{domxref("DOMTokenList")}} renvoie un {{jsxref("Les_protocoles_iteration",'itérateur')}} permettant aux développeurs de passer en revue toutes les valeurs contenues dans la DOMTokenList. Individuellement, les valeurs sont des objets {{domxref("DOMString")}} (chaînes de caractères).

+ +

Syntaxe

+ +
tokenList.values();
+ +

Paramètres

+ +

Aucun.

+ +

Valeur retournée

+ +

Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.

+ +

Exemples

+ +

Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que DOMTokenList en utilisant {{domxref("Element.classList")}}. Si nous récupérons un itérateur contenant les valeurs en utilisant values(), nous les itérons alors en utilisant une boucle for ... of et écrivons chacune dans le {{domxref("Node.textContent")}} du <span>.

+ +

D'abord, le HTML :

+ +
<span class="a b c"></span>
+ +

Maintenant le JavaScript :

+ +
var span = document.querySelector("span");
+var classes = span.classList;
+var iterator = classes.values();
+
+for(var value of iterator) {
+  span.textContent += value + ' ++ ';
+}
+ +

La sortie ressemble à ceci :

+ +

{{ EmbedLiveSample('Examples', '100%', 60) }}

+ +

Spécifications

+ + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG','#interface-domtokenList','values() (as iterable<Node>)')}}{{Spec2('DOM WHATWG')}}Définition initiale
+ +

Compatibilité des navigateurs

+ +
{{Compat("api.DOMTokenList.values")}}
+ +
 
+ +
 
-- cgit v1.2.3-54-g00ecf