From c05efa8d7ae464235cf83d7c0956e42dc6974103 Mon Sep 17 00:00:00 2001 From: julieng Date: Sat, 2 Oct 2021 17:20:14 +0200 Subject: move *.html to *.md --- .../api/document/createdocumentfragment/index.html | 87 ---------------------- .../api/document/createdocumentfragment/index.md | 87 ++++++++++++++++++++++ 2 files changed, 87 insertions(+), 87 deletions(-) delete mode 100644 files/fr/web/api/document/createdocumentfragment/index.html create mode 100644 files/fr/web/api/document/createdocumentfragment/index.md (limited to 'files/fr/web/api/document/createdocumentfragment') diff --git a/files/fr/web/api/document/createdocumentfragment/index.html b/files/fr/web/api/document/createdocumentfragment/index.html deleted file mode 100644 index 629d26ed27..0000000000 --- a/files/fr/web/api/document/createdocumentfragment/index.html +++ /dev/null @@ -1,87 +0,0 @@ ---- -title: document.createDocumentFragment -slug: Web/API/Document/createDocumentFragment -tags: - - API - - DOM - - Document - - HTML - - Méthode - - Reference -translation_of: Web/API/Document/createDocumentFragment ---- -
{{ApiRef("DOM")}}
- -

Crée un nouvel objet vide de type {{domxref("DocumentFragment")}}.

- -

Syntaxe

- -
var fragment = document.createDocumentFragment();
-
- -

fragment est une référence vers un objet vide de type {{domxref("DocumentFragment")}} .

- -

Description

- -

Les objets DocumentFragments sont analogues à des nœuds du DOM, mais ne font jamais partie de l'arbre DOM. Le cas d'usage le plus courant consiste à créer un fragment pour y stocker des éléments, puis à ajouter en une seule opération le fragment à l'arbre DOM, ce qui a pour effet de le remplacer par tous ses éléments enfants.

- -

Le principal avantage de cette méthode de mise à jour du DOM vient du fait que le fragment est stocké en mémoire, et pas dans l'arbre DOM lui-même, de sorte que le modifier ne déclenche pas de reflow (le calcul des positions et de la géométrie de chacun des éléments de la page affichée). Par conséquent, l´utilisation de fragments pour effectuer des mises à jour du DOM donne souvent lieu à une amélioration des performances.

- -

Exemple

- -

Cet exemple crée une liste des principaux navigateurs du web.

- -

HTML

- -
<ul id="ul">
-</ul>
- -

JavaScript

- -
var element  = document.getElementById('ul'); // en supposant qu'ul existe
-var fragment = document.createDocumentFragment();
-var browsers = ['Firefox', 'Chrome', 'Opera',
-    'Safari', 'Internet Explorer'];
-
-browsers.forEach(function(browser) {
-    var li = document.createElement('li');
-    li.textContent = browser;
-    fragment.appendChild(li);
-});
-
-element.appendChild(fragment);
- -

Résultat

- -

{{EmbedLiveSample("Example", 600, 140)}}

- -

Spécification

- - - - - - - - - - - - - - - - -
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG', '#dom-document-createdocumentfragment', 'Document.createDocumentFragment()')}}{{Spec2('DOM WHATWG')}}Définition initiale dans la spécification DOM 1.
- -

Compatibilité des navigateurs

- -

{{Compat("api.Document.createDocumentFragment")}}

- -

Voir aussi

- - - diff --git a/files/fr/web/api/document/createdocumentfragment/index.md b/files/fr/web/api/document/createdocumentfragment/index.md new file mode 100644 index 0000000000..629d26ed27 --- /dev/null +++ b/files/fr/web/api/document/createdocumentfragment/index.md @@ -0,0 +1,87 @@ +--- +title: document.createDocumentFragment +slug: Web/API/Document/createDocumentFragment +tags: + - API + - DOM + - Document + - HTML + - Méthode + - Reference +translation_of: Web/API/Document/createDocumentFragment +--- +
{{ApiRef("DOM")}}
+ +

Crée un nouvel objet vide de type {{domxref("DocumentFragment")}}.

+ +

Syntaxe

+ +
var fragment = document.createDocumentFragment();
+
+ +

fragment est une référence vers un objet vide de type {{domxref("DocumentFragment")}} .

+ +

Description

+ +

Les objets DocumentFragments sont analogues à des nœuds du DOM, mais ne font jamais partie de l'arbre DOM. Le cas d'usage le plus courant consiste à créer un fragment pour y stocker des éléments, puis à ajouter en une seule opération le fragment à l'arbre DOM, ce qui a pour effet de le remplacer par tous ses éléments enfants.

+ +

Le principal avantage de cette méthode de mise à jour du DOM vient du fait que le fragment est stocké en mémoire, et pas dans l'arbre DOM lui-même, de sorte que le modifier ne déclenche pas de reflow (le calcul des positions et de la géométrie de chacun des éléments de la page affichée). Par conséquent, l´utilisation de fragments pour effectuer des mises à jour du DOM donne souvent lieu à une amélioration des performances.

+ +

Exemple

+ +

Cet exemple crée une liste des principaux navigateurs du web.

+ +

HTML

+ +
<ul id="ul">
+</ul>
+ +

JavaScript

+ +
var element  = document.getElementById('ul'); // en supposant qu'ul existe
+var fragment = document.createDocumentFragment();
+var browsers = ['Firefox', 'Chrome', 'Opera',
+    'Safari', 'Internet Explorer'];
+
+browsers.forEach(function(browser) {
+    var li = document.createElement('li');
+    li.textContent = browser;
+    fragment.appendChild(li);
+});
+
+element.appendChild(fragment);
+ +

Résultat

+ +

{{EmbedLiveSample("Example", 600, 140)}}

+ +

Spécification

+ + + + + + + + + + + + + + + + +
SpécificationStatutCommentaire
{{SpecName('DOM WHATWG', '#dom-document-createdocumentfragment', 'Document.createDocumentFragment()')}}{{Spec2('DOM WHATWG')}}Définition initiale dans la spécification DOM 1.
+ +

Compatibilité des navigateurs

+ +

{{Compat("api.Document.createDocumentFragment")}}

+ +

Voir aussi

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