convert content to md

14 files changed, 448 insertions, 576 deletions

diff --git a/files/fr/web/api/domtokenlist/add/index.md b/files/fr/web/api/domtokenlist/add/index.md
index b274f15ac0..9052727e6e 100644
--- a/files/fr/web/api/domtokenlist/add/index.md
+++ b/files/fr/web/api/domtokenlist/add/index.md
@@ -10,66 +10,58 @@ tags:
   - Méthodes
 translation_of: Web/API/DOMTokenList/add
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>add()</strong></code> de l'interface {{domxref("DOMTokenList")}} ajoute  le <em>token</em> (<em>marque</em>) à la liste.</p>
+La méthode **`add()`** de l'interface {{domxref("DOMTokenList")}} ajoute  le _token_ (_marque_) à la liste.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.add(token1[, token2[, ...]]);</pre>
+    tokenList.add(token1[, token2[, ...]]);
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt>token</dt>
- <dd>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) représentant la marque (<em>token</em>) que vous souhaitez ajouter à la liste.</dd>
-</dl>
+- token
+  - : Une {{domxref("DOMString")}} (_chaîne de caractères_) représentant la marque (_token_) que vous souhaitez ajouter à la liste.
 
-<h3 id="Valeur_renvoyée">Valeur renvoyée</h3>
+### Valeur renvoyée
 
-<p>Vide.</p>
+Vide.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons une liste des classes définies sur un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code>, en utilisant {{domxref("Element.classList")}}. Nous ajoutons alors une nouvelle marque à la  liste et écrivons la liste dans un  {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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>`.
 
-<p>Tout d'abord, le code HTML :</p>
+Tout d'abord, le code HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant, le JavaScript :</p>
+Maintenant, le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 classes.add("d");
 span.textContent = classes;
-</pre>
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<p>Vous pouvez ajouter plusieurs <em>token</em> :</p>
+Vous pouvez ajouter plusieurs _token_ :
 
-<pre class="brush: js">span.classList.add("d", "e", "f");</pre>
+```js
+span.classList.add("d", "e", "f");
+```
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-domtokenlist-add','add()')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                | Statut                           | Commentaire         |
+| ---------------------------------------------------------------------------- | -------------------------------- | ------------------- |
+| {{SpecName('DOM WHATWG','#dom-domtokenlist-add','add()')}} | {{Spec2('DOM WHATWG')}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.add")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.add")}}
diff --git a/files/fr/web/api/domtokenlist/contains/index.md b/files/fr/web/api/domtokenlist/contains/index.md
index 9954b4108f..ca3978e077 100644
--- a/files/fr/web/api/domtokenlist/contains/index.md
+++ b/files/fr/web/api/domtokenlist/contains/index.md
@@ -10,65 +10,56 @@ tags:
   - Recherche contenu
 translation_of: Web/API/DOMTokenList/contains
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>contains()</strong></code> de l'interface {{domxref("DOMTokenList")}} renvoie un {{domxref("Boolean")}} (<em>booléen</em>) — <code>true</code> (<em>vrai</em>) si la liste sous-jacente contient le symbole donné, sinon <code>false</code> (<em>faux</em>).</p>
+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_).
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.contains(token);</pre>
+    tokenList.contains(token);
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt>token</dt>
- <dd>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) représentant la "token" (<em>marque</em>) dont vous voulez vérifier l'existence dans la liste.</dd>
-</dl>
+- token
+  - : Une {{domxref("DOMString")}} (_chaîne de caractères_) représentant la "token" (_marque_) dont vous voulez vérifier l'existence dans la liste.
 
-<h3 id="Valeur_renvoyée">Valeur renvoyée</h3>
+### Valeur renvoyée
 
-<p>Un {{domxref("Boolean")}} (<em>booléen</em>)— <code>true</code> (<em>vrai</em>) si la liste sous-jacente contient la marque donnée, sinon <code>false</code> (<em>faux</em>).</p>
+Un {{domxref("Boolean")}} (_booléen_)— `true` (_vrai_) si la liste sous-jacente contient la marque donnée, sinon `false` (_faux_).
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies sur un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> 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 <code>&lt;span&gt;</code>.</p>
+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>`.
 
-<p>Tout d'abord, le code HTML :</p>
+Tout d'abord, le code HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant, le JavaScript :</p>
+Maintenant, le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+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'";
-}</pre>
+}
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-domtokenlist-contains','contains()')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                                | Statut                           | Commentaire         |
+| -------------------------------------------------------------------------------------------- | -------------------------------- | ------------------- |
+| {{SpecName('DOM WHATWG','#dom-domtokenlist-contains','contains()')}} | {{Spec2('DOM WHATWG')}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.contains")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.contains")}}
diff --git a/files/fr/web/api/domtokenlist/entries/index.md b/files/fr/web/api/domtokenlist/entries/index.md
index 8642f149aa..113f23c1b0 100644
--- a/files/fr/web/api/domtokenlist/entries/index.md
+++ b/files/fr/web/api/domtokenlist/entries/index.md
@@ -10,63 +10,54 @@ tags:
   - Méthodes
 translation_of: Web/API/DOMTokenList/entries
 ---
