diff options
Diffstat (limited to 'files/fr/web/api/node')
31 files changed, 313 insertions, 349 deletions
diff --git a/files/fr/web/api/node/appendchild/index.html b/files/fr/web/api/node/appendchild/index.html index 5f01da03c8..800be4c3bb 100644 --- a/files/fr/web/api/node/appendchild/index.html +++ b/files/fr/web/api/node/appendchild/index.html @@ -32,21 +32,21 @@ translation_of: Web/API/Node/appendChild <h3 id="Valeur_renvoyée">Valeur renvoyée</h3> -<p>La valeur renvoyée <span id="result_box" lang="fr"><span>est l'enfant ajouté sauf si l'enfant donné est un {{domxref ("DocumentFragment")}}, auquel cas le {{domxref ("DocumentFragment")}} vide est renvoyé.</span></span></p> +<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> <h2 id="Notes">Notes</h2> <p>Le chaînage peut ne pas fonctionner comme prévu en raison de <code>appendChild()</code> renvoyant l'élément enfant :</p> -<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">var</span> aBlock <span class="operator token">=</span> doc<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">'block'</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>doc<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">'b'</span><span class="punctuation token">)</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> +<pre class="brush: js">var aBlock = doc.createElement('block').appendChild(doc.createElement('b'));</pre> <p>Définit <code>aBlock</code> pour <code><b></b></code> uniquement, ce que vous ne voulez probablement pas.</p> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> -<pre class="brush:js line-numbers language-js"><code class="language-js"><span class="comment token">// Crée un nouvel élément paragraphe et l'ajoute à la fin du corps du document</span> -<span class="keyword token">var</span> p <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">createElement</span><span class="punctuation token">(</span><span class="string token">"p"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">appendChild</span><span class="punctuation token">(</span>p<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> +<pre class="brush: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> diff --git a/files/fr/web/api/node/baseuri/index.html b/files/fr/web/api/node/baseuri/index.html index cc52dd42cf..68cf5be1bc 100644 --- a/files/fr/web/api/node/baseuri/index.html +++ b/files/fr/web/api/node/baseuri/index.html @@ -18,11 +18,11 @@ translation_of: Web/API/Node/baseURI <p>La propriété en lecture seule <code><strong>Node.baseURI</strong></code> renvoie l'URL de base absolue d'un noeud.</p> -<p>L'URL de base est utilisée pour <a href="http://developers.whatwg.org/urls.html#resolving-urls">résoudre</a> les URL relatives quand le navigateur a besoin d'obtenir une URL absolue, par exemple lors du traitement de l'attribut <code>src</code> en HTML ou XML <code><a href="https://developer.mozilla.org/fr/docs/Glossaire/XLink">xlink</a>:href</code> d'un élément {{HTMLElement("img")}} HTML.</p> +<p>L'URL de base est utilisée pour <a href="http://developers.whatwg.org/urls.html#resolving-urls">résoudre</a> les URL relatives quand le navigateur a besoin d'obtenir une URL absolue, par exemple lors du traitement de l'attribut <code>src</code> en HTML ou XML <code><a href="/fr/docs/Glossaire/XLink">xlink</a>:href</code> d'un élément {{HTMLElement("img")}} HTML.</p> -<p>En général, l'URL de base est simplement l'emplacement du document, mais elle peut être affectée par de nombreux facteurs, y compris l'élément {{HTMLElement("base")}} en HTML et l'attribut <code><a href="https://developer.mozilla.org/fr/docs/Introduction_%C3%A0_XML/xml:base">xml:base</a></code> en XML.</p> +<p>En général, l'URL de base est simplement l'emplacement du document, mais elle peut être affectée par de nombreux facteurs, y compris l'élément {{HTMLElement("base")}} en HTML et l'attribut <code><a href="/fr/docs/Introduction_%C3%A0_XML/xml:base">xml:base</a></code> en XML.</p> -<h2 id="Syntax" name="Syntax">Syntaxe</h2> +<h2 id="Syntax">Syntaxe</h2> <pre class="syntaxbox">var <em>baseURI</em> = <em>node</em>.baseURI; </pre> @@ -33,7 +33,7 @@ translation_of: Web/API/Node/baseURI <li><code><em>node</em>.baseURI</code> peut changer avec le temps (voir ci-dessous).</li> </ul> -<h2 id="Details" name="Details">Détails</h2> +<h2 id="Details">Détails</h2> <h3 id="L'URL_de_base_d'un_document">L'URL de base d'un document</h3> @@ -52,11 +52,11 @@ translation_of: Web/API/Node/baseURI <p>L'URL de base d'un <em>element</em> en HTML est normalement équivalente à celle du document dans lequel se trouve le noeud.</p> -<p>Si le document contient des attributs <code><a href="https://developer.mozilla.org/fr/docs/Introduction_%C3%A0_XML/xml:base">xml:base</a></code> (ce que vous ne devriez pas faire dans les documents HTML), l'<code><em>element</em>.baseURI</code> prend en compte l'attribut <code>xml:base</code> des parents de l'élément lors du calcul de l'URL de base. Voir <a href="https://developer.mozilla.org/fr/docs/Introduction_%C3%A0_XML/xml:base">xml:base</a> pour plus de détails.</p> +<p>Si le document contient des attributs <code><a href="/fr/docs/Introduction_%C3%A0_XML/xml:base">xml:base</a></code> (ce que vous ne devriez pas faire dans les documents HTML), l'<code><em>element</em>.baseURI</code> prend en compte l'attribut <code>xml:base</code> des parents de l'élément lors du calcul de l'URL de base. Voir <a href="/fr/docs/Introduction_%C3%A0_XML/xml:base">xml:base</a> pour plus de détails.</p> <p>Vous pouvez utiliser <code><em>{{domxref("element")}}</em>.baseURI</code> pour obtenir l'URL de base d'un élément.</p> -<h2 id="Specification" name="Specification">Spécification</h2> +<h2 id="Specification">Spécification</h2> <ul> <li>{{spec("http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-baseURI","DOM Level 3 Core: baseURI","REC")}}</li> @@ -66,6 +66,6 @@ translation_of: Web/API/Node/baseURI <ul> <li>l'élément {{HTMLElement("base")}} (HTML)</li> - <li>l'attribut <code><a href="https://developer.mozilla.org/fr/docs/Introduction_%C3%A0_XML/xml:base">xml:base</a></code> (documents XML).</li> + <li>l'attribut <code><a href="/fr/docs/Introduction_%C3%A0_XML/xml:base">xml:base</a></code> (documents XML).</li> <li>{{domxref("Node.baseURIObject")}} - une variante de cette API pour les add-ons Mozilla et le code interne. Renvoie l'URL de base en tant que {{interface("nsIURI")}}.</li> </ul> diff --git a/files/fr/web/api/node/childnodes/index.html b/files/fr/web/api/node/childnodes/index.html index af687c7c99..b9f4630ffc 100644 --- a/files/fr/web/api/node/childnodes/index.html +++ b/files/fr/web/api/node/childnodes/index.html @@ -13,42 +13,42 @@ translation_of: Web/API/Node/childNodes <p>La propriété en lecture seule <code><strong>Node.childNodes</strong></code> renvoie une {{domxref("NodeList")}} (<em>liste de noeuds</em>) de {{domxref("Node","noeuds")}} enfants de l'élément donné avec le premier noeud enfant affecté à l'index 0.</p> -<h2 id="Syntaxe_et_valeurs" name="Syntaxe_et_valeurs">Syntaxe</h2> +<h2 id="Syntaxe_et_valeurs">Syntaxe</h2> -<pre class="eval"><a href="/fr/Référence_de_JavaScript_1.5_Core/Instructions/var" title="https://developer.mozilla.org/fr/Référence_de_JavaScript_1.5_Core/Instructions/var"><span style="color: #800080;">var</span></a> <var>collNoeuds</var> = elementDeReference.<a href="/fr/DOM/element.childNodes" title="https://developer.mozilla.org/fr/DOM/element.childNodes">childNodes</a>; +<pre class="eval"><a href="/fr/Référence_de_JavaScript_1.5_Core/Instructions/var">var</a> <var>collNoeuds</var> = elementDeReference.<a href="/fr/DOM/element.childNodes">childNodes</a>; </pre> <h2 id="Exemples">Exemples</h2> <h3 id="Utilisation_simple">Utilisation simple</h3> -<pre class="brush:js line-numbers language-js"><code class="language-js"><span class="comment token">// parg est une référence d'objet pour un élément <p></span> +<pre class="brush:js">// parg est une référence d'objet pour un élément <p> -<span class="comment token">// D'abord vérifier que l'élément a des noeuds enfants </span> -<span class="keyword token">if</span> <span class="punctuation token">(</span>parg<span class="punctuation token">.</span><span class="function token">hasChildNodes</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">var</span> children <span class="operator token">=</span> parg<span class="punctuation token">.</span>childNodes<span class="punctuation token">;</span> +// D'abord vérifier que l'élément a des noeuds enfants +if (parg.hasChildNodes()) { + var children = parg.childNodes; - <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> i <span class="operator token">=</span> <span class="number token">0</span><span class="punctuation token">;</span> i <span class="operator token"><</span> children<span class="punctuation token">.</span>length<span class="punctuation token">;</span> i<span class="operator token">++</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="comment token">// faire quelque chose avec chaque enfant[i]</span> - <span class="comment token">// NOTE: La liste est en ligne, l'ajout ou la suppression des enfants changera la liste</span> - <span class="punctuation token">}</span> -<span class="punctuation token">}</span></code></pre> + for (var i = 0; i < children.length; i++) { + // faire quelque chose avec chaque enfant[i] + // NOTE: La liste est en ligne, l'ajout ou la suppression des enfants changera la liste + } +}</pre> <h3 id="Supprimer_tous_les_enfants_d'un_nom">Supprimer tous les enfants d'un nom</h3> -<pre><span style="color: #999999;">// Voici une manière de supprimer tous les enfants d'un nœud -// (boite est une référence à un élément ayant des enfants)</span> -<a href="/fr/Référence_de_JavaScript_1.5_Core/Instructions/while" title="https://developer.mozilla.org/fr/Référence_de_JavaScript_1.5_Core/Instructions/while">while</a>( boite.<a href="/fr/DOM/element.firstChild" title="https://developer.mozilla.org/fr/DOM/element.firstChild">firstChild</a>) { - <span style="color: #999999;">// La liste n'est pas une copie, elle sera donc réindexée à chaque appel</span> - boite.<a href="/fr/DOM/element.removeChild" title="https://developer.mozilla.org/fr/DOM/element.removeChild">removeChild</a>( boite.<a href="/fr/DOM/element.firstChild" title="https://developer.mozilla.org/fr/DOM/element.firstChild">firstChild</a>); +<pre>// Voici une manière de supprimer tous les enfants d'un nœud +// (boite est une référence à un élément ayant des enfants) +<a href="/fr/Référence_de_JavaScript_1.5_Core/Instructions/while">while</a>( boite.<a href="/fr/DOM/element.firstChild">firstChild</a>) { + // La liste n'est pas une copie, elle sera donc réindexée à chaque appel + boite.<a href="/fr/DOM/element.removeChild">removeChild</a>( boite.<a href="/fr/DOM/element.firstChild">firstChild</a>); } </pre> -<h2 id="Notes" name="Notes">Notes</h2> +<h2 id="Notes">Notes</h2> <p>Les éléments de la collection de noeuds sont des objets et non des chaînes de caractères. Pour en obtenir les données, vous devez utiliser leurs propriétés (par exemple <code>elementNodeReference.childNodes[1].nodeName</code> pour obtenir son nom, etc.)</p> -<p>L'objet <a href="/fr/DOM/document" title="https://developer.mozilla.org/fr/DOM/document"><code>document</code></a> lui-même a deux enfants : la déclaration <a href="/fr/DOM/document.doctype" title="https://developer.mozilla.org/fr/DOM/document.doctype">Doctype</a> et l'élément racine, généralement appelés <code>documentElement</code> . (Dans les documents (X)HTML il s'agit d'éléments <a href="/fr/HTML/Element/html" title="https://developer.mozilla.org/fr/HTML/Element/html"><code>HTML</code></a>).</p> +<p>L'objet <a href="/fr/DOM/document"><code>document</code></a> lui-même a deux enfants : la déclaration <a href="/fr/DOM/document.doctype">Doctype</a> et l'élément racine, généralement appelés <code>documentElement</code> . (Dans les documents (X)HTML il s'agit d'éléments <a href="/fr/HTML/Element/html"><code>HTML</code></a>).</p> <p><code>childNodes</code> inclut tous les noeuds enfants, y compris les noeuds qui ne sont pas des éléments comme les noeuds texte et commentaire. Pour obtenir une collection des seuls éléments, utilisez {{domxref("ParentNode.children")}} à la place.</p> diff --git a/files/fr/web/api/node/clonenode/index.html b/files/fr/web/api/node/clonenode/index.html index 7e342018f1..fef79935dc 100644 --- a/files/fr/web/api/node/clonenode/index.html +++ b/files/fr/web/api/node/clonenode/index.html @@ -13,7 +13,7 @@ translation_of: Web/API/Node/cloneNode <p>La méthode <strong><code>Node.cloneNode()</code></strong> renvoie une copie du nœud sur lequel elle a été appelée.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox">var <em><var>dupNode</var></em> = <em><var>node</var></em>.cloneNode([<em><var>deep]</var></em>); </pre> @@ -33,15 +33,15 @@ translation_of: Web/API/Node/cloneNode <p>Le comportement a été modifié dans la dernière spécification et, s'il est omis, la méthode doit agir comme si la valeur de <code>deep</code> était <strong><code>false</code></strong>. Bien que ce soit toujours facultatif, vous devriez toujours fournir l'argument <code>deep</code> pour la compatibilité amont et aval. Avec Gecko 28.0 {{geckoRelease(28)}}), la console a averti les développeurs de ne pas omettre l'argument. À partir de Gecko 29.0 {{geckoRelease(29)}}), un clone superficiel est défini par défaut au lieu d'un clone profond.</p> </div> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> <pre>p = document.getElementById("para1"); p_prime = p.cloneNode(true); </pre> -<h2 id="Notes" name="Notes">Notes</h2> +<h2 id="Notes">Notes</h2> -<p>Cloner un nœud copie tous ses attributs ainsi que leurs valeurs, y compris les auditeurs intrinsèques (en ligne). Il ne copie pas les auditeurs d'évènement ajoutés avec <a href="https://developer.mozilla.org/en-US/docs/DOM/element.addEventListener"><code>addEventListener()</code></a> ou ceux assignés au propriétés d'éléments (par exemple <code>node.onclick = fn</code>). De plus, pour un élément {{HTMLElement("canvas")}} l'image peinte n'est pas copiée.</p> +<p>Cloner un nœud copie tous ses attributs ainsi que leurs valeurs, y compris les auditeurs intrinsèques (en ligne). Il ne copie pas les auditeurs d'évènement ajoutés avec <a href="/en-US/docs/DOM/element.addEventListener"><code>addEventListener()</code></a> ou ceux assignés au propriétés d'éléments (par exemple <code>node.onclick = fn</code>). De plus, pour un élément {{HTMLElement("canvas")}} l'image peinte n'est pas copiée.</p> <p>Le nœud dupliqué renvoyé par <code>cloneNode</code> ne fera pas partie du document tant qu'il n'y est pas ajouté via la méthode {{domxref("Node.appendChild()")}} ou une méthode similaire. De même, il n'a pas de parent tant qu'il n'a pas été ajouté à un autre nœud.</p> @@ -58,7 +58,7 @@ p_prime = p.cloneNode(true); <p>Pour cloner un noeud à ajouter dans un document différent, utilisez {{domxref("Document.importNode()")}} à la place.</p> -<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h3> +<h3 id="Sp.C3.A9cification">Spécification</h3> <table class="standard-table"> <thead> diff --git a/files/fr/web/api/node/comparedocumentposition/index.html b/files/fr/web/api/node/comparedocumentposition/index.html index e5b81bcb4b..a40125b5c1 100644 --- a/files/fr/web/api/node/comparedocumentposition/index.html +++ b/files/fr/web/api/node/comparedocumentposition/index.html @@ -51,12 +51,12 @@ translation_of: Web/API/Node/compareDocumentPosition </tbody> </table> -<h2 id="Syntax" name="Syntax">Syntaxe</h2> +<h2 id="Syntax">Syntaxe</h2> <pre class="syntaxbox"><em>node</em>.compareDocumentPosition( <em>otherNode</em> ) </pre> -<h2 id="Example" name="Example">Exemple</h2> +<h2 id="Example">Exemple</h2> <pre class="brush:js">var head = document.getElementsByTagName('head').item(0); @@ -68,16 +68,16 @@ if (head.compareDocumentPosition(document.body) & Node.DOCUMENT_POSITION_FOL </pre> <div class="note"> -<p><strong>Note :</strong> Parce que le résultat renvoyé par<em> </em><code>compareDocumentPosition</code> est un masque de bits, des <a href="https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires" title="/en-US/docs/Core_JavaScript_1.5_Guide/Operators/Bitwise_Operators">opérateurs binaires</a> doivent être utilisés pour des résultats significatifs.</p> +<p><strong>Note :</strong> Parce que le résultat renvoyé par<em> </em><code>compareDocumentPosition</code> est un masque de bits, des <a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/Op%C3%A9rateurs_binaires">opérateurs binaires</a> doivent être utilisés pour des résultats significatifs.</p> </div> <div class="note"> <p><strong>Note :</strong> La première instruction utilise l' <code>item(0)</code> de la méthode <a href="/en-US/docs/Web/API/NodeList/item">NodeList</a> , qui est l'équivalent de <code>getElementsByTagName('head')[0].</code></p> </div> -<h2 id="Specification" name="Specification">Spécifications</h2> +<h2 id="Specification">Spécifications</h2> -<table class="spectable standard-table"> +<table class="standard-table"> <tbody> <tr> <th scope="col">Spécification</th> @@ -104,5 +104,5 @@ if (head.compareDocumentPosition(document.body) & Node.DOCUMENT_POSITION_FOL <h2 id="Voir_aussi">Voir aussi</h2> <ul> - <li><code><a href="https://developer.mozilla.org/fr/docs/Web/API/Node/contains" title="/en-US/docs/DOM/Node.contains">Node.contains</a></code></li> + <li><code><a href="/fr/docs/Web/API/Node/contains">Node.contains</a></code></li> </ul> diff --git a/files/fr/web/api/node/contains/index.html b/files/fr/web/api/node/contains/index.html index 5b7f4c23e5..e5906fbf28 100644 --- a/files/fr/web/api/node/contains/index.html +++ b/files/fr/web/api/node/contains/index.html @@ -18,9 +18,9 @@ translation_of: Web/API/Node/contains <pre class="syntaxbox">node.contains( otherNode ) </pre> -<h2 id="Example" name="Example">Exemple</h2> +<h2 id="Example">Exemple</h2> -<p>Cette fonction vérifie si un élément est dans le corps de la page. Comme <code>contains</code> est inclusif, déterminer si le corps est contenu en lui-même n'est pas le but de <code>isInPage<font face="Open Sans, sans-serif">,</font></code><font face="Open Sans, sans-serif"> donc ce cas renvoie </font><code>false</code>.</p> +<p>Cette fonction vérifie si un élément est dans le corps de la page. Comme <code>contains</code> est inclusif, déterminer si le corps est contenu en lui-même n'est pas le but de <code>isInPage,</code> donc ce cas renvoie <code>false</code>.</p> <pre class="brush:js">function isInPage(node) { return (node === document.body) ? false : document.body.contains(node); diff --git a/files/fr/web/api/node/firstchild/index.html b/files/fr/web/api/node/firstchild/index.html index a9392e7650..3c846498af 100644 --- a/files/fr/web/api/node/firstchild/index.html +++ b/files/fr/web/api/node/firstchild/index.html @@ -13,11 +13,11 @@ translation_of: Web/API/Node/firstChild <p>La propriété en lecture seule <strong><code>Node.firstChild</code> r</strong>envoie le premier nœud enfant de l'arbre ou <code>null</code> s'il n'en a pas. Si le noeud est un <code>Document</code> , il renvoie le premier noeud de la liste de ses enfants directs.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox">var <var>childNode</var> = <var>node</var>.firstChild;</pre> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> <p>Cet exemple montre l'utilisation de <code>firstChild</code> et la manière dont les nœuds d'espaces peuvent interférer.</p> @@ -31,7 +31,7 @@ translation_of: Web/API/Node/firstChild </script> </pre> -<p>Dans le code ci-dessus, la <a href="https://developer.mozilla.org/fr/docs/Web/API/Console">console</a> affichera « #text » car un nœud texte a été inséré pour préserver les blancs entre la fin des balises ouvrantes <p> et <span>. <strong>Tout</strong> <a href="https://developer.mozilla.org/fr/docs/Gestion_des_espaces_dans_le_DOM">espace</a> provoquera l'insertion d'un nœud <code>#text</code> , qu'il s'agisse d'un simple espace ou de plusieurs, de retours à la ligne, tabulations, etc.</p> +<p>Dans le code ci-dessus, la <a href="/fr/docs/Web/API/Console">console</a> affichera « #text » car un nœud texte a été inséré pour préserver les blancs entre la fin des balises ouvrantes <p> et <span>. <strong>Tout</strong> <a href="/fr/docs/Gestion_des_espaces_dans_le_DOM">espace</a> provoquera l'insertion d'un nœud <code>#text</code> , qu'il s'agisse d'un simple espace ou de plusieurs, de retours à la ligne, tabulations, etc.</p> <p>Un autre nœud <code>#text</code> est inséré entre les balises de fermeture </span> et </p>.</p> @@ -85,8 +85,4 @@ translation_of: Web/API/Node/firstChild <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - - -<p>{{Compat("api.Node.firstChild")}}</p> - -<div id="compat-desktop"> </div> +<p>{{Compat("api.Node.firstChild")}}</p>
\ No newline at end of file diff --git a/files/fr/web/api/node/getrootnode/index.html b/files/fr/web/api/node/getrootnode/index.html index 277df08cd3..5a6297d55b 100644 --- a/files/fr/web/api/node/getrootnode/index.html +++ b/files/fr/web/api/node/getrootnode/index.html @@ -36,7 +36,7 @@ translation_of: Web/API/Node/getRootNode <p>Le premier exemple retourne une référence au noeud HTML/document lorsqu'il est exécuté dans les navigateurs de support :</p> -<pre class="brush: js language-html"><code class="language-html">rootNode = node.getRootNode();</code></pre> +<pre class="brush: js">rootNode = node.getRootNode();</pre> <p>Cet exemple plus complexe montre la différence entre retourner une racine normale et une racine qui inclut la racine shadow (voir le <a href="https://github.com/jserz/js_piece/blob/master/DOM/Node/getRootNode()/demo/getRootNode.html">code source complet</a>):</p> @@ -86,10 +86,4 @@ translation_of: Web/API/Node/getRootNode <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> -<div> - - -<p>{{Compat("api.Node.getRootNode")}}</p> -</div> - -<div id="compat-mobile"> </div> +<p>{{Compat("api.Node.getRootNode")}}</p>
\ No newline at end of file diff --git a/files/fr/web/api/node/haschildnodes/index.html b/files/fr/web/api/node/haschildnodes/index.html index d0af3b4b65..c14ad9836f 100644 --- a/files/fr/web/api/node/haschildnodes/index.html +++ b/files/fr/web/api/node/haschildnodes/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/Node/hasChildNodes --- <p>{{APIRef("DOM")}}</p> -<p class="summary">La méthode <code><strong>Node.hasChildNodes()</strong></code> renvoie un {{jsxref("Boolean")}} indiquant si le {{domxref("Node","noeud")}} actuel possède des <a href="/fr/docs/Web/API/Node/childNodes">nœuds enfants</a> ou non.</p> +<p>La méthode <code><strong>Node.hasChildNodes()</strong></code> renvoie un {{jsxref("Boolean")}} indiquant si le {{domxref("Node","noeud")}} actuel possède des <a href="/fr/docs/Web/API/Node/childNodes">nœuds enfants</a> ou non.</p> <h2 id="Syntax">Syntaxe</h2> diff --git a/files/fr/web/api/node/index.html b/files/fr/web/api/node/index.html index cdd9ff13a3..4c7ddde36b 100644 --- a/files/fr/web/api/node/index.html +++ b/files/fr/web/api/node/index.html @@ -25,13 +25,13 @@ translation_of: Web/API/Node <h2 id="Propriétés">Propriétés</h2> -<p><em>Hérite les propriétés de son parent {{domxref("EventTarget")}}</em>.<sup>[1]</sup></p> +<p><em>Hérite les propriétés de son parent {{domxref("EventTarget")}}</em>.</p> <dl> <dt>{{DOMxRef("Node.baseURI")}} {{readonlyInline}}</dt> - <dd>Retourne une {{domxref("DOMString")}} (<em>chaine de caractères</em>) <span id="result_box" lang="fr"><span>représentant l'URL de base du document contenant le <code>Node</code>.</span><span> En HTML, il correspond au protocole, au nom de domaine et à la structure du répertoire, jusqu'au dernier</span></span> <code>/</code>.</dd> + <dd>Retourne une {{domxref("DOMString")}} (<em>chaine de caractères</em>) représentant l'URL de base du document contenant le <code>Node</code>. En HTML, il correspond au protocole, au nom de domaine et à la structure du répertoire, jusqu'au dernier <code>/</code>.</dd> <dt>{{DOMxRef("Node.baseURIObject")}} {{Non-standard_inline()}}</dt> - <dd><span id="result_box" lang="fr"><span>(Non disponible pour le contenu Web). L'objet </span></span><span id="result_box" lang="fr"><span>en lecture seule</span></span> <span lang="fr"><span> {{Interface ("nsIURI")}} représentant l'URI de base pour l'élément.</span></span></dd> + <dd>(Non disponible pour le contenu Web). L'objet en lecture seule {{Interface ("nsIURI")}} représentant l'URI de base pour l'élément.</dd> <dt>{{DOMxRef("Node.childNodes")}} {{readonlyInline}}</dt> <dd>Renvoie un {{domxref ("NodeList")}} contenant tous les enfants de ce nœud. {{domxref ("NodeList")}} signifie que si les enfants du <code>Node</code> changent, l'objet {{domxref ("NodeList")}} est automatiquement mis à jour.</dd> <dt>{{DOMxRef("Node.firstChild")}} {{readonlyInline}}</dt> @@ -111,11 +111,11 @@ translation_of: Web/API/Node <dt>{{DOMxRef("Node.parentNode")}}{{readonlyInline}}</dt> <dd>Retourne un {{domxref("Node")}} qui est le parent de ce nœud. S'il n'existe pas, parce qu'il est en haut de l'arbre ou parce qu'il ne participe pas à un arbre, cette propriété retourne <code>null</code> .</dd> <dt>{{DOMxRef("Node.parentElement")}}{{readonlyInline}}</dt> - <dd>Retourne un {{domxref("Element")}} qui est le parent de ce nœud. <span id="result_box" lang="fr"><span>Si le nœud n'a aucun parent ou si ce parent n'est pas un </span></span> {{domxref("Element")}} , cette propriété retourne <code>null</code>.</dd> + <dd>Retourne un {{domxref("Element")}} qui est le parent de ce nœud. Si le nœud n'a aucun parent ou si ce parent n'est pas un {{domxref("Element")}} , cette propriété retourne <code>null</code>.</dd> <dt>{{DOMxRef("Node.previousSibling")}}{{readonlyInline}}</dt> <dd>Retourne un {{domxref("Node")}} représentant le nœud précédent dans l'arbre ou <code>null</code> s'il n'y en a pas.</dd> <dt>{{DOMxRef("Node.textContent")}}</dt> - <dd>Retourne / définit <span id="result_box" lang="fr"><span>le contenu textuel d'un élément et de tous ses descendants.</span></span></dd> + <dd>Retourne / définit le contenu textuel d'un élément et de tous ses descendants.</dd> </dl> <dl> @@ -125,11 +125,11 @@ translation_of: Web/API/Node <dl> <dt>{{DOMxRef("Node.localName")}} {{obsolete_inline}}{{readonlyInline}}</dt> - <dd>Retourne un {{domxref("DOMString")}} représentant <span class="short_text" id="result_box" lang="fr"><span>la partie locale du nom d'un élément.</span></span></dd> + <dd>Retourne un {{domxref("DOMString")}} représentant la partie locale du nom d'un élément.</dd> </dl> <div class="note"> -<p><strong>Note :</strong> <span id="result_box" lang="fr"><span>Dans Firefox 3.5 et versions antérieures, la propriété saisit le nom local pour les éléments HTML (mais pas les éléments XHTML).</span> <span>Dans les versions ultérieures, cela ne se produit pas, donc la propriété est en minuscule pour HTML et XHTML.</span></span> {{gecko_minversion_inline("1.9.2")}}</p> +<p><strong>Note :</strong> Dans Firefox 3.5 et versions antérieures, la propriété saisit le nom local pour les éléments HTML (mais pas les éléments XHTML). Dans les versions ultérieures, cela ne se produit pas, donc la propriété est en minuscule pour HTML et XHTML. {{gecko_minversion_inline("1.9.2")}}</p> </div> <dl> @@ -138,7 +138,7 @@ translation_of: Web/API/Node </dl> <div class="note"> -<p>Note : Dans Firefox 3.5 et versions antérieures, les éléments HTML ne contiennent aucun "namespace". Dans les versions ultérieures, les éléments HTML sont dans le "namespace" <code><a class="linkification-ext external external-icon" href="https://www.w3.org/1999/xhtml/" title="Linkification: http://www.w3.org/1999/xhtml">https://www.w3.org/1999/xhtml/</a></code> <span class="short_text" id="result_box" lang="fr"><span>pour HTML et XML. </span></span> {{gecko_minversion_inline("1.9.2")}}</p> +<p><strong>Note :</strong> Dans Firefox 3.5 et versions antérieures, les éléments HTML ne contiennent aucun "namespace". Dans les versions ultérieures, les éléments HTML sont dans le "namespace" <code><a href="https://www.w3.org/1999/xhtml/">https://www.w3.org/1999/xhtml/</a></code> pour HTML et XML. {{gecko_minversion_inline("1.9.2")}}</p> </div> <dl> @@ -152,7 +152,7 @@ translation_of: Web/API/Node <h2 id="Méthodes">Méthodes</h2> -<p><em>Hérite des méthodes de son parent {{domxref("EventTarget")}}</em>.<sup>[1]</sup></p> +<p><em>Hérite des méthodes de son parent {{domxref("EventTarget")}}</em>.</p> <dl> <dt>{{DOMxRef("Node.appendChild()", "Node.appendChild(<var>childNode</var>)")}}</dt> @@ -163,15 +163,15 @@ translation_of: Web/API/Node <dt>{{DOMxRef("Node.compareDocumentPosition()")}}</dt> <dd>Compare la position du nœud courant par rapport à un autre nœud dans tout autre document.</dd> <dt>{{DOMxRef("Node.contains()")}}</dt> - <dd>Retourne une valeur {{jsxref("Boolean")}} (<em>booléen</em>) <span id="result_box" lang="fr"><span>indiquant si un noeud est un descendant d'un noeud donné ou non.</span></span></dd> + <dd>Retourne une valeur {{jsxref("Boolean")}} (<em>booléen</em>) indiquant si un noeud est un descendant d'un noeud donné ou non.</dd> <dt>{{domxref("Node.getBoxQuads()")}} {{experimental_inline}}</dt> <dd>Retourne une liste des boites CSS des nœuds relatifs à un autre nœud.</dd> <dt>{{DOMxRef("Node.getRootNode()")}}</dt> - <dd><span id="result_box" lang="fr"><span>Retourne la racine de l'objet contextuel qui comprend éventuellement la "Shadow root" si elle est disponible.</span></span></dd> + <dd>Retourne la racine de l'objet contextuel qui comprend éventuellement la "Shadow root" si elle est disponible.</dd> <dt>{{DOMxRef("Node.hasChildNodes()")}}</dt> - <dd>Retourne un {{jsxref("Boolean")}} (<em>booléen</em>) indiquant si l'élément a des<span id="result_box" lang="fr"><span> noeuds enfants ou non.</span></span></dd> + <dd>Retourne un {{jsxref("Boolean")}} (<em>booléen</em>) indiquant si l'élément a des noeuds enfants ou non.</dd> <dt>{{DOMxRef("Node.insertBefore()")}}</dt> - <dd>Insère un {{domxref("Node")}} avant <span id="result_box" lang="fr"><span>le nœud de référence en tant qu'enfant du noeud actuel.</span></span></dd> + <dd>Insère un {{domxref("Node")}} avant le nœud de référence en tant qu'enfant du noeud actuel.</dd> <dt>{{DOMxRef("Node.isDefaultNamespace()")}}</dt> <dd>Accepte une URI d'espace de nom comme argument et retourne une valeur {{jsxref("Boolean")}} avec <code>true</code> (<em>vrai</em>) si l'espace de nom est celui par défaut du noeud donné ou <code>false</code> (<em>faux</em>) sinon.</dd> <dt>{{DOMxRef("Node.isEqualNode()")}}</dt> @@ -196,70 +196,70 @@ translation_of: Web/API/Node <dt>{{domxref("Node.getFeature()")}} {{obsolete_inline}}</dt> <dd>Permet à un utilisateur d'obtenir un objet {{DOMxRef("DOMUserData")}} à partir du nœud fourni.</dd> <dt>{{domxref("Node.getUserData()")}} {{obsolete_inline}}</dt> - <dd><span id="result_box" lang="fr"><span>Permet à un utilisateur d'obtenir une {{domxref ("DOMUserData")}} (<em>donnée utilisateur</em>) à partir du </span></span>nœud<span lang="fr"><span>.</span></span></dd> + <dd>Permet à un utilisateur d'obtenir une {{domxref ("DOMUserData")}} (<em>donnée utilisateur</em>) à partir du nœud.</dd> <dt>{{domxref("Node.hasAttributes()")}} {{obsolete_inline}}</dt> - <dd>Retourne un {{jsxref("Boolean")}} <span id="result_box" lang="fr"><span>indiquant si l'élément possède des attributs ou non.</span></span></dd> + <dd>Retourne un {{jsxref("Boolean")}} indiquant si l'élément possède des attributs ou non.</dd> <dt>{{domxref("Node.isSupported()")}} {{obsolete_inline}}</dt> - <dd>Retourne une marque {{jsxref("Boolean")}} qui contient le résultat d'un test <span id="result_box" lang="fr"><span>si l'implémentation DOM prend en compte une caractéristique spécifique et si cette fonctionnalité est prise en charge par le </span></span>nœud<span lang="fr"><span> spécifique.</span></span></dd> + <dd>Retourne une marque {{jsxref("Boolean")}} qui contient le résultat d'un test si l'implémentation DOM prend en compte une caractéristique spécifique et si cette fonctionnalité est prise en charge par le nœud spécifique.</dd> <dt>{{domxref("Node.setUserData()")}} {{obsolete_inline}}</dt> - <dd><span class="short_text" id="result_box" lang="fr"><span>Permet à un utilisateur d'attacher ou d'enlever </span></span> {{domxref("DOMUserData")}} du nœud.</dd> + <dd>Permet à un utilisateur d'attacher ou d'enlever {{domxref("DOMUserData")}} du nœud.</dd> </dl> <h2 id="Exemples">Exemples</h2> -<h3 id="Parcourir_tous_les_nœuds_enfants"><span class="short_text" id="result_box" lang="fr"><span>Parcourir tous les nœuds enfants</span></span></h3> +<h3 id="Parcourir_tous_les_nœuds_enfants">Parcourir tous les nœuds enfants</h3> <p>La fonction suivante parcourt de manière récursive tous les nœuds enfants d'un noeud et exécute une fonction de rappel sur eux (et sur le nœud parent lui-même).</p> -<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">function</span> DOMComb <span class="punctuation token">(</span>oParent<span class="punctuation token">,</span> oCallback<span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">if</span> <span class="punctuation token">(</span>oParent<span class="punctuation token">.</span><span class="function token">hasChildNodes</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">for</span> <span class="punctuation token">(</span><span class="keyword token">var</span> oNode <span class="operator token">=</span> oParent<span class="punctuation token">.</span>firstChild<span class="punctuation token">;</span> oNode<span class="punctuation token">;</span> oNode <span class="operator token">=</span> oNode<span class="punctuation token">.</span>nextSibling<span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="function token">DOMComb</span><span class="punctuation token">(</span>oNode<span class="punctuation token">,</span> oCallback<span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="punctuation token">}</span> - <span class="punctuation token">}</span> - oCallback<span class="punctuation token">.</span><span class="function token">call</span><span class="punctuation token">(</span>oParent<span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span></code></pre> +<pre class="brush: js">function DOMComb (oParent, oCallback) { + if (oParent.hasChildNodes()) { + for (var oNode = oParent.firstChild; oNode; oNode = oNode.nextSibling) { + DOMComb(oNode, oCallback); + } + } + oCallback.call(oParent); +}</pre> <h4 id="Syntaxe">Syntaxe</h4> -<pre class="syntaxbox notranslate">DOMComb(parentNode, callbackFunction);</pre> +<pre class="syntaxbox">DOMComb(parentNode, callbackFunction);</pre> <h4 id="Description">Description</h4> -<p>Suit le cycle récursif de tous les nœuds enfants d'un <code>parentNode</code> et le <code>parentNode</code> lui-même, et exécute la fonction <code>callbackFunction</code> (<em>rappel</em>) sur eux comme un objet <a href="https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/L_op%C3%A9rateur_this" title="en-US/docs/JavaScript/Reference/Operators/this"><code>this</code></a>.</p> +<p>Suit le cycle récursif de tous les nœuds enfants d'un <code>parentNode</code> et le <code>parentNode</code> lui-même, et exécute la fonction <code>callbackFunction</code> (<em>rappel</em>) sur eux comme un objet <a href="/fr/docs/Web/JavaScript/Reference/Op%C3%A9rateurs/L_op%C3%A9rateur_this"><code>this</code></a>.</p> <h4 id="Paramètres">Paramètres</h4> <dl> <dt><code>parentNode</code></dt> - <dd>Le nœud parent (<code><strong>Node</strong> <a href="https://developer.mozilla.org/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object" title="en-US/docs/JavaScript/Reference/Global_Objects/Object">Object</a></code>)</dd> + <dd>Le nœud parent (<code><strong>Node</strong> <a href="/fr/docs/Web/JavaScript/Reference/Objets_globaux/Object">Object</a></code>)</dd> <dt><code>callbackFunction</code></dt> - <dd>La fonction de rappel (<a href="https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function" title="en-US/docs/JavaScript/Reference/Global_Objects/Function"><code>Function</code></a>).</dd> + <dd>La fonction de rappel (<a href="/en-US/docs/Web/JavaScript/Reference/Global_Objects/Function"><code>Function</code></a>).</dd> </dl> <h4 id="Exemples_dutilisation">Exemples d'utilisation</h4> -<p><span id="result_box" lang="fr"><span>L'exemple suivant envoie à la <code>console.log</code> le contenu texte du corps :</span></span></p> +<p>L'exemple suivant envoie à la <code>console.log</code> le contenu texte du corps :</p> -<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="keyword token">function</span> printContent <span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">if</span> <span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>nodeValue<span class="punctuation token">)</span> <span class="punctuation token">{</span> console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>nodeValue<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="punctuation token">}</span> -<span class="punctuation token">}</span> +<pre class="brush: js">function printContent () { + if (this.nodeValue) { console.log(this.nodeValue); } +} -onload <span class="operator token">=</span> <span class="keyword token">function</span> <span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="function token">DOMComb</span><span class="punctuation token">(</span>document<span class="punctuation token">.</span>body<span class="punctuation token">,</span> printContent<span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre> +onload = function () { + DOMComb(document.body, printContent); +};</pre> <h3 id="Supprimer_tous_les_enfants_imbriqués_dans_un_nœud">Supprimer tous les enfants imbriqués dans un nœud</h3> -<pre class="brush: js line-numbers language-js notranslate"><code class="language-js">Element<span class="punctuation token">.</span>prototype<span class="punctuation token">.</span>removeAll <span class="operator token">=</span> <span class="keyword token">function</span> <span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">while</span> <span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>firstChild<span class="punctuation token">)</span> <span class="punctuation token">{</span> <span class="keyword token">this</span><span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">.</span>firstChild<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="punctuation token">}</span> - <span class="keyword token">return</span> <span class="keyword token">this</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span><span class="punctuation token">;</span></code></pre> +<pre class="brush: js">Element.prototype.removeAll = function () { + while (this.firstChild) { this.removeChild(this.firstChild); } + return this; +};</pre> <h4 id="Exemple_dutilisation">Exemple d'utilisation</h4> -<pre class="brush: js line-numbers language-js notranslate"><code class="language-js"><span class="comment token">/* ... an alternative to document.body.innerHTML = "" ... */</span> -document<span class="punctuation token">.</span>body<span class="punctuation token">.</span><span class="function token">removeAll</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> +<pre class="brush: js">/* ... an alternative to document.body.innerHTML = "" ... */ +document.body.removeAll();</pre> <h2 id="Spécifications">Spécifications</h2> @@ -275,7 +275,7 @@ document<span class="punctuation token">.</span>body<span class="punctuation tok <tr> <td>{{SpecName('DOM WHATWG', '#interface-node', 'Node')}}</td> <td>{{Spec2('DOM WHATWG')}}</td> - <td><span class="short_text" id="result_box" lang="fr"><span>Supprime les propriétés suivantes :</span></span> <code>attributes</code>, <code>namespaceURI</code>, <code>prefix</code>, et <code>localName</code>.<br> + <td>Supprime les propriétés suivantes : <code>attributes</code>, <code>namespaceURI</code>, <code>prefix</code>, et <code>localName</code>.<br> Supprime les méthodes suivantes : <code>isSupported()</code>, <code>hasAttributes()</code>, <code>getFeature()</code>, <code>setUserData()</code>, et <code>getUserData()</code>.</td> </tr> <tr> @@ -303,8 +303,4 @@ document<span class="punctuation token">.</span>body<span class="punctuation tok <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - - -<p>{{Compat("api.Node")}}</p> - -<div id="compat-desktop"></div> +<p>{{Compat("api.Node")}}</p>
\ No newline at end of file diff --git a/files/fr/web/api/node/insertbefore/index.html b/files/fr/web/api/node/insertbefore/index.html index 780cf3bb18..289539552f 100644 --- a/files/fr/web/api/node/insertbefore/index.html +++ b/files/fr/web/api/node/insertbefore/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/Node/insertBefore --- <p>{{APIRef("DOM")}}</p> -<p class="summary">La méthode <code><strong>Node.insertBefore()</strong></code> insère un nœud avant un <em>nœud de référence</em> en tant qu'enfant d'un <em>nœud parent</em> spécifié.</p> +<p>La méthode <code><strong>Node.insertBefore()</strong></code> insère un nœud avant un <em>nœud de référence</em> en tant qu'enfant d'un <em>nœud parent</em> spécifié.</p> <p>Si le nœud donné existe déjà dans le document, <code>insertBefore()</code> le déplace de sa position actuelle vers la nouvelle position. (C'est-à-dire qu'il sera automatiquement retiré de son parent existant avant d'être ajouté au nouveau parent spécifié).</p> @@ -94,7 +94,7 @@ parentDiv.insertBefore(sp1, sp2) </script> </pre> -<p>Il n'existe pas de méthode <code>insertAfter</code>. Il peut être émulé avec une combinaison des méthodes <code>insertBefore</code><a class="internal" href="/fr/docs/Web/API/Node/insertBefore"> </a>et <code><a href="/fr/docs/Web/API/Node/nextSibling">nextSibling</a></code>.</p> +<p>Il n'existe pas de méthode <code>insertAfter</code>. Il peut être émulé avec une combinaison des méthodes <code>insertBefore</code><a href="/fr/docs/Web/API/Node/insertBefore"> </a>et <code><a href="/fr/docs/Web/API/Node/nextSibling">nextSibling</a></code>.</p> <p>Dans l'exemple ci-dessus, <code>sp1</code> pourrait être inséré après <code>sp2</code> en utilisant :</p> diff --git a/files/fr/web/api/node/isconnected/index.html b/files/fr/web/api/node/isconnected/index.html index 0e2acb7b5b..730afa1beb 100644 --- a/files/fr/web/api/node/isconnected/index.html +++ b/files/fr/web/api/node/isconnected/index.html @@ -20,16 +20,16 @@ translation_of: Web/API/Node/isConnected <h3 id="Renvoie_la_valeur">Renvoie la valeur</h3> -<p>Un {{domxref("Boolean")}} (<em>booléen</em>) — <code>true</code> (<em>vrai</em>) si le noeud est connecté <span class="short_text" id="result_box" lang="fr"><span>à son objet contextuel pertinent</span></span> et <code>false</code> (<em>faux</em>) sinon.</p> +<p>Un {{domxref("Boolean")}} (<em>booléen</em>) — <code>true</code> (<em>vrai</em>) si le noeud est connecté à son objet contextuel pertinent et <code>false</code> (<em>faux</em>) sinon.</p> <h2 id="Exemples">Exemples</h2> <p>Un exemple DOM standard :</p> -<pre class="brush: js"><code class="language-html">let test = document.createElement('p'); +<pre class="brush: js">let test = document.createElement('p'); console.log(test.isConnected); // renvoie false (<em>faux</em>) -document.body.appendChild(test);</code> -<code class="language-html">console.log(test.isConnected); // renvoie true</code> (<em>vrai</em>) +document.body.appendChild(test); +console.log(test.isConnected); // renvoie true (<em>vrai</em>) </pre> <p>Un exemple DOM shadow :</p> diff --git a/files/fr/web/api/node/isdefaultnamespace/index.html b/files/fr/web/api/node/isdefaultnamespace/index.html index 67da853471..1ea4b789bf 100644 --- a/files/fr/web/api/node/isdefaultnamespace/index.html +++ b/files/fr/web/api/node/isdefaultnamespace/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Node/isDefaultNamespace <p>La méthode <strong><code>Node.isDefaultNamespace()</code></strong> accepte un URI d'espace de nom comme argument et renvoie un {{jsxref("Boolean")}} (booléen) avec une valeur <code>true</code> (<em>vrai</em>) si l'espace de nom est celui par défaut du noeud donné ou <code>false</code> (<em>faux</em>) sinon.</p> -<h2 id="Syntax" name="Syntax">Syntaxe</h2> +<h2 id="Syntax">Syntaxe</h2> <pre class="syntaxbox"><em>result</em> = <em>node</em>.isDefaultNamespace(<em>namespaceURI</em>) </pre> @@ -24,16 +24,16 @@ translation_of: Web/API/Node/isDefaultNamespace <li><code>namespaceURI</code> est une <code>string</code> (<em>chaîne de caractères</em>) représentant l'espace de nom par rapport auquel l'élément sera vérifié.</li> </ul> -<h2 id="Example" name="Example">Exemple</h2> +<h2 id="Example">Exemple</h2> <pre class="brush:js">var XULNS = "http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul"; var el = document.getElementsByTagNameNS(XULNS, 'textbox')[0]; alert(el.isDefaultNamespace(XULNS)); // true</pre> -<h2 id="Specification" name="Specification">Spécification</h2> +<h2 id="Specification">Spécification</h2> <ul> <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-isDefaultNamespace">DOM Level 3 Core: isDefaultNamespace</a></li> - <li><a href="/en-US/docs/Code_snippets/IsDefaultNamespace" title="Code_snippets/IsDefaultNamespace">Code snippets: isDefaultNamespace</a></li> + <li><a href="/en-US/docs/Code_snippets/IsDefaultNamespace">Code snippets: isDefaultNamespace</a></li> </ul> diff --git a/files/fr/web/api/node/isequalnode/index.html b/files/fr/web/api/node/isequalnode/index.html index b6e3f84009..79bcb16b17 100644 --- a/files/fr/web/api/node/isequalnode/index.html +++ b/files/fr/web/api/node/isequalnode/index.html @@ -15,7 +15,7 @@ translation_of: Web/API/Node/isEqualNode <p>La méthode <code><strong>Node.isEqualNode()</strong></code> permet de tester l'égalité entre deux éléments du DOM. Deux noeuds sont équivalents s'ils ont le même type, les mêmes caractéristiques de définition (ID, nombre d'enfants et autres), des attributs qui correspondent etc. L'ensemble spécifique de points des données qui doit correspondre varie en fonction des types de nœuds.</p> -<h2 id="Syntax" name="Syntax">Syntaxe</h2> +<h2 id="Syntax">Syntaxe</h2> <pre class="syntaxbox">var <var>isEqualNode</var> = <var>node</var>.isEqualNode(<var>otherNode</var>); </pre> @@ -30,37 +30,37 @@ translation_of: Web/API/Node/isEqualNode <h3 id="HTML">HTML</h3> -<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span><span class="punctuation token">></span></span>This is the first element.<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span><span class="punctuation token">></span></span>This is the second element.<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span><span class="punctuation token">></span></span>This is the first element.<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> +<pre class="brush: html"><div>This is the first element.</div> +<div>This is the second element.</div> +<div>This is the first element.</div> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>p</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>output<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>p</span><span class="punctuation token">></span></span></code></pre> +<p id="output"></p></pre> -<h3 id="Specification" name="Specification">CSS</h3> +<h3 id="Specification">CSS</h3> -<pre class="brush: css line-numbers language-css"><code class="language-css"><span class="selector token"><span class="id token">#output</span> </span><span class="punctuation token">{</span> - <span class="property token">width</span><span class="punctuation token">:</span> <span class="number token">440</span>px<span class="punctuation token">;</span> - <span class="property token">border</span><span class="punctuation token">:</span> <span class="number token">2</span>px solid black<span class="punctuation token">;</span> - <span class="property token">border-radius</span><span class="punctuation token">:</span> <span class="number token">5</span>px<span class="punctuation token">;</span> - <span class="property token">padding</span><span class="punctuation token">:</span> <span class="number token">10</span>px<span class="punctuation token">;</span> - <span class="property token">margin-top</span><span class="punctuation token">:</span> <span class="number token">20</span>px<span class="punctuation token">;</span> - <span class="property token">display</span><span class="punctuation token">:</span> block<span class="punctuation token">;</span> -<span class="punctuation token">}</span></code></pre> +<pre class="brush: css">#output { + width: 440px; + border: 2px solid black; + border-radius: 5px; + padding: 10px; + margin-top: 20px; + display: block; +}</pre> <h3 id="JavaScript">JavaScript</h3> -<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">let</span> output <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"output"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="keyword token">let</span> divList <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementsByTagName</span><span class="punctuation token">(</span><span class="string token">"div"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<pre class="brush: js">let output = document.getElementById("output"); +let divList = document.getElementsByTagName("div"); -output<span class="punctuation token">.</span>innerHTML <span class="operator token">+</span><span class="operator token">=</span> <span class="string token">"div 0 equals div 0: "</span> <span class="operator token">+</span> divList<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">.</span><span class="function token">isEqualNode</span><span class="punctuation token">(</span>divList<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">)</span> <span class="operator token">+</span> <span class="string token">"<br/>"</span><span class="punctuation token">;</span> -output<span class="punctuation token">.</span>innerHTML <span class="operator token">+</span><span class="operator token">=</span> <span class="string token">"div 0 equals div 1: "</span> <span class="operator token">+</span> divList<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">.</span><span class="function token">isEqualNode</span><span class="punctuation token">(</span>divList<span class="punctuation token">[</span><span class="number token">1</span><span class="punctuation token">]</span><span class="punctuation token">)</span> <span class="operator token">+</span> <span class="string token">"<br/>"</span><span class="punctuation token">;</span> -output<span class="punctuation token">.</span>innerHTML <span class="operator token">+</span><span class="operator token">=</span> <span class="string token">"div 0 equals div 2: "</span> <span class="operator token">+</span> divList<span class="punctuation token">[</span><span class="number token">0</span><span class="punctuation token">]</span><span class="punctuation token">.</span><span class="function token">isEqualNode</span><span class="punctuation token">(</span>divList<span class="punctuation token">[</span><span class="number token">2</span><span class="punctuation token">]</span><span class="punctuation token">)</span> <span class="operator token">+</span> <span class="string token">"<br/>"</span><span class="punctuation token">;</span></code></pre> +output.innerHTML += "div 0 equals div 0: " + divList[0].isEqualNode(divList[0]) + "<br/>"; +output.innerHTML += "div 0 equals div 1: " + divList[0].isEqualNode(divList[1]) + "<br/>"; +output.innerHTML += "div 0 equals div 2: " + divList[0].isEqualNode(divList[2]) + "<br/>";</pre> <h3 id="Résultats">Résultats</h3> <p>{{ EmbedLiveSample('Example', 480) }}</p> -<h2 id="Specification" name="Specification">Spécifications</h2> +<h2 id="Specification">Spécifications</h2> <table class="standard-table"> <thead> diff --git a/files/fr/web/api/node/issamenode/index.html b/files/fr/web/api/node/issamenode/index.html index 1f3006b4b6..cab5401b56 100644 --- a/files/fr/web/api/node/issamenode/index.html +++ b/files/fr/web/api/node/issamenode/index.html @@ -35,10 +35,7 @@ translation_of: Web/API/Node/isSameNode <p id="output"></p></pre> -<div class="hidden"> -<h3 id="CSS">CSS</h3> - -<pre class="brush: css">#output { +<pre class="brush: css hidden">#output { width: 440px; border: 2px solid black; border-radius: 5px; @@ -46,7 +43,6 @@ translation_of: Web/API/Node/isSameNode margin-top: 20px; display: block; }</pre> -</div> <h3 id="JavaScript">JavaScript</h3> diff --git a/files/fr/web/api/node/issupported/index.html b/files/fr/web/api/node/issupported/index.html index 4e1c86bedb..3c241d4656 100644 --- a/files/fr/web/api/node/issupported/index.html +++ b/files/fr/web/api/node/issupported/index.html @@ -12,32 +12,31 @@ translation_of: Web/API/Node/isSupported <p>La méthode <code><strong>Node.isSupported()</strong></code> renvoie une marque {{domxref("Boolean","booléenne")}} contenant le résultat du test par lequel est vérifié si une implémentation DOM prend en charge une fonctionnalité spécifique et si celle-ci est supportée par un noeud spécifique.</p> -<h3 id="Syntaxe" name="Syntaxe">Syntaxe</h3> +<h3 id="Syntaxe">Syntaxe</h3> <pre class="syntaxbox"><em>boolValue</em> = <em>element</em>.isSupported(<em>feature</em>, <em>version</em>)</pre> +<h3 id="Paramètres">Paramètres</h3> + <dl> - <dt> - <h3 id="Paramètres">Paramètres</h3> - </dt> <dt><code>feature</code></dt> - <dd>est une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) contenant le nom de la fonctionnalité à tester. C'est le même nom qui peut être passé à la méthode <code>hasFeature</code> de <a href="https://developer.mozilla.org/fr/docs/Web/API/Document/implementation">DOMImplementation</a>. Les valeurs possibles définies dans la spécification DOM core sont listées dans la section <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/introduction.html#ID-Conformance">Conformance</a> de DOM Level 2.</dd> + <dd>est une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) contenant le nom de la fonctionnalité à tester. C'est le même nom qui peut être passé à la méthode <code>hasFeature</code> de <a href="/fr/docs/Web/API/Document/implementation">DOMImplementation</a>. Les valeurs possibles définies dans la spécification DOM core sont listées dans la section <a href="http://www.w3.org/TR/DOM-Level-2-Core/introduction.html#ID-Conformance">Conformance</a> de DOM Level 2.</dd> <dt><code>version</code></dt> <dd>est une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) contenant le numéro de version de la fonctionnalité à tester. En DOM Level 2, première version, il s'agit de la chaîne « <code>2.0</code> ». Si la version n'est pas spécifiée, la gestion de n'importe quelle version de la fonctionnalité suffira pour que soit renvoyée la valeur <code>true</code>.</dd> </dl> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> -<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>doc<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> +<pre class="brush: html"><div id="doc"> +</div> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span><span class="punctuation token">></span></span><span class="language-javascript script token"> - <span class="comment token">// Obtenir un élément et vérifier pour voir s'il est pris en charge par les modules HTML DOM2.</span> - <span class="keyword token">var</span> main <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'doc'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="keyword token">var</span> output <span class="operator token">=</span> main<span class="punctuation token">.</span><span class="function token">isSupported</span><span class="punctuation token">(</span><span class="string token">'HTML'</span><span class="punctuation token">,</span> <span class="string token">'2.0'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -</span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span></code></pre> +<script> + // Obtenir un élément et vérifier pour voir s'il est pris en charge par les modules HTML DOM2. + var main = document.getElementById('doc'); + var output = main.isSupported('HTML', '2.0'); +</script></pre> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécifications</h2> +<h2 id="Sp.C3.A9cification">Spécifications</h2> <p> </p> diff --git a/files/fr/web/api/node/lastchild/index.html b/files/fr/web/api/node/lastchild/index.html index 3f31c8f722..37963f8473 100644 --- a/files/fr/web/api/node/lastchild/index.html +++ b/files/fr/web/api/node/lastchild/index.html @@ -13,19 +13,19 @@ translation_of: Web/API/Node/lastChild <p>La propriété en lecture seule<strong> </strong><code><strong>Node.lastChild</strong></code> renvoie le dernier enfant du noeud. Si son parent est un élément, l'enfant est généralement un noeud élément, texte ou commentaire. Elle renvoie <code>null</code> s'il n'y a aucun enfant.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox">var <var>childNode</var> = <var>node</var>.lastChild; </pre> <p> </p> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> <p> </p> -<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">var</span> tr <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"row1"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="keyword token">var</span> corner_td <span class="operator token">=</span> tr<span class="punctuation token">.</span>lastChild<span class="punctuation token">;</span></code></pre> +<pre class="brush: js">var tr = document.getElementById("row1"); +var corner_td = tr.lastChild;</pre> <h2 id="Spécification">Spécification</h2> @@ -63,8 +63,4 @@ translation_of: Web/API/Node/lastChild <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - - -<p>{{Compat("api.Node.lastChild")}}</p> - -<div id="compat-desktop"> </div> +<p>{{Compat("api.Node.lastChild")}}</p>
\ No newline at end of file diff --git a/files/fr/web/api/node/lookupnamespaceuri/index.html b/files/fr/web/api/node/lookupnamespaceuri/index.html index 52e72bec1f..1c88e6b8a2 100644 --- a/files/fr/web/api/node/lookupnamespaceuri/index.html +++ b/files/fr/web/api/node/lookupnamespaceuri/index.html @@ -12,12 +12,12 @@ translation_of: Web/API/Node/lookupNamespaceURI <p>La méthode <code><strong>Node.lookupNamespaceURI()</strong></code> accepte un préfixe et renvoie l'URI de l'espace de nom associé avec lui sur le noeud donné s'il le trouve (et <code>null</code> sinon). La fourniture de <code>null</code> pour le préfixe renverra l'espace de nom par défaut.</p> -<p>Du fait du <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=312019" title="https://bugzilla.mozilla.org/show_bug.cgi?id=312019">bug 312019</a>, cette méthode ne fonctionne pas avec les espaces de noms attribués dynamiquement (c'est-à-dire ceux qui sont définis par <a href="/en/DOM/Node.prefix" title="En/DOM/Node.prefix">Node.prefix</a>).</p> +<p>Du fait du <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=312019">bug 312019</a>, cette méthode ne fonctionne pas avec les espaces de noms attribués dynamiquement (c'est-à-dire ceux qui sont définis par <a href="/en/DOM/Node.prefix">Node.prefix</a>).</p> <h2 id="Voir_aussi">Voir aussi</h2> <ul> - <li><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-lookupNamespaceURI" rel="freelink">http://www.w3.org/TR/DOM-Level-3-Cor...upNamespaceURI</a></li> + <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-lookupNamespaceURI">http://www.w3.org/TR/DOM-Level-3-Cor...upNamespaceURI</a></li> </ul> <p> </p> diff --git a/files/fr/web/api/node/lookupprefix/index.html b/files/fr/web/api/node/lookupprefix/index.html index 968deea85e..17cc48c622 100644 --- a/files/fr/web/api/node/lookupprefix/index.html +++ b/files/fr/web/api/node/lookupprefix/index.html @@ -14,10 +14,10 @@ translation_of: Web/API/Node/lookupPrefix <p>La méthode <code><strong>Node.lookupPrefix()</strong></code> renvoie une {{domxref("DOMString")}} (<em>chaîne de caractères</em>) contenant le préfixe d'un URI d'un espace de nom donné, s'il est présent, et <code>null</code> sinon. Quand plusieurs préfixes sont possibles, le résultat dépend de l'implémentation.</p> -<p>En raison du <a class="link-https" href="https://bugzilla.mozilla.org/show_bug.cgi?id=312019" title="https://bugzilla.mozilla.org/show_bug.cgi?id=312019">bug 312019</a>, cette méthode ne fonctionne plus avec les espaces de nom définis dynamiquement, c'est-à-dire ceux qui sont fixés avec la propriété {{domxref("Node.prefix")}}.</p> +<p>En raison du <a href="https://bugzilla.mozilla.org/show_bug.cgi?id=312019">bug 312019</a>, cette méthode ne fonctionne plus avec les espaces de nom définis dynamiquement, c'est-à-dire ceux qui sont fixés avec la propriété {{domxref("Node.prefix")}}.</p> <h2 id="Voir_aussi">Voir aussi</h2> <ul> - <li><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-lookupNamespacePrefix" rel="freelink">http://www.w3.org/TR/DOM-Level-3-Cor...amespacePrefix</a></li> + <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#Node3-lookupNamespacePrefix">http://www.w3.org/TR/DOM-Level-3-Cor...amespacePrefix</a></li> </ul> diff --git a/files/fr/web/api/node/nextsibling/index.html b/files/fr/web/api/node/nextsibling/index.html index b3e6cf3e7f..2a971a3067 100644 --- a/files/fr/web/api/node/nextsibling/index.html +++ b/files/fr/web/api/node/nextsibling/index.html @@ -12,42 +12,42 @@ translation_of: Web/API/Node/nextSibling <p>La propriété en lecture seule <code><strong>Node.nextSibling</strong></code> renvoie le nœud (<code>node</code>) suivant immédiatement le nœud spécifié dans la liste des enfants ( {{domxref("Node.childNodes","childNodes")}}) de son nœud parent, ou <code>null</code> si le nœud spécifié est le dernier dans cette liste.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox"><var>nextNode</var> = <var>node</var>.nextSibling </pre> -<h2 id="Notes" name="Notes">Notes</h2> +<h2 id="Notes">Notes</h2> <p></p><p>Les navigateurs basés sur Gecko insèrent des nœuds texte dans un document pour représenter des espaces - vides dans le balisage source. Par conséquent, un nœud obtenu par exemple via <a href="/fr/docs/Web/API/Node/firstChild" title="La propriété en lecture seule Node.firstChild renvoie le premier nœud enfant de l'arbre ou null s'il n'en a pas. Si le noeud est un Document , il renvoie le premier noeud de la liste de ses enfants directs."><code>Node.firstChild</code></a> ou + vides dans le balisage source. Par conséquent, un nœud obtenu par exemple via <a href="/fr/docs/Web/API/Node/firstChild"><code>Node.firstChild</code></a> ou <a href="/fr/docs/Web/API/Node/previousSibling" title='{{APIRef("DOM")}}'><code>Node.previousSibling</code></a> peut faire référence à un nœud texte contenant des espaces plutôt qu'au véritable élément que l'auteur comptait obtenir.</p> <p>Consultez <a href="/fr/docs/Gestion_des_espaces_dans_le_DOM">Gestion des espaces dans le DOM</a> - et <a class="external" href="http://www.w3.org/DOM/faq.html#emptytext" rel="noopener"><i>Why are some Text nodes empty?</i> + et <a href="http://www.w3.org/DOM/faq.html#emptytext" rel="noopener"><i>Why are some Text nodes empty?</i> dans la FAQ DOM 3 du W3C</a> pour plus d'informations.</p><p></p> <p>{{domxref("Element.nextElementSibling")}} peut être utilisé pour obtenir l'élément suivant en ignorant les noeuds d'espace.</p> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> -<pre class="brush:html line-numbers language-html"><code class="language-html"><span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>div-01<span class="punctuation token">"</span></span><span class="punctuation token">></span></span>Here is div-01<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>div-02<span class="punctuation token">"</span></span><span class="punctuation token">></span></span>Here is div-02<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> +<pre class="brush:html"><div id="div-01">Here is div-01</div> +<div id="div-02">Here is div-02</div> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="language-javascript script token"> -<span class="keyword token">var</span> el <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">'div-01'</span><span class="punctuation token">)</span><span class="punctuation token">.</span>nextSibling<span class="punctuation token">,</span> - i <span class="operator token">=</span> <span class="number token">1</span><span class="punctuation token">;</span> +<script type="text/javascript"> +var el = document.getElementById('div-01').nextSibling, + i = 1; -console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">'Siblings of div-01:'</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +console.log('Siblings of div-01:'); -<span class="keyword token">while</span> <span class="punctuation token">(</span>el<span class="punctuation token">)</span> <span class="punctuation token">{</span> - console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span>i <span class="operator token">+</span> <span class="string token">'. '</span> <span class="operator token">+</span> el<span class="punctuation token">.</span>nodeName<span class="punctuation token">)</span><span class="punctuation token">;</span> - el <span class="operator token">=</span> el<span class="punctuation token">.</span>nextSibling<span class="punctuation token">;</span> - i<span class="operator token">++</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span> +while (el) { + console.log(i + '. ' + el.nodeName); + el = el.nextSibling; + i++; +} -</span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span> +</script> /************************************************** Ce qui suit est écrit sur la console pendant le chargement: @@ -59,25 +59,25 @@ console<span class="punctuation token">.</span><span class="function token">log< 3. #text 4. SCRIPT -**************************************************/</code></pre> +**************************************************/</pre> <p>Dans cet exemple, on peut voir que des nœuds <code>#text</code> sont insérés dans le DOM là où des espaces se trouvent dans le code source entre les balises (c'est-à-dire après la balise de fermeture d'un élément et avant la balise d'ouverture du suivant). Aucun espace n'est créé entre les éléments insérés par l'instruction <code>document.write</code> .</p> <p>L'inclusion possible de nœuds textes dans le DOM doit être prise en compte pour le parcours du DOM à l'aide de <code>nextSibling</code>. Consultez les ressources dans la section Notes .</p> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h2> +<h2 id="Sp.C3.A9cification">Spécification</h2> <ul> - <li><a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#attribute-nextSibling">DOM Level 1 Core: nextSibling</a> <small>— <a class="external" href="http://xmlfr.org/w3c/TR/REC-DOM-Level-1/level-one-core.html#attribute-nextSibling">traduction</a> (non normative)</small></li> - <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-6AC54C2F">DOM Level 2 Core: nextSibling</a> <small>— <a class="external" href="http://www.yoyodesign.org/doc/w3c/dom2/core/core.html#ID-6AC54C2F">traduction</a> (non normative)</small></li> + <li><a href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#attribute-nextSibling">DOM Level 1 Core: nextSibling</a> <small>— <a href="http://xmlfr.org/w3c/TR/REC-DOM-Level-1/level-one-core.html#attribute-nextSibling">traduction</a> (non normative)</small></li> + <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-6AC54C2F">DOM Level 2 Core: nextSibling</a> <small>— <a href="http://www.yoyodesign.org/doc/w3c/dom2/core/core.html#ID-6AC54C2F">traduction</a> (non normative)</small></li> </ul> -<h2 class="noinclude" id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> <p>{{Compat("api.Node.nextSibling")}}</p> -<h2 class="noinclude" id="Voir_aussi">Voir aussi</h2> +<h2 id="Voir_aussi">Voir aussi</h2> <p>{{domxref("Element.nextElementSibling")}}</p> diff --git a/files/fr/web/api/node/nodename/index.html b/files/fr/web/api/node/nodename/index.html index da778cda15..11c471fff1 100644 --- a/files/fr/web/api/node/nodename/index.html +++ b/files/fr/web/api/node/nodename/index.html @@ -72,7 +72,7 @@ translation_of: Web/API/Node/nodeName </tbody> </table> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox">var <em>str</em> = <em>node</em>.nodeName; </pre> @@ -92,15 +92,15 @@ var text_field = document.getElementById("t"); text_field.value = div1.nodeName; </pre> -<p>En XHTML (ou tout autre format XML), la valeur de <code>text_field</code> sera « div ». Cependant, en HTML, la valeur de <code>text_field</code> sera « DIV », parce que <code>nodeName</code> et <code>tagName</code> renvoient en casse majuscule sur les éléments HTML dans les DOM marqués comme des documents HTML. En lire plus <a href="http://ejohn.org/blog/nodename-case-sensitivity/" title="http://ejohn.org/blog/nodename-case-sensitivity/">détails sur la sensibilité à la casse de nodeName dans différents navigateurs</a> (en).</p> +<p>En XHTML (ou tout autre format XML), la valeur de <code>text_field</code> sera « div ». Cependant, en HTML, la valeur de <code>text_field</code> sera « DIV », parce que <code>nodeName</code> et <code>tagName</code> renvoient en casse majuscule sur les éléments HTML dans les DOM marqués comme des documents HTML. En lire plus <a href="http://ejohn.org/blog/nodename-case-sensitivity/">détails sur la sensibilité à la casse de nodeName dans différents navigateurs</a> (en).</p> <p>Notez que la propriété <code><a href="fr/DOM/element.tagName">tagName</a></code> aurait pu être uilisée à la place, puisque <code>nodeName</code> a la même valeur que <code>tagName</code> pour un élément. Souvenez vous cependant que <code>nodeName</code> renverra <code>#text</code> pour les nœuds texte tandis que <code>tagName</code> renverra <code>undefined</code>.</p> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h2> +<h2 id="Sp.C3.A9cification">Spécification</h2> <ul> - <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-F68D095">DOM Level 2 Core: Node.nodeName</a> <small>— <a class="external" href="http://www.yoyodesign.org/doc/w3c/dom2-core/core.html#ID-F68D095">traduction</a> (non normative)</small></li> - <li><a class="external" href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-F68D095">DOM Level 3 Core: Node.nodeName</a></li> + <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-F68D095">DOM Level 2 Core: Node.nodeName</a> <small>— <a href="http://www.yoyodesign.org/doc/w3c/dom2-core/core.html#ID-F68D095">traduction</a> (non normative)</small></li> + <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-F68D095">DOM Level 3 Core: Node.nodeName</a></li> <li><a href="http://www.whatwg.org/specs/web-apps/current-work/multipage/dom.html#apis-in-html-documents">HTML 5: APIs in HTML documents</a></li> </ul> diff --git a/files/fr/web/api/node/nodetype/index.html b/files/fr/web/api/node/nodetype/index.html index d6f0a4eb2e..2f6cd30d79 100644 --- a/files/fr/web/api/node/nodetype/index.html +++ b/files/fr/web/api/node/nodetype/index.html @@ -17,16 +17,16 @@ translation_of: Web/API/Node/nodeType <p>La propriété <strong><code>nodeType</code></strong> peut être utilisée pour distinguer les uns des autres les différents genres de noeuds tels que {{domxref("Element")}}, {{domxref("Text")}} et {{domxref("Comment")}} .</p> -<h2 id="Syntaxe"><font><font>Syntaxe</font></font></h2> +<h2 id="Syntaxe">Syntaxe</h2> -<pre class="syntaxbox"><var><font><font>Type</font></font></var> = <var><font><font>node</font></font></var> .nodeType +<pre class="syntaxbox"><var>Type</var> = <var>node</var> .nodeType </pre> -<p id="Exemple"><font><font>Renvoie un entier (<em>integer</em>) qui spécifie le type du noeud ; les valeurs possibles sont listées dans </font></font> {{anch("Constantes")}}.</p> +<p>Renvoie un entier (<em>integer</em>) qui spécifie le type du noeud ; les valeurs possibles sont listées dans {{anch("Constantes")}}.</p> -<h2 id="Exemple" name="Exemple"><a id="Constantes" name="Constantes"></a>Constantes</h2> +<h2>Constantes</h2> -<h3 id="Exemple" name="Exemple">Constantes de type nœud</h3> +<h3 id="Exemple">Constantes de type nœud</h3> <table class="standard-table"> <thead> @@ -114,9 +114,9 @@ translation_of: Web/API/Node/nodeType </tbody> </table> -<h2 id="Exemple" name="Exemple"><font><font>Exemples</font></font></h2> +<h2 id="Exemple">Exemples</h2> -<h3 id="Différents_types_de_noeuds"><font><font>Différents types de noeuds</font></font></h3> +<h3 id="Différents_types_de_noeuds">Différents types de noeuds</h3> <pre class="brush: js">document.nodeType === Node.DOCUMENT_NODE; // true (<em>vrai</em>) document.doctype.nodeType === Node.DOCUMENT_TYPE_NODE; // true (<em>vrai</em>) @@ -133,13 +133,13 @@ p.firstChild.nodeType === Node.TEXT_NODE; // true (<em>vrai</em>) <h3 id="Commentaires">Commentaires</h3> -<p><font><font>Cet exemple vérifie si le premier noeud dans l'élément du document est un noeud commentaire et si ce n'est pas le cas, affiche un message.</font></font></p> +<p>Cet exemple vérifie si le premier noeud dans l'élément du document est un noeud commentaire et si ce n'est pas le cas, affiche un message.</p> -<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="keyword token">var</span> node <span class="operator token">=</span> document<span class="punctuation token">.</span>documentElement<span class="punctuation token">.</span>firstChild<span class="punctuation token">;</span> -<span class="keyword token">if</span> <span class="punctuation token">(</span>node<span class="punctuation token">.</span>nodeType <span class="operator token">!=</span> Node<span class="punctuation token">.</span>COMMENT_NODE<span class="punctuation token">)</span> - console<span class="punctuation token">.</span><span class="function token">log</span><span class="punctuation token">(</span><span class="string token">"You should comment your code well!"</span><span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> +<pre class="brush: js">var node = document.documentElement.firstChild; +if (node.nodeType != Node.COMMENT_NODE) + console.log("You should comment your code well!");</pre> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification"><font><font>Spécifications</font></font></h2> +<h2 id="Sp.C3.A9cification">Spécifications</h2> <table class="standard-table"> <thead> diff --git a/files/fr/web/api/node/nodevalue/index.html b/files/fr/web/api/node/nodevalue/index.html index 07e228342e..9f3fa1f3b3 100644 --- a/files/fr/web/api/node/nodevalue/index.html +++ b/files/fr/web/api/node/nodevalue/index.html @@ -12,7 +12,7 @@ translation_of: Web/API/Node/nodeValue <p>La propriété <code><strong>Node.nodeValue</strong></code> renvoie ou définit la valeur du nœud courant.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox"><var>value</var> = <var>node</var>.nodeValue; </pre> @@ -80,10 +80,10 @@ translation_of: Web/API/Node/nodeValue <p>Lorsque <code>nodeValue</code> est défini comme étant <code>null</code>, l'assignation n'a aucun effet.</p> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h2> +<h2 id="Sp.C3.A9cification">Spécification</h2> <ul> - <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-F68D080">DOM Level 2 Core: Node.nodeValue</a> <small>— <a class="external" href="http://www.yoyodesign.org/doc/w3c/dom2-core/core.html#ID-F68D080">traduction</a> (non normative)</small></li> + <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-F68D080">DOM Level 2 Core: Node.nodeValue</a> <small>— <a href="http://www.yoyodesign.org/doc/w3c/dom2-core/core.html#ID-F68D080">traduction</a> (non normative)</small></li> </ul> <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> diff --git a/files/fr/web/api/node/normalize/index.html b/files/fr/web/api/node/normalize/index.html index c58ba06945..e7ca55ed31 100644 --- a/files/fr/web/api/node/normalize/index.html +++ b/files/fr/web/api/node/normalize/index.html @@ -5,18 +5,18 @@ translation_of: Web/API/Node/normalize --- <p>{{ ApiRef("DOM") }}</p> -<h2 id="R.C3.A9sum.C3.A9" name="R.C3.A9sum.C3.A9">Résumé</h2> +<h2 id="R.C3.A9sum.C3.A9">Résumé</h2> <p>Place le nœud spécifié et tout son sous-arbre dans une forme « normale ». Dans un sous-arbre normalisé, aucun nœud texte n'est vide et il n'y a pas de nœuds texte adjacents.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="eval"><em>élément</em>.normalize(); </pre> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> -<pre class="brush:js line-numbers language-js">var conteneur = document.createElement("div"); +<pre class="brush:js">var conteneur = document.createElement("div"); conteneur.appendChild( document.createTextNode("Partie 1 ") ); conteneu.appendChild( document.createTextNode("Partie 2 ") ); @@ -29,12 +29,12 @@ conteneur.normalize(); // À présent, conteneur.childNodes.length === 1 // conteneur.childNodes[0].textContent === "Partie 1 Partie 2 "</pre> -<h2 id="Notes" name="Notes">Notes</h2> +<h2 id="Notes">Notes</h2> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécification</h2> +<h2 id="Sp.C3.A9cification">Spécification</h2> <ul> - <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-normalize">DOM Level 2 Core: Node.normalize (en)</a> <small>— <a class="external" href="http://www.yoyodesign.org/doc/w3c/dom2-core/core.html#ID-normalize">traduction en français</a> (non normative)</small></li> + <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-normalize">DOM Level 2 Core: Node.normalize (en)</a> <small>— <a href="http://www.yoyodesign.org/doc/w3c/dom2-core/core.html#ID-normalize">traduction en français</a> (non normative)</small></li> </ul> <p>{{ languages( { "en": "en/DOM/element.normalize", "pl": "pl/DOM/element.normalize" } ) }}</p> diff --git a/files/fr/web/api/node/ownerdocument/index.html b/files/fr/web/api/node/ownerdocument/index.html index cc197c1d80..35b5eb6859 100644 --- a/files/fr/web/api/node/ownerdocument/index.html +++ b/files/fr/web/api/node/ownerdocument/index.html @@ -13,16 +13,16 @@ translation_of: Web/API/Node/ownerDocument <p>La propriété en lecture seule <code><strong>Node.ownerDocument</strong></code> renvoie l'objet document de niveau supérieur pour ce nœud.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="eval"><em>document</em> = element.ownerDocument; </pre> <ul> - <li><code>document</code> est l'objet <a href="https://developer.mozilla.org/fr/docs/Web/API/document"><code>document</code></a> parent de l'élément courant.</li> + <li><code>document</code> est l'objet <a href="/fr/docs/Web/API/document"><code>document</code></a> parent de l'élément courant.</li> </ul> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> <pre class="brush: html">// étant donné un nœud "p", obtient le premier enfant HTML // de l'objet document @@ -30,11 +30,11 @@ var d = p.ownerDocument; var html = d.documentElement; </pre> -<h2 id="Notes" name="Notes">Notes</h2> +<h2 id="Notes">Notes</h2> <p>L'objet <code>document</code> renvoyé par cette propriété est l'objet principal avec lequel tous les nœuds enfants du document HTML réel sont créés. Si cette propriété est utilisée sur un nœud qui est lui-même un document, le résultat est <code>null</code>.</p> -<h3 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécifications</h3> +<h3 id="Sp.C3.A9cification">Spécifications</h3> <table class="standard-table"> <tbody> @@ -63,8 +63,4 @@ var html = d.documentElement; <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - - -<p>{{Compat("api.Node.ownerDocument")}}</p> - -<div id="compat-desktop"> </div> +<p>{{Compat("api.Node.ownerDocument")}}</p>
\ No newline at end of file diff --git a/files/fr/web/api/node/parentelement/index.html b/files/fr/web/api/node/parentelement/index.html index 7da92f2334..673cb3b8b2 100644 --- a/files/fr/web/api/node/parentelement/index.html +++ b/files/fr/web/api/node/parentelement/index.html @@ -14,21 +14,21 @@ translation_of: Web/API/Node/parentElement <div>{{APIRef("DOM")}}</div> </div> -<div>La propriété en lecture seule <code style="font-style: normal;"><strong>Node.parentElement</strong></code> renvoie le parent du noeud DOM ({{domxref("Element")}}) ou <code style="font-style: normal;"><strong>null</strong></code> si ce dernier n'a pas de parent ou si le parent n'est pas un {{domxref("Element")}} du DOM.</div> +<div>La propriété en lecture seule <code><strong>Node.parentElement</strong></code> renvoie le parent du noeud DOM ({{domxref("Element")}}) ou <code><strong>null</strong></code> si ce dernier n'a pas de parent ou si le parent n'est pas un {{domxref("Element")}} du DOM.</div> </div> -<h2 id="Syntax" name="Syntax">Syntaxe</h2> +<h2 id="Syntax">Syntaxe</h2> <pre class="syntaxbox"><em>parentElement</em> = <em>node</em>.parentElement </pre> -<p><code><strong>parentElement</strong></code> référence l'élément parent d'un n<span class="notranslate" style="line-height: 1.5;">œ</span>ud (<code><strong>node</strong></code>). C'est toujours un objet <span style="line-height: 1.5;">{{domxref("Element")}} </span> du DOM <span style="line-height: 1.5;">ou <code>null</code>.</span></p> +<p><code><strong>parentElement</strong></code> référence l'élément parent d'un nœud (<code><strong>node</strong></code>). C'est toujours un objet {{domxref("Element")}} du DOM ou <code>null</code>.</p> -<h2 id="Example" name="Example">Exemple</h2> +<h2 id="Example">Exemple</h2> -<pre class="brush:js line-numbers language-js"><code class="language-js"><span class="keyword token">if</span> <span class="punctuation token">(</span>node<span class="punctuation token">.</span>parentElement<span class="punctuation token">)</span> <span class="punctuation token">{</span> - node<span class="punctuation token">.</span>parentElement<span class="punctuation token">.</span>style<span class="punctuation token">.</span>color <span class="operator token">=</span> <span class="string token">"red"</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span></code></pre> +<pre class="brush:js">if (node.parentElement) { + node.parentElement.style.color = "red"; +}</pre> <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> @@ -46,7 +46,7 @@ translation_of: Web/API/Node/parentElement <li>{{spec("http://dvcs.w3.org/hg/domcore/raw-file/tip/Overview.html#parent-element", "DOM Level 4: Node.parentElement", "WD")}}</li> </ul> -<h2 id="See_also" name="See_also">Voir aussi</h2> +<h2 id="See_also">Voir aussi</h2> <ul> <li>{{domxref("Node.parentNode")}}</li> diff --git a/files/fr/web/api/node/parentnode/index.html b/files/fr/web/api/node/parentnode/index.html index 50123e2cb6..5d2088cbf6 100644 --- a/files/fr/web/api/node/parentnode/index.html +++ b/files/fr/web/api/node/parentnode/index.html @@ -11,47 +11,42 @@ translation_of: Web/API/Node/parentNode --- <p>{{APIRef("DOM")}}</p> -<p>La propriété en lecture seule <strong>parentNode</strong> <span id="result_box" lang="fr"><span>renvoie le parent du nœud spécifié dans l'arborescence de DOM</span></span> .</p> +<p>La propriété en lecture seule <strong>parentNode</strong> renvoie le parent du nœud spécifié dans l'arborescence de DOM .</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox"><em>parentNode</em> = <em>node</em>.parentNode</pre> -<p><code>parentNode</code> est l'élément parent du nœud courant. <span class="short_text" id="result_box" lang="fr"><span>Le parent d'un élément est un </span></span>nœud <code>Element</code> , un nœud <code>Document</code> ou un nœud <code>DocumentFragment</code> .</p> +<p><code>parentNode</code> est l'élément parent du nœud courant. Le parent d'un élément est un nœud <code>Element</code> , un nœud <code>Document</code> ou un nœud <code>DocumentFragment</code> .</p> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> -<pre class="brush:js line-numbers language-js"><code class="language-js"><span class="keyword token">if</span> <span class="punctuation token">(</span>node<span class="punctuation token">.</span>parentNode<span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="comment token">// supprime un noeud de l'arbre, </span> - <span class="comment token">// sauf s'il a déjà été supprimé</span> - node<span class="punctuation token">.</span>parentNode<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>node<span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span></code></pre> +<pre class="brush:js">if (node.parentNode) { + // supprime un noeud de l'arbre, + // sauf s'il a déjà été supprimé + node.parentNode.removeChild(node); +}</pre> -<h2 id="Notes" name="Notes">Notes</h2> +<h2 id="Notes">Notes</h2> -<p>Les <a href="https://developer.mozilla.org/en-US/docs/DOM/Node.nodeType" title="DOM/Node.nodeType">noeuds </a><code>Document</code> et <code>DocumentFragment</code> ne peuvent jamais avoir de parent, alors <code>parentNode</code> retournera toujours <code>null</code> .</p> +<p>Les <a href="/en-US/docs/DOM/Node.nodeType">noeuds </a><code>Document</code> et <code>DocumentFragment</code> ne peuvent jamais avoir de parent, alors <code>parentNode</code> retournera toujours <code>null</code> .</p> <p> Il renvoie également <code>null</code> si le nœud vient d'être créé et n'est pas encore attaché à l'arbre.</p> <h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> -<div id="compat-desktop"> - - <p>{{Compat("api.Node.parentNode")}}</p> <h2 id="Spécification">Spécification</h2> </div> <ul> - <li><a class="external external-icon" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-1060184317">DOM Level 2 Core: Node.parentNode</a></li> - <li><a class="external external-icon" href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-1060184317">DOM Level 3 Core: Node.parentNode</a></li> + <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-1060184317">DOM Level 2 Core: Node.parentNode</a></li> + <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-1060184317">DOM Level 3 Core: Node.parentNode</a></li> </ul> <h2 id="Voir_aussi">Voir aussi</h2> -<article class="approved text-content"> -<div class="boxed translate-rendered"> <ul> <li>{{Domxref("Node.firstChild")}}</li> <li>{{Domxref("Node.lastChild")}}</li> @@ -60,8 +55,4 @@ translation_of: Web/API/Node/parentNode <li>{{Domxref("Node.parentElement")}}</li> <li>{{Domxref("Node.previousSibling")}}</li> <li>{{Domxref("Node.removeChild")}}</li> -</ul> -</div> -</article> - -<article class="localized"></article> +</ul>
\ No newline at end of file diff --git a/files/fr/web/api/node/previoussibling/index.html b/files/fr/web/api/node/previoussibling/index.html index 2f9f178b1f..31e02f5c7a 100644 --- a/files/fr/web/api/node/previoussibling/index.html +++ b/files/fr/web/api/node/previoussibling/index.html @@ -12,45 +12,45 @@ translation_of: Web/API/Node/previousSibling <p>La propriété en lecture seule <code><strong>Node.previousSibling</strong></code> renvoie le nœud (<code>node</code>) précédant immédiatement le nœud courant dans la liste {{domxref("Node.childNodes", "childNodes")}} de son parent, ou <code>null</code> s'il s'agit du premier nœud de la liste.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox"><var>previousNode</var> = <em>node</em>.previousSibling; </pre> <h2 id="Exemple">Exemple</h2> -<pre class="brush:js line-numbers language-js"><code class="language-js"><span class="comment token">// <a><b1 id="b1"/><b2 id="b2"/></a></span> +<pre class="brush:js">// <a><b1 id="b1"/><b2 id="b2"/></a> -<span class="function token">alert</span><span class="punctuation token">(</span>document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"b1"</span><span class="punctuation token">)</span><span class="punctuation token">.</span>previousSibling<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// null</span> -<span class="function token">alert</span><span class="punctuation token">(</span>document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"b2"</span><span class="punctuation token">)</span><span class="punctuation token">.</span>previousSibling<span class="punctuation token">.</span>id<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// "b1"</span></code></pre> +alert(document.getElementById("b1").previousSibling); // null +alert(document.getElementById("b2").previousSibling.id); // "b1"</pre> -<h2 id="Notes" name="Notes">Notes</h2> +<h2 id="Notes">Notes</h2> <p></p><p>Les navigateurs basés sur Gecko insèrent des nœuds texte dans un document pour représenter des espaces - vides dans le balisage source. Par conséquent, un nœud obtenu par exemple via <a href="/fr/docs/Web/API/Node/firstChild" title="La propriété en lecture seule Node.firstChild renvoie le premier nœud enfant de l'arbre ou null s'il n'en a pas. Si le noeud est un Document , il renvoie le premier noeud de la liste de ses enfants directs."><code>Node.firstChild</code></a> ou + vides dans le balisage source. Par conséquent, un nœud obtenu par exemple via <a href="/fr/docs/Web/API/Node/firstChild"><code>Node.firstChild</code></a> ou <a href="/fr/docs/Web/API/Node/previousSibling" title='{{APIRef("DOM")}}'><code>Node.previousSibling</code></a> peut faire référence à un nœud texte contenant des espaces plutôt qu'au véritable élément que l'auteur comptait obtenir.</p> <p>Consultez <a href="/fr/docs/Gestion_des_espaces_dans_le_DOM">Gestion des espaces dans le DOM</a> - et <a class="external" href="http://www.w3.org/DOM/faq.html#emptytext" rel="noopener"><i>Why are some Text nodes empty?</i> + et <a href="http://www.w3.org/DOM/faq.html#emptytext" rel="noopener"><i>Why are some Text nodes empty?</i> dans la FAQ DOM 3 du W3C</a> pour plus d'informations.</p><p></p> -<p>L'opération inverse <code><a href="https://developer.mozilla.org/fr/docs/Web/API/Node/nextSibling">Node.nextSibling</a></code> permet de rechercher l'élément suivant.</p> +<p>L'opération inverse <code><a href="/fr/docs/Web/API/Node/nextSibling">Node.nextSibling</a></code> permet de rechercher l'élément suivant.</p> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécifications</h2> +<h2 id="Sp.C3.A9cification">Spécifications</h2> <ul> - <li><a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#attribute-previousSibling">DOM Level 1 Core: previousSibling</a> <small>— <a class="external" href="http://xmlfr.org/w3c/TR/REC-DOM-Level-1/level-one-core.html#attribute-previousSibling">traduction</a> (non normative)</small></li> - <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-640FB3C8">DOM Level 2 Core: previousSibling</a> <small>— <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-640FB3C8">traduction</a> (non normative)</small></li> + <li><a href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#attribute-previousSibling">DOM Level 1 Core: previousSibling</a> <small>— <a href="http://xmlfr.org/w3c/TR/REC-DOM-Level-1/level-one-core.html#attribute-previousSibling">traduction</a> (non normative)</small></li> + <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-640FB3C8">DOM Level 2 Core: previousSibling</a> <small>— <a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-640FB3C8">traduction</a> (non normative)</small></li> <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-640FB3C8">DOM Level 3 Core: previousSibling</a></li> </ul> -<h2 class="noinclude" id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> <p>{{Compat("api.Node.previousSibling")}}</p> -<h2 class="noinclude" id="Voir_aussi">Voir aussi</h2> +<h2 id="Voir_aussi">Voir aussi</h2> <p>{{domxref("Node.nextSibling")}}</p> diff --git a/files/fr/web/api/node/removechild/index.html b/files/fr/web/api/node/removechild/index.html index cff831cdef..051a65c4e6 100644 --- a/files/fr/web/api/node/removechild/index.html +++ b/files/fr/web/api/node/removechild/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Node/removeChild <p>La méthode <code><strong>Node.removeChild()</strong></code> retire un nœud enfant de l'arbre DOM et retourne le nœud retiré.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox"><em>var oldChild</em> = <em>node</em>.removeChild(<em>child</em>); <strong>OR</strong> @@ -23,20 +23,20 @@ translation_of: Web/API/Node/removeChild <ul> <li><code>child</code> est le nœud enfant à retirer du DOM.</li> - <li><code><font face="Consolas, Liberation Mono, Courier, monospace">node </font></code>est le nœud parent de <code>child</code>.</li> + <li><code>node </code>est le nœud parent de <code>child</code>.</li> <li><code>oldchild</code> conserve une référence au nœud enfant retiré. <code>oldchild</code> === <code>child</code>.</li> </ul> <p>Le nœud enfant retiré existe toujours en mémoire, mais ne fait plus partie du DOM. Avec la première syntaxe, il est possible de réutiliser ultérieurement dans le code le nœud retiré, à l'aide de la référence à l'objet <code>ancienEnfant</code><em>. </em></p> -<p>Avec la seconde forme montrée en exemple, aucune référence à l'objet <code>ancienEnfant</code> n'est conservée ; ainsi, en supposant que votre code n'a conservé nulle part ailleurs cette référence à ce nœud, il devient immédiatement inutilisable et irrécupérable, et sera en général <a href="https://developer.mozilla.org/fr/docs/Web/JavaScript/Gestion_de_la_m%C3%A9moire">automatiquement supprimé</a> de la mémoire après un court moment.</p> +<p>Avec la seconde forme montrée en exemple, aucune référence à l'objet <code>ancienEnfant</code> n'est conservée ; ainsi, en supposant que votre code n'a conservé nulle part ailleurs cette référence à ce nœud, il devient immédiatement inutilisable et irrécupérable, et sera en général <a href="/fr/docs/Web/JavaScript/Gestion_de_la_m%C3%A9moire">automatiquement supprimé</a> de la mémoire après un court moment.</p> <p>Si <code>child</code> n'est pas un enfant du noeud <code>element</code>, la méthode provoque une exception. Une exception sera aussi lancée dans la cas où le nœud <code>enfant </code>est bien un enfant du nœud <code>element </code>au moment de l'appel à la méthode, mais qu'il a été retiré par un gestionnaire d'événement invoqué dans la cadre d'une tentative de suppression du nœud <code>element </code>(comme <em>blur</em>).</p> <p>La méthode peut lever une exception de deux façons :</p> <ol> - <li>Si <code>enfant</code> était bien un enfant de <font face="Consolas, Liberation Mono, Courier, monospace">element </font>et qu'il existe donc dans le DOM, mais qu'il a déjà été retiré, la méthode provoque l'exception suivante :<code></code><br> + <li>Si <code>enfant</code> était bien un enfant de element et qu'il existe donc dans le DOM, mais qu'il a déjà été retiré, la méthode provoque l'exception suivante :<code></code><br> <code>Uncaught NotFoundError: Failed to execute 'removeChild' on 'element': The node to be removed is not a child of this node</code>.</li> <li>si l'<code>enfant</code> n'existe pas dans le DOM de la page, la méthode provoque l'exception suivante :<br> <code>Uncaught TypeError: Failed to execute 'removeChild' on 'element': parameter 1 is not of type 'Node'.</code></li> @@ -44,62 +44,62 @@ translation_of: Web/API/Node/removeChild <h2 id="Exemples">Exemples</h2> -<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="comment token"><!--Sample HTML code--></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>top<span class="punctuation token">"</span></span> <span class="attr-name token">align</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>center<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> <span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> +<pre class="brush: html"><!--Sample HTML code--> +<div id="top" align="center"> </div> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="language-javascript script token"> - <span class="keyword token">var</span> top <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"top"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="keyword token">var</span> nested <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"nested"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<script type="text/javascript"> + var top = document.getElementById("top"); + var nested = document.getElementById("nested"); - <span class="keyword token">var</span> garbage <span class="operator token">=</span> top<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>nested<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">//Cas test 2: la méthode lance l'exception (2)</span> + var garbage = top.removeChild(nested); //Cas test 2: la méthode lance l'exception (2) -</span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span> +</script> -<span class="comment token"><!--Sample HTML code--></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>top<span class="punctuation token">"</span></span> <span class="attr-name token">align</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>center<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> - <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>nested<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> +<!--Sample HTML code--> +<div id="top" align="center"> + <div id="nested"></div> +</div> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>script</span> <span class="attr-name token">type</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>text/javascript<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="language-javascript script token"> - <span class="keyword token">var</span> top <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"top"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="keyword token">var</span> nested <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"nested"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> +<script type="text/javascript"> + var top = document.getElementById("top"); + var nested = document.getElementById("nested"); - <span class="keyword token">var</span> garbage <span class="operator token">=</span> top<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>nested<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Ce premier appel supprime correctement le noeud</span> + var garbage = top.removeChild(nested); // Ce premier appel supprime correctement le noeud - <span class="comment token">// ......</span> - garbage <span class="operator token">=</span> top<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>nested<span class="punctuation token">)</span><span class="punctuation token">;</span> <span class="comment token">// Cas test 1 : la méthode dans le second appel ici, lance l'exception (1)</span> + // ...... + garbage = top.removeChild(nested); // Cas test 1 : la méthode dans le second appel ici, lance l'exception (1) -</span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>script</span><span class="punctuation token">></span></span></code></pre> +</script></pre> -<pre class="brush: html line-numbers language-html"><code class="language-html"><span class="comment token"><!--Sample HTML code--></span> +<pre class="brush: html"><!--Sample HTML code--> -<span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>top<span class="punctuation token">"</span></span> <span class="attr-name token">align</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>center<span class="punctuation token">"</span></span><span class="punctuation token">></span></span> - <span class="tag token"><span class="tag token"><span class="punctuation token"><</span>div</span> <span class="attr-name token">id</span><span class="attr-value token"><span class="punctuation token">=</span><span class="punctuation token">"</span>nested<span class="punctuation token">"</span></span><span class="punctuation token">></span></span><span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span> -<span class="tag token"><span class="tag token"><span class="punctuation token"></</span>div</span><span class="punctuation token">></span></span></code></pre> +<div id="top" align="center"> + <div id="nested"></div> +</div></pre> -<pre class="brush:js line-numbers language-js"><code class="language-js"><span class="comment token">// Supprime un élément spécifié quand son noeud parent est connu</span> -<span class="keyword token">var</span> d <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"top"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="keyword token">var</span> d_nested <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"nested"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="keyword token">var</span> throwawayNode <span class="operator token">=</span> d<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>d_nested<span class="punctuation token">)</span><span class="punctuation token">;</span></code></pre> +<pre class="brush:js">// Supprime un élément spécifié quand son noeud parent est connu +var d = document.getElementById("top"); +var d_nested = document.getElementById("nested"); +var throwawayNode = d.removeChild(d_nested);</pre> -<pre class="brush:js line-numbers language-js"><code class="language-js"><span class="comment token">// Supprime un élément spécifié sans avoir à spécifier son noeud parent</span> -<span class="keyword token">var</span> node <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"nested"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="keyword token">if</span> <span class="punctuation token">(</span>node<span class="punctuation token">.</span>parentNode<span class="punctuation token">)</span> <span class="punctuation token">{</span> - node<span class="punctuation token">.</span>parentNode<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>node<span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span></code></pre> +<pre class="brush:js">// Supprime un élément spécifié sans avoir à spécifier son noeud parent +var node = document.getElementById("nested"); +if (node.parentNode) { + node.parentNode.removeChild(node); +}</pre> -<pre class="brush:js line-numbers language-js"> -<code class="language-js"><span class="comment token">// Supprime tous les enfant d'un élément</span> -<span class="keyword token">var</span> element <span class="operator token">=</span> document<span class="punctuation token">.</span><span class="function token">getElementById</span><span class="punctuation token">(</span><span class="string token">"top"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="keyword token">while</span> <span class="punctuation token">(</span>element<span class="punctuation token">.</span>firstChild<span class="punctuation token">)</span> <span class="punctuation token">{</span> - element<span class="punctuation token">.</span><span class="function token">removeChild</span><span class="punctuation token">(</span>element<span class="punctuation token">.</span>firstChild<span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span></code></pre> +<pre class="brush:js"> +// Supprime tous les enfant d'un élément +var element = document.getElementById("top"); +while (element.firstChild) { + element.removeChild(element.firstChild); +}</pre> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécifications</h2> +<h2 id="Sp.C3.A9cification">Spécifications</h2> <ul> - <li><a class="external" href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#method-removeChild">DOM Level 1 Core: removeChild</a> — <a class="external" href="http://xmlfr.org/w3c/TR/REC-DOM-Level-1/level-one-core.html#method-removeChild">traduction en français</a> (non normative)</li> - <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-1734834066">DOM Level 2 Core: removeChild</a> — <a class="external" href="http://www.yoyodesign.org/doc/w3c/dom2/core/core.html#ID-1734834066">traduction en français</a> (non normative)</li> + <li><a href="http://www.w3.org/TR/REC-DOM-Level-1/level-one-core.html#method-removeChild">DOM Level 1 Core: removeChild</a> — <a href="http://xmlfr.org/w3c/TR/REC-DOM-Level-1/level-one-core.html#method-removeChild">traduction en français</a> (non normative)</li> + <li><a href="http://www.w3.org/TR/DOM-Level-2-Core/core.html#ID-1734834066">DOM Level 2 Core: removeChild</a> — <a href="http://www.yoyodesign.org/doc/w3c/dom2/core/core.html#ID-1734834066">traduction en français</a> (non normative)</li> <li><a href="http://www.w3.org/TR/DOM-Level-3-Core/core.html#ID-1734834066">DOM Level 3 Core: removeChild</a></li> </ul> diff --git a/files/fr/web/api/node/replacechild/index.html b/files/fr/web/api/node/replacechild/index.html index 3fb6b0e8df..3cdf5aa950 100644 --- a/files/fr/web/api/node/replacechild/index.html +++ b/files/fr/web/api/node/replacechild/index.html @@ -14,7 +14,7 @@ translation_of: Web/API/Node/replaceChild <p>La méthode <strong><code>Node.replaceChild()</code></strong> remplace un nœud enfant du noeud spécifié par un autre nœud.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox"><em>replacedNode</em> = <em>parentNode</em>.replaceChild(<em>newChild</em>, <em>oldChild</em>); </pre> diff --git a/files/fr/web/api/node/textcontent/index.html b/files/fr/web/api/node/textcontent/index.html index aa5b90cf7a..63e892d5b6 100644 --- a/files/fr/web/api/node/textcontent/index.html +++ b/files/fr/web/api/node/textcontent/index.html @@ -12,17 +12,17 @@ translation_of: Web/API/Node/textContent <p>La propriété <code><strong>Node.textContent</strong></code> représente le contenu textuel d'un nœud et de ses descendants.</p> -<h2 id="Syntaxe" name="Syntaxe">Syntaxe</h2> +<h2 id="Syntaxe">Syntaxe</h2> <pre class="syntaxbox">var <em>text</em> = element.textContent; element.textContent = "ceci est un simple exemple de texte"; </pre> -<h2 id="Notes" name="Notes">Description</h2> +<h2 id="Notes">Description</h2> <ul> - <li><code>textContent</code> renvoie <code>null</code> si l'élément est un <a href="https://developer.mozilla.org/fr/docs/Web/API/document">document</a>, un type de document (doctype) ou une notation. Pour saisir toutes les données textuelles et CDATA pour l'ensemble du document, on peut utiliser <code> <a href="https://developer.mozilla.org/fr/docs/Web/API/document/documentElement">document.documentElement</a>.textContent</code> .</li> - <li>Si le nœud est une section CDATA, un commentaire, une instruction de traitement ou un nœud texte, <code>textContent</code> renvoie le texte à l'intérieur du nœud (la valeur <a href="https://developer.mozilla.org/fr/docs/Web/API/Node/nodeValue">nodeValue</a>).</li> + <li><code>textContent</code> renvoie <code>null</code> si l'élément est un <a href="/fr/docs/Web/API/document">document</a>, un type de document (doctype) ou une notation. Pour saisir toutes les données textuelles et CDATA pour l'ensemble du document, on peut utiliser <code> <a href="/fr/docs/Web/API/document/documentElement">document.documentElement</a>.textContent</code> .</li> + <li>Si le nœud est une section CDATA, un commentaire, une instruction de traitement ou un nœud texte, <code>textContent</code> renvoie le texte à l'intérieur du nœud (la valeur <a href="/fr/docs/Web/API/Node/nodeValue">nodeValue</a>).</li> <li>Pour les autres types de nœuds, <code>textContent</code> renvoie la concaténation des valeurs de propriété <code>textContent</code> de chaque nœud enfant, à l'exception des commentaires et nœuds d'instructions de traitement. Si le nœud n'a pas d'enfants, il s'agira d'une chaîne vide.</li> <li>En définissant cette propriété sur un nœud, on enlève tous ses enfants et ceux-ci sont remplacés par un seul nœud texte avec la valeur donnée.</li> </ul> @@ -42,7 +42,7 @@ element.textContent = "ceci est un simple exemple de texte"; <p>{{domxref("Element.innerHTML")}} renvoie le HTML comme son nom l'indique. Souvent, pour récupérer ou écrire du texte dans un élément, les utilisateurs utilisent <code>innerHTML</code>. Cependant, <code>textContent</code> a souvent de meilleures performances car le texte n'est pas analysé en HTML. De plus, l'utilisation de <code>textContent</code> peut empêcher les attaques XSS.</p> -<h2 id="Exemple" name="Exemple">Exemple</h2> +<h2 id="Exemple">Exemple</h2> <pre class="eval">// Étant donné le fragment de HTML suivant : // <div id="divA">Ceci est un <span>exemple de</span> texte</div> @@ -58,27 +58,27 @@ document.getElementById("divA").textContent = "Ceci est un exemple de texte"; <h2 id="Polyfill_pour_IE8">Polyfill pour IE8</h2> -<pre class="brush: js line-numbers language-js"><code class="language-js"><span class="comment token">// Source: Eli Grey @ http://eligrey.com/blog/post/textcontent-in-ie8</span> -<span class="keyword token">if</span> <span class="punctuation token">(</span>Object<span class="punctuation token">.</span>defineProperty - <span class="operator token">&&</span> Object<span class="punctuation token">.</span>getOwnPropertyDescriptor - <span class="operator token">&&</span> Object<span class="punctuation token">.</span><span class="function token">getOwnPropertyDescriptor</span><span class="punctuation token">(</span>Element<span class="punctuation token">.</span>prototype<span class="punctuation token">,</span> <span class="string token">"textContent"</span><span class="punctuation token">)</span> - <span class="operator token">&&</span> <span class="operator token">!</span>Object<span class="punctuation token">.</span><span class="function token">getOwnPropertyDescriptor</span><span class="punctuation token">(</span>Element<span class="punctuation token">.</span>prototype<span class="punctuation token">,</span> <span class="string token">"textContent"</span><span class="punctuation token">)</span><span class="punctuation token">.</span><span class="keyword token">get</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="punctuation token">(</span><span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">var</span> innerText <span class="operator token">=</span> Object<span class="punctuation token">.</span><span class="function token">getOwnPropertyDescriptor</span><span class="punctuation token">(</span>Element<span class="punctuation token">.</span>prototype<span class="punctuation token">,</span> <span class="string token">"innerText"</span><span class="punctuation token">)</span><span class="punctuation token">;</span> - Object<span class="punctuation token">.</span><span class="function token">defineProperty</span><span class="punctuation token">(</span>Element<span class="punctuation token">.</span>prototype<span class="punctuation token">,</span> <span class="string token">"textContent"</span><span class="punctuation token">,</span> - <span class="comment token">// Passing innerText or innerText.get directly does not work,</span> - <span class="comment token">// wrapper function is required.</span> - <span class="punctuation token">{</span> - <span class="keyword token">get</span><span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span><span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">return</span> innerText<span class="punctuation token">.</span><span class="keyword token">get</span><span class="punctuation token">.</span><span class="function token">call</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="punctuation token">}</span><span class="punctuation token">,</span> - <span class="keyword token">set</span><span class="punctuation token">:</span> <span class="keyword token">function</span><span class="punctuation token">(</span>s<span class="punctuation token">)</span> <span class="punctuation token">{</span> - <span class="keyword token">return</span> innerText<span class="punctuation token">.</span><span class="keyword token">set</span><span class="punctuation token">.</span><span class="function token">call</span><span class="punctuation token">(</span><span class="keyword token">this</span><span class="punctuation token">,</span> s<span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="punctuation token">}</span> - <span class="punctuation token">}</span> - <span class="punctuation token">)</span><span class="punctuation token">;</span> - <span class="punctuation token">}</span><span class="punctuation token">)</span><span class="punctuation token">(</span><span class="punctuation token">)</span><span class="punctuation token">;</span> -<span class="punctuation token">}</span></code></pre> +<pre class="brush: js">// Source: Eli Grey @ http://eligrey.com/blog/post/textcontent-in-ie8 +if (Object.defineProperty + && Object.getOwnPropertyDescriptor + && Object.getOwnPropertyDescriptor(Element.prototype, "textContent") + && !Object.getOwnPropertyDescriptor(Element.prototype, "textContent").get) { + (function() { + var innerText = Object.getOwnPropertyDescriptor(Element.prototype, "innerText"); + Object.defineProperty(Element.prototype, "textContent", + // Passing innerText or innerText.get directly does not work, + // wrapper function is required. + { + get: function() { + return innerText.get.call(this); + }, + set: function(s) { + return innerText.set.call(this, s); + } + } + ); + })(); +}</pre> <ul> </ul> @@ -89,9 +89,9 @@ document.getElementById("divA").textContent = "Ceci est un exemple de texte"; <p>{{Compat("api.Node.textContent")}}</p> -<h2 id="Sp.C3.A9cification" name="Sp.C3.A9cification">Spécifications</h2> +<h2 id="Sp.C3.A9cification">Spécifications</h2> -<table class="spectable standard-table"> +<table class="standard-table"> <tbody> <tr> <th scope="col">Spécification</th> |