diff options
| author | julieng <julien.gattelier@gmail.com> | 2021-10-02 17:20:24 +0200 |
|---|---|---|
| committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-10-02 17:30:20 +0200 |
| commit | 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde (patch) | |
| tree | 30a56efd3eff3a01bd1611e1840fdbbfacf544a4 /files/fr/web/api/node/appendchild | |
| parent | c05efa8d7ae464235cf83d7c0956e42dc6974103 (diff) | |
| download | translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.gz translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.bz2 translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.zip | |
convert content to md
Diffstat (limited to 'files/fr/web/api/node/appendchild')
| -rw-r--r-- | files/fr/web/api/node/appendchild/index.md | 116 |
1 files changed, 45 insertions, 71 deletions
diff --git a/files/fr/web/api/node/appendchild/index.md b/files/fr/web/api/node/appendchild/index.md index 800be4c3bb..c71ba507b3 100644 --- a/files/fr/web/api/node/appendchild/index.md +++ b/files/fr/web/api/node/appendchild/index.md @@ -10,90 +10,64 @@ tags: - Noeuds translation_of: Web/API/Node/appendChild --- -<p>{{APIRef("DOM")}}</p> +{{APIRef("DOM")}} -<p>La méthode <code><strong>Node.appendChild()</strong></code> ajoute un nœud à la fin de la liste des enfants d'un nœud parent spécifié. Si l'enfant donné est une référence à un nœud existant dans le document, <code>appendChild()</code> le déplace de sa position actuelle vers une nouvelle position (il n'est pas nécessaire de supprimer le noeud sur son noeud parent avant de l'ajouter à un autre).</p> +La méthode **`Node.appendChild()`** ajoute un nœud à la fin de la liste des enfants d'un nœud parent spécifié. Si l'enfant donné est une référence à un nœud existant dans le document, `appendChild()` le déplace de sa position actuelle vers une nouvelle position (il n'est pas nécessaire de supprimer le noeud sur son noeud parent avant de l'ajouter à un autre). -<p>Cela signifie qu'un noeud ne peut pas être à deux points du document simultanément. Donc, si le nœud a déjà un parent, le nœud est d'abord retiré, puis ajouté à la nouvelle position. Le {{domxref("Node.cloneNode()")}} peut être utilisé pour réaliser une copie de noeud avant de l'ajouter à son nouveau parent. Notez que les copies faites avec <code>cloneNode</code> ne seront pas automatiquement synchronisées.</p> +Cela signifie qu'un noeud ne peut pas être à deux points du document simultanément. Donc, si le nœud a déjà un parent, le nœud est d'abord retiré, puis ajouté à la nouvelle position. Le {{domxref("Node.cloneNode()")}} peut être utilisé pour réaliser une copie de noeud avant de l'ajouter à son nouveau parent. Notez que les copies faites avec `cloneNode` ne seront pas automatiquement synchronisées. -<p>Si l'enfant donné est un {{domxref("DocumentFragment")}} , le contenu entier du {{domxref("DocumentFragment")}} est déplacé dans la liste d'enfants du noeud parent spécifié.</p> +Si l'enfant donné est un {{domxref("DocumentFragment")}} , le contenu entier du {{domxref("DocumentFragment")}} est déplacé dans la liste d'enfants du noeud parent spécifié. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="eval">var <em>elementAjoute</em> = <em>element</em>.appendChild(<em>enfant</em>); -</pre> + var elementAjoute = element.appendChild(enfant); -<h3 id="Paramètres">Paramètres</h3> +### Paramètres -<dl> - <dt><strong>enfant</strong></dt> - <dd>Le noeud à ajouter au noeud parent donné (généralement un élément).</dd> -</dl> +- **enfant** + - : Le noeud à ajouter au noeud parent donné (généralement un élément). -<h3 id="Valeur_renvoyée">Valeur renvoyée</h3> +### Valeur renvoyée -<p>La valeur renvoyée est l'enfant ajouté sauf si l'enfant donné est un {{domxref ("DocumentFragment")}}, auquel cas le {{domxref ("DocumentFragment")}} vide est renvoyé.</p> +La valeur renvoyée est l'enfant ajouté sauf si l'enfant donné est un {{domxref ("DocumentFragment")}}, auquel cas le {{domxref ("DocumentFragment")}} vide est renvoyé. -<h2 id="Notes">Notes</h2> +## Notes -<p>Le chaînage peut ne pas fonctionner comme prévu en raison de <code>appendChild()</code> renvoyant l'élément enfant :</p> +Le chaînage peut ne pas fonctionner comme prévu en raison de `appendChild()` renvoyant l'élément enfant : -<pre class="brush: js">var aBlock = doc.createElement('block').appendChild(doc.createElement('b'));</pre> +```js +var aBlock = doc.createElement('block').appendChild(doc.createElement('b')); +``` -<p>Définit <code>aBlock</code> pour <code><b></b></code> uniquement, ce que vous ne voulez probablement pas.</p> +Définit `aBlock` pour `<b></b>` uniquement, ce que vous ne voulez probablement pas. -<h2 id="Exemple">Exemple</h2> +## Exemple -<pre class="brush:js">// Crée un nouvel élément paragraphe et l'ajoute à la fin du corps du document +```js +// Crée un nouvel élément paragraphe et l'ajoute à la fin du corps du document var p = document.createElement("p"); -document.body.appendChild(p);</pre> - -<h2 id="Spécification">Spécification</h2> - -<p> </p> - -<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', '#dom-node-appendchild', 'Node.appendChild()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>Pas de changement de {{SpecName("DOM3 Core")}}.</td> - </tr> - <tr> - <td>{{SpecName('DOM3 Core', 'core.html#ID-184E7107', 'Node.appendChild()')}}</td> - <td>{{Spec2('DOM3 Core')}}</td> - <td>Pas de changement de {{SpecName("DOM2 Core")}}.</td> - </tr> - <tr> - <td>{{SpecName('DOM2 Core', 'core.html#ID-184E7107', 'Node.appendChild()')}}</td> - <td>{{Spec2('DOM2 Core')}}</td> - <td>Pas de changement de {{SpecName("DOM1")}}.</td> - </tr> - <tr> - <td>{{SpecName('DOM1', 'level-one-core.html#ID-184E7107', 'Node.appendChild()')}}</td> - <td>{{Spec2('DOM1')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Node.appendChild")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li>{{domxref("Node.removeChild")}}</li> - <li>{{domxref("Node.replaceChild")}}</li> - <li>{{domxref("Node.insertBefore")}}</li> - <li>{{domxref("Node.hasChildNodes")}}</li> - <li>{{domxref("ParentNode.append()")}}</li> -</ul> +document.body.appendChild(p); +``` + +## Spécification + + + +| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------------------------------------------------ | +| {{SpecName('DOM WHATWG', '#dom-node-appendchild', 'Node.appendChild()')}} | {{Spec2('DOM WHATWG')}} | Pas de changement de {{SpecName("DOM3 Core")}}. | +| {{SpecName('DOM3 Core', 'core.html#ID-184E7107', 'Node.appendChild()')}} | {{Spec2('DOM3 Core')}} | Pas de changement de {{SpecName("DOM2 Core")}}. | +| {{SpecName('DOM2 Core', 'core.html#ID-184E7107', 'Node.appendChild()')}} | {{Spec2('DOM2 Core')}} | Pas de changement de {{SpecName("DOM1")}}. | +| {{SpecName('DOM1', 'level-one-core.html#ID-184E7107', 'Node.appendChild()')}} | {{Spec2('DOM1')}} | Définition initiale. | + +## Compatibilité des navigateurs + +{{Compat("api.Node.appendChild")}} + +## Voir aussi + +- {{domxref("Node.removeChild")}} +- {{domxref("Node.replaceChild")}} +- {{domxref("Node.insertBefore")}} +- {{domxref("Node.hasChildNodes")}} +- {{domxref("ParentNode.append()")}} |