-<div>{{APIRef("DOM")}}</div>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>DOMTokenList.entries()</strong></code> 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")}} (<em>chaînes de caractères</em>), chacun représentant une seule marque.</p>
+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.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.entries();</pre>
+    tokenList.entries();
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.</p>
+Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies sur un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}. Nous récupérons un itérateur contenant les paires clé / valeur en utilisant <code>entries()</code>, puis parcourons chacune d'entre elles en utilisant une boucle <a href="/fr/docs/Web/JavaScript/Reference/Instructions/for...of">for ... of</a> , et les écrivons dans un  {{domxref("Node.textContent")}}  du <code>&lt;span&gt;</code>.</p>
+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](/fr/docs/Web/JavaScript/Reference/Instructions/for...of) , et les écrivons dans un  {{domxref("Node.textContent")}}  du `<span>`.
 
-<p>D'abord le HTML :</p>
+D'abord le HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant le JavaScript :</p>
+Maintenant le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 var iterator = classes.entries();
 
 for(var value of iterator) {
   span.textContent += value + ' ++ ';
-}</pre>
+}
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#interface-domtokenlist','entries() (as iterable&lt;Node&gt;)')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale.</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                                                            | Statut                           | Commentaire          |
+| ------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | -------------------- |
+| {{SpecName('DOM WHATWG','#interface-domtokenlist','entries() (as iterable&lt;Node&gt;)')}} | {{Spec2('DOM WHATWG')}} | Définition initiale. |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.entries")}}</div>
+{{Compat("api.DOMTokenList.entries")}}
 
-<h2 id="Voir_aussi">Voir aussi</h2>
+## Voir aussi
 
-<ul>
- <li>{{domxref("DOMSettableTokenList")}} (objet qui étend DOMTokenList avec la propriété définissable<em> .value</em>)</li>
-</ul>
+- {{domxref("DOMSettableTokenList")}} (objet qui étend DOMTokenList avec la propriété définissable _.value_)
diff --git a/files/fr/web/api/domtokenlist/foreach/index.md b/files/fr/web/api/domtokenlist/foreach/index.md
index 738ad80d7c..917b80e9c2 100644
--- a/files/fr/web/api/domtokenlist/foreach/index.md
+++ b/files/fr/web/api/domtokenlist/foreach/index.md
@@ -11,49 +11,49 @@ tags:
   - Pour chaque
 translation_of: Web/API/DOMTokenList/forEach
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <strong><code>forEach()</code></strong> 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.</p>
+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.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox"><var>tokenList</var><em>.</em>forEach(<var>callback</var>);
-<em>tokenList.</em>forEach<em>(callback, argument);</em>
-</pre>
+    tokenList.forEach(callback);
+    tokenList.forEach(callback, argument);
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><code>callback</code></dt>
- <dd>Fonction à exécuter pour chaque élément, prenant éventuellement 3 arguments :
- <dl>
-  <dt><em><code>currentValue</code></em></dt>
-  <dd>L'élément en cours de traitement dans le tableau.</dd>
-  <dt><code><em>currentIndex</em></code></dt>
-  <dd>L'index de l'élément en cours de traitement dans le tableau.</dd>
-  <dt><em><code>listObj</code></em></dt>
-  <dd>Le tableau que <code>forEach()</code> est en train d'appliquer.</dd>
- </dl>
- </dd>
- <dt><em><code>argument</code></em><code> {{Optional_inline}}</code></dt>
- <dd>Valeur à utiliser comme {{jsxref("this")}} lors de l'exécution du <code>callback</code> (<em>rappel</em>).</dd>
-</dl>
+- `callback`
 
-<h3 id="Valeur_renvoyée">Valeur renvoyée</h3>
+  - : Fonction à exécuter pour chaque élément, prenant éventuellement 3 arguments :
 
-<p>{{jsxref('undefined')}} (<em>indéfinie</em>).</p>
+    - _`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.
 
-<h2 id="Exemple">Exemple</h2>
+- _`argument`_` {{Optional_inline}}`
+  - : Valeur à utiliser comme {{jsxref("this")}} lors de l'exécution du `callback` (_rappel_).
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}. Nous récupérons un itérateur contenant les valeurs avec <code>forEach()</code> et écrivons chacune d'elles dans le  {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code> pendant l'exécution de la fonction interne <code>forEach()</code>.</p>
+### Valeur renvoyée
 
-<h3 id="HTML">HTML</h3>
+{{jsxref('undefined')}} (_indéfinie_).
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+## Exemple
 
-<h3 id="JavaScript">JavaScript</h3>
+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()`.
 
