From 33058f2b292b3a581333bdfb21b8f671898c5060 Mon Sep 17 00:00:00 2001 From: Peter Bengtsson Date: Tue, 8 Dec 2020 14:40:17 -0500 Subject: initial commit --- .../web/api/element/insertadjacenthtml/index.html | 102 +++++++++++++++++++++ 1 file changed, 102 insertions(+) create mode 100644 files/fr/web/api/element/insertadjacenthtml/index.html (limited to 'files/fr/web/api/element/insertadjacenthtml/index.html') diff --git a/files/fr/web/api/element/insertadjacenthtml/index.html b/files/fr/web/api/element/insertadjacenthtml/index.html new file mode 100644 index 0000000000..cbf56853b6 --- /dev/null +++ b/files/fr/web/api/element/insertadjacenthtml/index.html @@ -0,0 +1,102 @@ +--- +title: element.insertAdjacentHTML +slug: Web/API/Element/insertAdjacentHTML +tags: + - API + - DOM + - Méthode + - Reference +translation_of: Web/API/Element/insertAdjacentHTML +--- +
{{APIRef("DOM")}}
+ +

insertAdjacentHTML() analyse le texte spécifié en tant que HTML ou XML et insère les noeuds résultants dans le DOM à la position spécifiée. L'élement qui est utilisé n'est pas  réanalysé et les élements qu'il contient ne sont donc pas corrompus. Ceci, et le fait d'éviter la sérialisation supplémentaire, rend la fonction plus rapide et directe que innerHTML.

+ +

Syntaxe

+ +
element.insertAdjacentHTML(position, text);
+ +

Paramètres

+ +
+
position 
+
une {{domxref("DOMString")}}  représentant la position relative à l'element, et doit être une des chaînes de caractères suivantes :
+
+ + + +
+
text
+
 est la chaîne de caractères qui doit être analysée en tant qu'HTML ou XML et insérée dans l'arbre du DOM.
+
+ +

Visualisation des noms de position

+ +
+
+
<!-- beforebegin -->
+<p>
+  <!-- afterbegin -->
+  foo
+  <!-- beforeend -->
+</p>
+<!-- afterend -->
+
+
+ +
Note : Les positions beforebegin et afterend ne fonctionnent que si le noeud est un arbre et a un élément parent.
+ +

Exemple

+ +
// <div id="one">one</div>
+var d1 = document.getElementById('one');
+d1.insertAdjacentHTML('afterend', '<div id="two">two</div>');
+
+// Ici la nouvelle structure est :
+// <div id="one">one</div><div id="two">two</div>
+ +

Notes

+ +

Considérations de sécurité

+ +

Lorsque vous insérez du code HTML dans une page en utilisant insertAdjacentHTML, veillez à ne pas utiliser d'entrée utilisateur qui n'a pas été échappée.

+ +

Il est recommandé de ne pas utiliser insertAdjacentHTML lors de l'insertion de texte brut; à la place, utilisez la propriété node.textContent ou la méthode node.insertAdjacentText(). Cela n'interprète pas le contenu transmis au format HTML, mais l'insère à la place sous forme de texte brut.

+ +

Spécification

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM Parsing', '#widl-Element-insertAdjacentHTML-void-DOMString-position-DOMString-text', 'Element.insertAdjacentHTML()')}}{{ Spec2('DOM Parsing') }}
+ +

Compatibilité des navigateurs

+ + + +

{{Compat("api.Element.insertAdjacentHTML")}}

+ +

Voir aussi

+ + -- cgit v1.2.3-54-g00ecf