-<pre class="brush: js">var span = document.querySelector("span");
+### HTML
+
+```html
+<span class="a b c"></span>
+```
+
+### JavaScript
+
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 var iterator = classes.values();
 
@@ -62,35 +62,23 @@ classes.forEach(
     span.textContent += value + ' ' + key + "/" + this + '  ++  ';
   },
   "arg"
-);</pre>
+);
+```
 
-<h3 id="Résultat">Résultat</h3>
+### Résultat
 
-<p>{{ EmbedLiveSample('Example', '100%', 60) }}</p>
+{{ EmbedLiveSample('Example', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#interface-domtokenlist','forEach() (as iterable&lt;Node&gt;)')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale.</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                                                            | Statut                           | Commentaire          |
+| ------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | -------------------- |
+| {{SpecName('DOM WHATWG','#interface-domtokenlist','forEach() (as iterable&lt;Node&gt;)')}} | {{Spec2('DOM WHATWG')}} | Définition initiale. |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.forEach")}}</div>
+{{Compat("api.DOMTokenList.forEach")}}
 
-<h2 id="Voir_aussi">Voir aussi</h2>
+## Voir aussi
 
-<ul>
- <li>{{domxref("DOMSettableTokenList")}} (objet qui étend DOMTokenList avec la propriété définissable <em>.value</em>)</li>
-</ul>
+- {{domxref("DOMSettableTokenList")}} (objet qui étend DOMTokenList avec la propriété définissable _.value_)
diff --git a/files/fr/web/api/domtokenlist/index.md b/files/fr/web/api/domtokenlist/index.md
index 8f454506dd..8cbf548fc2 100644
--- a/files/fr/web/api/domtokenlist/index.md
+++ b/files/fr/web/api/domtokenlist/index.md
@@ -10,105 +10,94 @@ tags:
   - Marques
 translation_of: Web/API/DOMTokenList
 ---
-<div>{{APIRef("DOM")}}</div>
-
-<p>L'interface <code><strong>DOMTokenList</strong></code> représente un ensemble de "token" (<em>marques</em>) 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.<code> DOMTokenList</code> est toujours sensible à la casse.</p>
-
-<h2 id="Propriétés">Propriétés</h2>
-
-<dl>
- <dt>{{domxref("DOMTokenList.length")}} {{ReadOnlyInline}}</dt>
- <dd>Un entier qui représente le nombre d'objets qui sont stockés dans l'objet.</dd>
- <dt>{{domxref("DOMTokenList.value")}} {{ReadOnlyInline}}</dt>
- <dd>retourne la valeur de la liste comme une {{domxref("DOMString")}}  <em>(chaîne de caractères).</em></dd>
-</dl>
-
-<h2 id="Méthodes">Méthodes</h2>
-
-<dl>
- <dt>{{domxref("DOMTokenList.item()")}}</dt>
- <dd>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).</dd>
- <dt>{{domxref("DOMTokenList.contains()")}}</dt>
- <dd>renvoie <code>true</code> <em>(vrai)</em> si la chaîne de caractères contient la marque <em>(token)</em> passée en argument, <code>false</code> <em>(faux)</em> sinon.</dd>
- <dt>{{domxref("DOMTokenList.add()")}}</dt>
- <dd>ajoute une marque à la chaîne sous-jacente.</dd>
- <dt>{{domxref("DOMTokenList.remove()")}}</dt>
- <dd>retire une marque de la chaîne sous-jacente.</dd>
- <dt>{{domxref("DOMTokenList.replace()")}}</dt>
- <dd>remplace une marque existant par une nouvelle.</dd>
- <dt>{{domxref("DOMTokenList.supports()")}}</dt>
- <dd>renvoie <code>true</code> <em>(vrai)</em> si une marque passée en argument appartient bien aux marques prises en charge pour l'attribut correspondant.</dd>
- <dt>{{domxref("DOMTokenList.toggle()")}}</dt>
- <dd>retire une marque de la chaîne de caractères sous-jacente et renvoie <code>false</code>. Si la marque n'existe pas, elle est ajoutée et la méthode renvoie <code>true</code>.</dd>
- <dt>{{domxref("DOMTokenList.entries()")}}</dt>
- <dd>renvoie un {{jsxref("Iteration_protocols","itérateur","",1)}} qui permet de parcourir l'ensemble des clés/valeurs contenues dans cet objet.</dd>
- <dt>{{domxref("DOMTokenList.forEach()")}}</dt>
- <dd>exécute une fonction pour chaque élément de la <code>DOMTokenList</code>.</dd>
- <dt>{{domxref("DOMTokenList.keys()")}}</dt>
- <dd>renvoie un {{jsxref("Iteration_protocols", "itérateur","",1)}} qui permet de parcourir l'ensemble des clés contenues dans cet objet.</dd>
- <dt>{{domxref("DOMTokenList.values()")}}</dt>
- <dd>renvoie un {{jsxref("Iteration_protocols", "itérateur","",1)}} qui permet de parcourir l'ensemble des valeurs contenues dans cet objet.</dd>
-</dl>
-
-<h2 id="Exemples">Exemples</h2>
-
-<p>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 <code>DOMTokenList</code> en<code> </code>utilisant  {{domxref("Element.classList")}}, ajoutons une classe en utilisant  {{domxref("DOMTokenList.add()")}}, puis mettons à jour le {{domxref("Node.textContent")}} du <code>&lt;p&gt;</code> pour qu'il soit égal à la  <code>DOMTokenList</code>.</p>
-
-<p>D'abord HTML :</p>
-
-<pre class="brush: html">&lt;p class="a b c"&gt;&lt;/p&gt;</pre>
-
-<p>Puis Javascript :</p>
-
-<pre class="brush: js">var para = document.querySelector("p");
+{{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 :
+
+```html
+<p class="a b c"></p>
+```
+
+Puis Javascript :
+
+```js
+var para = document.querySelector("p");
 var classes = para.classList;
 para.classList.add("d");
-para.textContent = 'paragraph classList is "' + classes + '"';</pre>
+para.textContent = 'paragraph classList is "' + classes + '"';
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Découpage_des_espaces_et_suppression_des_doublons">Découpage des espaces et suppression des doublons</h2>
+## Découpage des espaces et suppression des doublons
 
-<p>Les méthodes qui modifient la <code>DOMTokenList</code> (comme {{domxref("DOMTokenList.add()")}}) suppriment automatiquement les espaces en excès et les valeurs en double de la liste. Par exemple :</p>
+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 :
 
-<pre class="brush: html">&lt;span class="    d   d e f"&gt;&lt;/span&gt;</pre>
+```html
+<span class="    d   d e f"></span>
+```
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 span.classList.add("x");
-span.textContent = 'span classList is "' + classes + '"';</pre>
+span.textContent = 'span classList is "' + classes + '"';
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Trimming_of_whitespace_and_removal_of_duplicates', '100%', 60) }}</p>
+{{ EmbedLiveSample('Trimming_of_whitespace_and_removal_of_duplicates', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <thead>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
- </thead>
- <tbody>
-  <tr>
-   <td>{{SpecName("DOM WHATWG", "#interface-domtokenlist", "DOMTokenList")}}</td>
-   <td>{{Spec2("DOM WHATWG")}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                                | Statut                           | Commentaire         |
+| -------------------------------------------------------------------------------------------- | -------------------------------- | ------------------- |
+| {{SpecName("DOM WHATWG", "#interface-domtokenlist", "DOMTokenList")}} | {{Spec2("DOM WHATWG")}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList")}}</div>
+{{Compat("api.DOMTokenList")}}
 
-<h2 id="Voir_aussi">Voir aussi</h2>
+## Voir aussi
 
-<ul>
- <li>{{domxref("DOMSettableTokenList")}} : un objet qui étend <code>DOMTokenList</code> avec une propriété <em>.value</em> modifiable</li>
-</ul>
+- {{domxref("DOMSettableTokenList")}} : un objet qui étend `DOMTokenList` avec une propriété _.value_ modifiable
diff --git a/files/fr/web/api/domtokenlist/item/index.md b/files/fr/web/api/domtokenlist/item/index.md
index c3f6c7dc17..c1d22f88c5 100644
--- a/files/fr/web/api/domtokenlist/item/index.md
+++ b/files/fr/web/api/domtokenlist/item/index.md
@@ -9,61 +9,52 @@ tags:
   - Méthodes
 translation_of: Web/API/DOMTokenList/item
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>item()</strong></code> de l'interface {{domxref("DOMTokenList")}} renvoie un élément de la liste par son index.</p>
+La méthode **`item()`** de l'interface {{domxref("DOMTokenList")}} renvoie un élément de la liste par son index.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.item(index);</pre>
+    tokenList.item(index);
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt>index</dt>
- <dd>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) représentant l'index de l'élément dont on veut le retour.</dd>
-</dl>
+- index
+  - : Une {{domxref("DOMString")}} (_chaîne de caractères_) représentant l'index de l'élément dont on veut le retour.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) représentant l'élément renvoyé. Le retour est <code>undefined</code> (<em>indéfini</em>) si le nombre est plus grand que ou égal à la longueur de la liste.</p>
+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.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}. Nous récupérons le dernier élément dans la liste en utilisant <em>item(length-1)</em> et l'écrivons dans le {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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>`.
 
-<p>D'abord le code HTML :</p>
+D'abord le code HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant le JavaScript :</p>
+Maintenant le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 var item = classes.item(classes.length-1);
-span.textContent = item;</pre>
+span.textContent = item;
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-domtokenlist-item','item()')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                    | Statut                           | Commentaire         |
+| -------------------------------------------------------------------------------- | -------------------------------- | ------------------- |
+| {{SpecName('DOM WHATWG','#dom-domtokenlist-item','item()')}} | {{Spec2('DOM WHATWG')}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.item")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.item")}}
diff --git a/files/fr/web/api/domtokenlist/keys/index.md b/files/fr/web/api/domtokenlist/keys/index.md
index b707fae355..f5408bd2c6 100644
--- a/files/fr/web/api/domtokenlist/keys/index.md
+++ b/files/fr/web/api/domtokenlist/keys/index.md
@@ -12,61 +12,54 @@ tags:
   - for of
 translation_of: Web/API/DOMTokenList/keys
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>keys()</strong></code> 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 <code>unsigned integer</code> <em>(entier non signé)</em>.</p>
+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é)_.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.keys();</pre>
+    tokenList.keys();
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<p>Aucun.</p>
+Aucun.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.</p>
+Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}. Ensuite nous récupérons un itérateur contenant les clés en utilisant <code>values()</code>, alors, nous itérons ces clés avec une boucle <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for ... of</a> et écrivons chacune dans le {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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](/en-US/docs/Web/JavaScript/Reference/Statements/for...of) et écrivons chacune dans le {{domxref("Node.textContent")}} du `<span>`.
 
-<p>D'abord, le HTML :</p>
+D'abord, le HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant le JavaScript:</p>
+Maintenant le JavaScript:
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 var iterator = classes.keys();
 
 for(var value of iterator) {
   span.textContent += value + ' ++ ';
-}</pre>
+}
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#interface-domtokenList','keys() (as iterable&lt;Node&gt;)')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                                                        | Statut                           | Commentaire         |
+| -------------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------------- |
+| {{SpecName('DOM WHATWG','#interface-domtokenList','keys() (as iterable&lt;Node&gt;)')}} | {{Spec2('DOM WHATWG')}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.keys")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.keys")}}
diff --git a/files/fr/web/api/domtokenlist/length/index.md b/files/fr/web/api/domtokenlist/length/index.md
index 1e21b1727f..877b240632 100644
--- a/files/fr/web/api/domtokenlist/length/index.md
+++ b/files/fr/web/api/domtokenlist/length/index.md
@@ -9,56 +9,48 @@ tags:
   - Propriétés
 translation_of: Web/API/DOMTokenList/length
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La propriété en lecture seule <code><strong>length</strong></code> (<em>longueur</em>) de l'interface {{domxref("DOMTokenList")}} est un <code>integer</code> (<em>entier</em>) représentant le nombre d'objets stockés dans la liste.</p>
+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.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.length;</pre>
+    tokenList.length;
 
-<h3 id="Value">Value</h3>
+### Value
 
-<p>Un <code>integer</code> (<em>entier</em>).</p>
+Un `integer` (_entier_).
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}, puis écrivons la longueur (<em>length</em>) de la liste dans le {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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>`.
 
-<p>D'abord le HTML:</p>
+D'abord le HTML:
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant le JavaScript:</p>
+Maintenant le JavaScript:
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 var length = classes.length;
 
 span.textContent = 'classList length = ' + length;
-</pre>
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-domtokenlist-length','length')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                        | Statut                           | Commentaire         |
+| ------------------------------------------------------------------------------------ | -------------------------------- | ------------------- |
+| {{SpecName('DOM WHATWG','#dom-domtokenlist-length','length')}} | {{Spec2('DOM WHATWG')}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.length")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.length")}}
diff --git a/files/fr/web/api/domtokenlist/remove/index.md b/files/fr/web/api/domtokenlist/remove/index.md
index b68c42de55..98f8ccbe34 100644
--- a/files/fr/web/api/domtokenlist/remove/index.md
+++ b/files/fr/web/api/domtokenlist/remove/index.md
@@ -9,71 +9,62 @@ tags:
   - Suppression
 translation_of: Web/API/DOMTokenList/remove
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>remove()</strong></code> de l'interface {{domxref("DOMTokenList")}} supprime sur la liste la marque (<em>token)</em> spécifiée.</p>
+La méthode **`remove()`** de l'interface {{domxref("DOMTokenList")}} supprime sur la liste la marque (_token)_ spécifiée.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.remove(token1[, token2[, ...]]);</pre>
+    tokenList.remove(token1[, token2[, ...]]);
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt>tokenN...</dt>
- <dd>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) 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.</dd>
-</dl>
+- 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.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Vide.</p>
+Vide.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies dans l'élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}. Nous retirons ensuite une marque sur la liste et écrivons la liste dans le {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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>`.
 
-<p>D'abord, le HTML :</p>
+D'abord, le HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant le JavaScript :</p>
+Maintenant le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 classes.remove("c");
 span.textContent = classes;
-</pre>
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<p>Pour supprimer plusieurs classes à la fois, vous pouvez utiliser un tableau (<em>array</em>) avec la <a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateur_de_d%C3%A9composition">syntaxe de décomposition</a>. L'ordre des classes n'a pas d'importance :</p>
+Pour supprimer plusieurs classes à la fois, vous pouvez utiliser un tableau (_array_) avec la [syntaxe de décomposition](/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateur_de_d%C3%A9composition). L'ordre des classes n'a pas d'importance :
 
-<pre class="brush: js">let span = document.getElementsByTagName("span")[0],
+```js
+let span = document.getElementsByTagName("span")[0],
   classes = span.classList;
 
 classes.remove(...['c', 'b']);
 span.textContent = classes;
-</pre>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-domtokenlist-remove','remove()')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<div>{{Compat("api.DOMTokenList.remove")}}</div>
\ No newline at end of file
+```
+
+## Spécifications
+
+| Spécification                                                                        | Statut                           | Commentaire         |
+| ------------------------------------------------------------------------------------ | -------------------------------- | ------------------- |
+| {{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.md b/files/fr/web/api/domtokenlist/replace/index.md
index e3c1d8d799..a352208494 100644
--- a/files/fr/web/api/domtokenlist/replace/index.md
+++ b/files/fr/web/api/domtokenlist/replace/index.md
@@ -9,38 +9,39 @@ tags:
   - Remplacement
 translation_of: Web/API/DOMTokenList/replace
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>replace()</strong></code> de l'interface {{domxref("DOMTokenList")}} remplace une marque <em>(token)</em> existante par une nouvelle marque.</p>
+La méthode **`replace()`** de l'interface {{domxref("DOMTokenList")}} remplace une marque _(token)_ existante par une nouvelle marque.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.replace(oldToken,newToken);</pre>
+    tokenList.replace(oldToken,newToken);
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt>oldToken</dt>
- <dd>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) représentant la marque que vous voulez remplacer.</dd>
- <dt>newToken</dt>
- <dd>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) représentant la marque avec laquelle vous voulez remplacer l'ancienne.</dd>
-</dl>
+- 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.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Vide.</p>
+Vide.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}. Nous remplaçons alors la marque dans la liste et écrivons la liste dans le {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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>`.
 
-<p>D'abord, le HTML :</p>
+D'abord, le HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant le JavaScript :</p>
+Maintenant le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 try {
   classes.replace("c", "z");
@@ -48,29 +49,18 @@ try {
 } catch(e) {
   span.textContent = e;
 }
-</pre>
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-domtokenlist-replace','replace()')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                            | Statut                           | Commentaire         |
+| ---------------------------------------------------------------------------------------- | -------------------------------- | ------------------- |
+| {{SpecName('DOM WHATWG','#dom-domtokenlist-replace','replace()')}} | {{Spec2('DOM WHATWG')}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.replace")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.replace")}}
diff --git a/files/fr/web/api/domtokenlist/supports/index.md b/files/fr/web/api/domtokenlist/supports/index.md
index b9fb5ea4cf..8fdc4d6e12 100644
--- a/files/fr/web/api/domtokenlist/supports/index.md
+++ b/files/fr/web/api/domtokenlist/supports/index.md
@@ -7,28 +7,27 @@ tags:
   - Méthodes
 translation_of: Web/API/DOMTokenList/supports
 ---
-<p>{{APIRef("DOM")}}{{SeeCompatTable}}</p>
+{{APIRef("DOM")}}{{SeeCompatTable}}
 
-<p>La méthode <strong><code>supports()</code></strong> de l'interface {{domxref("DOMTokenList")}} renvoie <code>true</code> (<em>vrai</em>) si une marque (<em>token)</em> 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.</p>
+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.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">var <em>boolean</em> = element.supports(<em>token</em>)</pre>
+    var boolean = element.supports(token)
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt><em><code>token</code></em></dt>
- <dd>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) contenant la marque à interroger.</dd>
-</dl>
+- _`token`_
+  - : Une {{domxref("DOMString")}} (_chaîne de caractères_) contenant la marque à interroger.
 
-<h3 id="Renvoie">Renvoie</h3>
+### Renvoie
 
-<p>un {{jsxref("Boolean")}} (<em>booléen</em>) indiquant si la marque a été trouvée.</p>
+un {{jsxref("Boolean")}} (_booléen_) indiquant si la marque a été trouvée.
 
-<h2 id="Exemple">Exemple</h2>
+## Exemple
 
-<pre class="brush: js"><code>var iframe = document.getElementById('display');
+```js
+var iframe = document.getElementById('display');
 if (iframe.sandbox.supports('an-upcoming-feature')) {
   // code de support pour la future et mystérieuse fonctionnalité
 } else {
@@ -38,25 +37,15 @@ if (iframe.sandbox.supports('an-upcoming-feature')) {
 if (iframe.sandbox.supports('allow-scripts')) {
   // instruction cadre de l'exécution de JavaScript
    // NOTE: ceci fonctionne bien mais est juste un exemple!
-}</code></pre>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('Credential Management')}}</td>
-   <td>{{Spec2('Credential Management')}}</td>
-   <td>Définition initiale.</td>
-  </tr>
- </tbody>
-</table>
-
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
-
-<div>{{Compat("api.DOMTokenList.supports")}}</div>
\ No newline at end of file
+}
+```
+
+## Spécifications
+
+| Spécification                                    | Statut                                       | Commentaire          |
+| ------------------------------------------------ | -------------------------------------------- | -------------------- |
+| {{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.md b/files/fr/web/api/domtokenlist/toggle/index.md
index ef036a01e7..ffc75cd1b8 100644
--- a/files/fr/web/api/domtokenlist/toggle/index.md
+++ b/files/fr/web/api/domtokenlist/toggle/index.md
@@ -9,38 +9,39 @@ tags:
   - Méthodes
 translation_of: Web/API/DOMTokenList/toggle
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>toggle()</strong></code> (<em>bascule</em>) de l'interface {{domxref("DOMTokenList")}} supprime une marque (<em>token)</em> donnée de la liste et renvoie <code>false</code> (<em>faux</em>). Si <em>token</em> n'existe pas, il est ajouté et la fonction renvoie <code>true</code>.</p>
+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`.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.toggle(token, force);</pre>
+    tokenList.toggle(token, force);
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<dl>
- <dt>token</dt>
- <dd>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) représentant la marque que l'on veut activer.</dd>
- <dt>force {{optional_inline}}</dt>
- <dd>Un {{domxref("Boolean")}} (<em>booléen</em>) qui, si inclus, transforme la bascule (toggle) en opération unique. Si elle est définie <code>false</code> (<em>faux</em>), la marque sera seulement supprimée et aucun ajout ne suivra. Si elle est définie <code>true</code> (<em>vrai</em>), la marque sera seulement ajoutée et pas supprimée après.</dd>
-</dl>
+- 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.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Un {{domxref("Boolean")}} (<em>booléen</em>) — <code>false</code> (<em>faux</em>) si la marque n'est pas dans la liste après l'appel ou <code>true</code> (<em>vrai</em>) si elle y est.</p>
+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.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}. Nous remplaçons alors une marque dans la liste et écrivons la liste dans le {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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>`.
 
-<p>D'abord, le HTML :</p>
+D'abord, le HTML :
 
-<pre class="brush: html">&lt;span class="a b"&gt;classList is 'a b'&lt;/span&gt;</pre>
+```html
+<span class="a b">classList is 'a b'</span>
+```
 
-<p>Maintenant le JavaScript :</p>
+Maintenant le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 span.onclick = function() {
   var result = classes.toggle("c");
@@ -50,29 +51,18 @@ span.onclick = function() {
     span.textContent = "'c' removed; classList is now '" + classes + "'.";
   }
 }
-</pre>
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-domtokenlist-toggle','toggle()')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale.</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                        | Statut                           | Commentaire          |
+| ------------------------------------------------------------------------------------ | -------------------------------- | -------------------- |
+| {{SpecName('DOM WHATWG','#dom-domtokenlist-toggle','toggle()')}} | {{Spec2('DOM WHATWG')}} | Définition initiale. |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.toggle")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.toggle")}}
diff --git a/files/fr/web/api/domtokenlist/value/index.md b/files/fr/web/api/domtokenlist/value/index.md
index da23f74aaf..675415f3fc 100644
--- a/files/fr/web/api/domtokenlist/value/index.md
+++ b/files/fr/web/api/domtokenlist/value/index.md
@@ -8,54 +8,46 @@ tags:
   - Valeur
 translation_of: Web/API/DOMTokenList/value
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La propriété <code><strong>value</strong></code> (<em>valeur</em>) 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.</p>
+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.
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.value;</pre>
+    tokenList.value;
 
-<h3 id="Valeur">Valeur</h3>
+### Valeur
 
-<p>Une {{domxref("DOMString")}} (<em>chaîne de caractères</em>).</p>
+Une {{domxref("DOMString")}} (_chaîne de caractères_).
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies sur un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}, puis écrivons alors la valeur de la liste dans le {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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>`.
 
-<p>D'abord le HTML :</p>
+D'abord le HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant le JavaScript :</p>
+Maintenant le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 span.textContent = classes.value;
-</pre>
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#dom-domtokenlist-value','value')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                    | Statut                           | Commentaire         |
+| -------------------------------------------------------------------------------- | -------------------------------- | ------------------- |
+| {{SpecName('DOM WHATWG','#dom-domtokenlist-value','value')}} | {{Spec2('DOM WHATWG')}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.value")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.value")}}
diff --git a/files/fr/web/api/domtokenlist/values/index.md b/files/fr/web/api/domtokenlist/values/index.md
index 294f75dd1c..43db920fe6 100644
--- a/files/fr/web/api/domtokenlist/values/index.md
+++ b/files/fr/web/api/domtokenlist/values/index.md
@@ -10,61 +10,54 @@ tags:
   - Valeurs
 translation_of: Web/API/DOMTokenList/values
 ---
-<p>{{APIRef("DOM")}}</p>
+{{APIRef("DOM")}}
 
-<p>La méthode <code><strong>values()</strong></code> (<em>valeurs</em>) 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 <code>DOMTokenList</code>. Individuellement, les valeurs sont des objets {{domxref("DOMString")}} (<em>chaînes de caractères</em>).</p>
+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_).
 
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
 
-<pre class="syntaxbox">tokenList.values();</pre>
+    tokenList.values();
 
-<h3 id="Paramètres">Paramètres</h3>
+### Paramètres
 
-<p>Aucun.</p>
+Aucun.
 
-<h3 id="Valeur_retournée">Valeur retournée</h3>
+### Valeur retournée
 
-<p>Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.</p>
+Renvoie un {{jsxref("Les_protocoles_iteration","itérateur")}}.
 
-<h2 id="Exemples">Exemples</h2>
+## Exemples
 
-<p>Dans l'exemple suivant, nous récupérons la liste des classes définies dans un élément {{htmlelement("span")}} en tant que <code>DOMTokenList</code> en utilisant {{domxref("Element.classList")}}. Si nous récupérons un itérateur contenant les valeurs en utilisant <code>values()</code>, nous les itérons alors en utilisant une boucle <a href="/en-US/docs/Web/JavaScript/Reference/Statements/for...of">for ... of</a> et écrivons chacune dans le {{domxref("Node.textContent")}} du <code>&lt;span&gt;</code>.</p>
+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](/en-US/docs/Web/JavaScript/Reference/Statements/for...of) et écrivons chacune dans le {{domxref("Node.textContent")}} du `<span>`.
 
-<p>D'abord, le HTML :</p>
+D'abord, le HTML :
 
-<pre class="brush: html">&lt;span class="a b c"&gt;&lt;/span&gt;</pre>
+```html
+<span class="a b c"></span>
+```
 
-<p>Maintenant le JavaScript :</p>
+Maintenant le JavaScript :
 
-<pre class="brush: js">var span = document.querySelector("span");
+```js
+var span = document.querySelector("span");
 var classes = span.classList;
 var iterator = classes.values();
 
 for(var value of iterator) {
   span.textContent += value + ' ++ ';
-}</pre>
+}
+```
 
-<p>La sortie ressemble à ceci :</p>
+La sortie ressemble à ceci :
 
-<p>{{ EmbedLiveSample('Examples', '100%', 60) }}</p>
+{{ EmbedLiveSample('Examples', '100%', 60) }}
 
-<h2 id="Spécifications">Spécifications</h2>
+## Spécifications
 
-<table class="standard-table">
- <tbody>
-  <tr>
-   <th scope="col">Spécification</th>
-   <th scope="col">Statut</th>
-   <th scope="col">Commentaire</th>
-  </tr>
-  <tr>
-   <td>{{SpecName('DOM WHATWG','#interface-domtokenList','values() (as iterable&lt;Node&gt;)')}}</td>
-   <td>{{Spec2('DOM WHATWG')}}</td>
-   <td>Définition initiale</td>
-  </tr>
- </tbody>
-</table>
+| Spécification                                                                                                            | Statut                           | Commentaire         |
+| ------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | ------------------- |
+| {{SpecName('DOM WHATWG','#interface-domtokenList','values() (as iterable&lt;Node&gt;)')}} | {{Spec2('DOM WHATWG')}} | Définition initiale |
 
-<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+## Compatibilité des navigateurs
 
-<div>{{Compat("api.DOMTokenList.values")}}</div>
\ No newline at end of file
+{{Compat("api.DOMTokenList.values")}}