diff options
Diffstat (limited to 'files/fr/web/api/range')
| -rw-r--r-- | files/fr/web/api/range/createcontextualfragment/index.md | 65 | ||||
| -rw-r--r-- | files/fr/web/api/range/detach/index.md | 53 | ||||
| -rw-r--r-- | files/fr/web/api/range/extractcontents/index.md | 67 | ||||
| -rw-r--r-- | files/fr/web/api/range/index.md | 186 | ||||
| -rw-r--r-- | files/fr/web/api/range/insertnode/index.md | 63 | ||||
| -rw-r--r-- | files/fr/web/api/range/selectnode/index.md | 60 | ||||
| -rw-r--r-- | files/fr/web/api/range/setstart/index.md | 67 | ||||
| -rw-r--r-- | files/fr/web/api/range/surroundcontents/index.md | 83 |
8 files changed, 254 insertions, 390 deletions
diff --git a/files/fr/web/api/range/createcontextualfragment/index.md b/files/fr/web/api/range/createcontextualfragment/index.md index 6f9342d87d..d5e9c573f2 100644 --- a/files/fr/web/api/range/createcontextualfragment/index.md +++ b/files/fr/web/api/range/createcontextualfragment/index.md @@ -3,55 +3,38 @@ title: Range.createContextualFragment() slug: Web/API/Range/createContextualFragment translation_of: Web/API/Range/createContextualFragment --- -<p>La méthode <strong><code>Range.createContextualFragment()</code></strong> retourne un {{domxref("DocumentFragment")}} en invoquant l’algorithme d’analyse de fragment HTML ou l’algorithme d’analyse de fragment XML, avec le début du <code>range</code> (le <em>parent</em> du nœud sélectionné) comme nœud de contexte. L’algorithme d’analyse de fragment HTML est utilisé si le <code>range</code> appartient à un <code>Document</code> dont le bit « HTMLness » est défini. Dans le cas du HTML, si le nœud de contexte est censé être <code>html</code>, pour des raisons historiques l’algorithme d’analyse de fragment est invoqué avec <code>body</code> pour contexte à la place.</p> +La méthode **`Range.createContextualFragment()`** retourne un {{domxref("DocumentFragment")}} en invoquant l’algorithme d’analyse de fragment HTML ou l’algorithme d’analyse de fragment XML, avec le début du `range` (le _parent_ du nœud sélectionné) comme nœud de contexte. L’algorithme d’analyse de fragment HTML est utilisé si le `range` appartient à un `Document` dont le bit « HTMLness » est défini. Dans le cas du HTML, si le nœud de contexte est censé être `html`, pour des raisons historiques l’algorithme d’analyse de fragment est invoqué avec `body` pour contexte à la place. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><em>documentFragment</em> = <em>range</em>.createContextualFragment( <em>chaineHTML</em> ) -</pre> + documentFragment = range.createContextualFragment( chaineHTML ) -<h3 id="Param.C3.A8tres">Paramètres</h3> +### Paramètres -<dl> - <dt><em>chaineHTML</em></dt> - <dd>Une chaîne contenant du texte et des balises à convertir en un fragment de document.</dd> -</dl> +- _chaineHTML_ + - : Une chaîne contenant du texte et des balises à convertir en un fragment de document. -<h2 id="Exemple">Exemple</h2> +## Exemple -<pre class="brush: js">var chaineHTML = "<div>Je suis un nœud div<div>"; +```js +var chaineHTML = "<div>Je suis un nœud div<div>"; var range = document.createRange(); // fait que le parent de la première div du document devient le nœud de contexte range.selectNode(document.getElementsByTagName("div").item(0)); var documentFragment = range.createContextualFragment(chaineHTML); document.body.appendChild(documentFragment); -</pre> - -<h2 id="Specifications">Spécification</h2> - -<table class="standard-table"> - <thead> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - </thead> - <tbody> - <tr> - <td>{{SpecName('DOM Parsing', '#idl-def-range-createcontextualfragment(domstring)', 'Range.createContextualFragment()')}}</td> - <td>{{Spec2('DOM Parsing')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> - -<h2 id="Browser_compatibility">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Range.createContextualFragment")}}</p> - -<h2 id="See_also">Voir aussi</h2> - -<ul> - <li><a href="/fr/docs/DOM/DOM_Reference">Index des interfaces DOM</a></li> -</ul> +``` + +## Spécification + +| Spécification | Statut | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------- | -------------------- | +| {{SpecName('DOM Parsing', '#idl-def-range-createcontextualfragment(domstring)', 'Range.createContextualFragment()')}} | {{Spec2('DOM Parsing')}} | Définition initiale. | + +## Compatibilité des navigateurs + +{{Compat("api.Range.createContextualFragment")}} + +## Voir aussi + +- [Index des interfaces DOM](/fr/docs/DOM/DOM_Reference) diff --git a/files/fr/web/api/range/detach/index.md b/files/fr/web/api/range/detach/index.md index b1b68cd16d..c02aaa937a 100644 --- a/files/fr/web/api/range/detach/index.md +++ b/files/fr/web/api/range/detach/index.md @@ -3,53 +3,34 @@ title: Range.detach() slug: Web/API/Range/detach translation_of: Web/API/Range/detach --- -<p>{{ApiRef("DOM")}}</p> +{{ApiRef("DOM")}} -<p>La méthode <strong><code>Range.detach()</code></strong> n'a aucun effet. Elle permet de désactiver l'objet {{domxref("Range")}} et de libérer les ressources associées. Cette méthode a été conservée pour des raisons de compatibilités.</p> +La méthode **`Range.detach()`** n'a aucun effet. Elle permet de désactiver l'objet {{domxref("Range")}} et de libérer les ressources associées. Cette méthode a été conservée pour des raisons de compatibilités. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox">range.detach(); -</pre> + range.detach(); -<h2 id="Exemple">Exemple</h2> +## Exemple -<pre class="brush:js">var range = document.createRange(); +```js +var range = document.createRange(); range.selectNode(document.getElementsByTagName("div").item(0)); range.detach(); -</pre> +``` -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Status</th> - <th scope="col">Commentaires</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-range-detach', 'Range.detach()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>Aucun changement.</td> - </tr> - <tr> - <td>{{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-detach', 'Range.detach()')}}</td> - <td>{{Spec2('DOM2 Traversal_Range')}}</td> - <td>Spécification initiale.</td> - </tr> - </tbody> -</table> +| Spécification | Status | Commentaires | +| -------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------- | ----------------------- | +| {{SpecName('DOM WHATWG', '#dom-range-detach', 'Range.detach()')}} | {{Spec2('DOM WHATWG')}} | Aucun changement. | +| {{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-detach', 'Range.detach()')}} | {{Spec2('DOM2 Traversal_Range')}} | Spécification initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs +{{Compat("api.Range.detach")}} +## Voir aussi -<p>{{Compat("api.Range.detach")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li><a href="/en-US/docs/Web/API/Document_Object_Model">The DOM interfaces index</a></li> -</ul> +- [The DOM interfaces index](/en-US/docs/Web/API/Document_Object_Model) diff --git a/files/fr/web/api/range/extractcontents/index.md b/files/fr/web/api/range/extractcontents/index.md index dd0d7a672d..9c30503403 100644 --- a/files/fr/web/api/range/extractcontents/index.md +++ b/files/fr/web/api/range/extractcontents/index.md @@ -3,55 +3,38 @@ title: Range.extractContents() slug: Web/API/Range/extractContents translation_of: Web/API/Range/extractContents --- -<p>{{ApiRef("DOM")}}</p> +{{ApiRef("DOM")}} -<p>La méthode <strong><code>Range.extractContents()</code></strong> déplace le contenu du {{ domxref("Range") }} depuis l’arbre du document dans un {{ domxref("DocumentFragment") }}.</p> +La méthode **`Range.extractContents()`** déplace le contenu du {{ domxref("Range") }} depuis l’arbre du document dans un {{ domxref("DocumentFragment") }}. -<p>Les gestionnaires d’évènements ajoutés en utilisant les méthodes du DOM ne sont pas conservés lors de l’extraction. les attributs HTML d’évènements sont conservés ou dupliqués comme ils le seraient avec la méthode {{domxref("Node.cloneNode()")}}. Les attributs HTML id sont également clonés, ce qui peut mener à un document invalide si un nœud partiellement sélectionné est extrait et ajouté au document.</p> +Les gestionnaires d’évènements ajoutés en utilisant les méthodes du DOM ne sont pas conservés lors de l’extraction. les attributs HTML d’évènements sont conservés ou dupliqués comme ils le seraient avec la méthode {{domxref("Node.cloneNode()")}}. Les attributs HTML id sont également clonés, ce qui peut mener à un document invalide si un nœud partiellement sélectionné est extrait et ajouté au document. -<p>Les nœuds partiellement sélectionnés sont clonés pour inclure les balises parentes nécessaires pour rendre le fragment de document valide.</p> +Les nœuds partiellement sélectionnés sont clonés pour inclure les balises parentes nécessaires pour rendre le fragment de document valide. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><em>documentFragment</em> = <em>range</em>.extractContents(); -</pre> + documentFragment = range.extractContents(); -<h2 id="Exemples">Exemples</h2> +## Exemples -<pre class="brush: js">var range = document.createRange(); +```js +var range = document.createRange(); range.selectNode(document.getElementsByTagName("div").item(0)); var documentFragment = range.extractContents(); document.body.appendChild(documentFragment); -</pre> - -<h2 id="Spécifications">Spécifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-range-extractcontents', 'Range.extractContents()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>Pas de changement.</td> - </tr> - <tr> - <td>{{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-extractContents', 'Range.extractContents()')}}</td> - <td>{{Spec2('DOM2 Traversal_Range')}}</td> - <td>Spécification initiale.</td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Range.extractContents")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li><a href="/fr/docs/Web/API/Document_Object_Model">L’index des interfaces DOM</a></li> -</ul> +``` + +## Spécifications + +| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------- | ----------------------- | +| {{SpecName('DOM WHATWG', '#dom-range-extractcontents', 'Range.extractContents()')}} | {{Spec2('DOM WHATWG')}} | Pas de changement. | +| {{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-extractContents', 'Range.extractContents()')}} | {{Spec2('DOM2 Traversal_Range')}} | Spécification initiale. | + +## Compatibilité des navigateurs + +{{Compat("api.Range.extractContents")}} + +## Voir aussi + +- [L’index des interfaces DOM](/fr/docs/Web/API/Document_Object_Model) diff --git a/files/fr/web/api/range/index.md b/files/fr/web/api/range/index.md index a17b45d829..ab3abd3ad5 100644 --- a/files/fr/web/api/range/index.md +++ b/files/fr/web/api/range/index.md @@ -3,101 +3,91 @@ title: range slug: Web/API/Range translation_of: Web/API/Range --- -<p>{{ ApiRef() }}</p> - -<h3 id="Introduction">Introduction</h3> - -<p>L'objet <code>Range</code> (littéralement : "étendue" ou "portée", ici : "segment") représente un fragment de document qui peut contenir des nœuds et des parties de nœuds texte dans un document donné.</p> - -<p>Un segment peut être crée en utilisant la méthode <a href="/fr/docs/Web/API/document/createRange">createRange</a> de l'objet <a href="/fr/docs/Web/API/document">document</a>. Les objets range peuvent également être récupérés en utilisant la méthode <a href="/fr/docs/Web/API/Selection/getRangeAt">getRangeAt</a> de l'objet <a href="/fr/docs/Web/API/Selection">selection</a>.</p> - -<h3 id="Propri.C3.A9t.C3.A9s">Propriétés</h3> - -<dl> - <dt><a href="/fr/docs/Web/API/range/collapsed">collapsed</a></dt> - <dd>Renvoie un booléen indiquant si le point de départ et le point final du segment sont confondus.</dd> - <dt><a href="/fr/docs/Web/API/range/commonAncestorContainer">commonAncestorContainer</a></dt> - <dd>Renvoie le nœud le plus profond qui contient à la fois les nœuds <code>startContainer</code> et <code>endContainer</code>.</dd> - <dt><a href="/fr/docs/Web/API/range/endContainer">endContainer</a></dt> - <dd>Renvoie le nœud dans lequel le segment se termine.</dd> - <dt><a href="/fr/docs/Web/API/range/endOffset">endOffset</a></dt> - <dd>Renvoie un nombre représentant l'endroit où le segment se termine dans <code>endContainer</code>.</dd> - <dt><a href="/fr/docs/Web/API/range/startContainer">startContainer</a></dt> - <dd>Renvoie le nœud dans lequel le segment débute.</dd> - <dt><a href="/fr/docs/Web/API/range/startOffset">startOffset</a></dt> - <dd>Renvoie un nombre représentant l'endroit où le segment débute dans <code>startContainer</code>.</dd> -</dl> - -<h3 id="M.C3.A9thodes">Méthodes</h3> - -<h4 id="M.C3.A9thodes_de_positionnement">Méthodes de positionnement</h4> - -<p>Ces méthodes permettent de définir le début et la fin d'un segment.</p> - -<dl> - <dt><a href="/fr/docs/Web/API/range/setStart">setStart</a></dt> - <dd>Définit le point de départ d'un segment.</dd> - <dt><a href="/fr/docs/Web/API/range/setEnd">setEnd</a></dt> - <dd>Définit le point final d'un segment.</dd> - <dt><a href="/fr/docs/Web/API/range/setStartBefore">setStartBefore</a></dt> - <dd>Définit le point de départ d'un segment relativement à un autre nœud.</dd> - <dt><a href="/fr/docs/Web/API/range/setStartAfter">setStartAfter</a></dt> - <dd>Définit le point de départ d'un segment relativement à un autre nœud.</dd> - <dt><a href="/fr/docs/Web/API/range/setEndBefore">setEndBefore</a></dt> - <dd>Définit le point final d'un segment relativement à un autre nœud.</dd> - <dt><a href="/fr/docs/Web/API/range/setEndAfter">setEndAfter</a></dt> - <dd>Définit le point final d'un segment relativement à un autre nœud.</dd> - <dt><a href="/fr/docs/Web/API/range/selectNode">selectNode</a></dt> - <dd>Le contenu du segment devient le nœud et son contenu.</dd> - <dt><a href="/fr/docs/Web/API/range/selectNodeContents">selectNodeContents</a></dt> - <dd>le contenu du segment devient le contenu du nœud.</dd> - <dt><a href="/fr/docs/Web/API/range/collapse">collapse</a></dt> - <dd>Replie le segment sur l'un de ses points frontières.</dd> -</dl> - -<h4 id="M.C3.A9thodes_de_modification">Méthodes de modification</h4> - -<p>Ces méthodes recupèrent les nœuds d'un segment et modifient le contenu d'un segment.</p> - -<dl> - <dt><a href="/fr/docs/Web/API/range/cloneContents">cloneContents</a></dt> - <dd>Renvoie un fragment de document où sont copiés les nœuds d'un segment.</dd> - <dt><a href="/fr/docs/Web/API/range/deleteContents">deleteContents</a></dt> - <dd>Supprime du document le contenu d'un segment.</dd> - <dt><a href="/fr/docs/Web/API/range/extractContents">extractContents</a></dt> - <dd>Déplace le contenu d'un segment, de l'arbre du document vers un fragment de document.</dd> - <dt><a href="/fr/docs/Web/API/range/insertNode">insertNode</a></dt> - <dd>Insère un nœud au début d'un segment.</dd> - <dt><a href="/fr/docs/Web/API/range/surroundContents">surroundContents</a></dt> - <dd>Déplace le contenu d'un segment dans un nouveau nœud.</dd> -</dl> - -<h4 id="Autres_m.C3.A9thodes">Autres méthodes</h4> - -<dl> - <dt><a href="/fr/docs/Web/API/range/compareBoundaryPoints">compareBoundaryPoints</a></dt> - <dd>Compare les points frontières de deux segments.</dd> - <dt><a href="/fr/docs/Web/API/range/cloneRange">cloneRange</a></dt> - <dd>Renvoie un objet <code>Range</code> avec des points frontières identiques à ceux du segment cloné.</dd> - <dt><a href="/fr/docs/Web/API/range/detach">detach</a></dt> - <dd>Supprime le segment afin d'améliorer la performance.</dd> - <dt><a href="/fr/docs/Web/API/range/toString">toString</a></dt> - <dd>Renvoie le texte du segment.</dd> -</dl> - -<h4 id="Les_m.C3.A9thodes_Gecko">Les méthodes Gecko</h4> - -<p>Cette section décrit les méthodes de range qui sont particulières à Mozilla et ne font pas partie des spécifications DOM W3C.</p> - -<dl> - <dt><a href="/fr/docs/Web/API/range/compareNode">compareNode</a> {{ Obsolete_inline() }}</dt> - <dd>Renvoie une constante qui indique si le nœud est avant, après, dans ou englobe le segment.</dd> - <dt><a href="/fr/docs/Web/API/range/comparePoint">comparePoint</a></dt> - <dd>Renvoie -1, 0, ou 1, indiquant si le point se trouve avant, après, ou dans le segment.</dd> - <dt><a href="/fr/docs/Web/API/range/createContextualFragment">createContextualFragment</a></dt> - <dd>Renvoie un fragment de document créé à partir d'un morceau de code donné.</dd> - <dt><a href="/fr/docs/Web/API/range/intersectsNode">intersectsNode</a> {{ Obsolete_inline() }}</dt> - <dd>Renvoie un booléen indiquant si un nœud donné a une intersection avec le segment.</dd> - <dt><a href="/fr/docs/Web/API/range/isPointInRange">isPointInRange</a></dt> - <dd>Renvoie un booléen indiquant si le point donné est dans le segment.</dd> -</dl>
\ No newline at end of file +{{ ApiRef() }} + +### Introduction + +L'objet `Range` (littéralement : "étendue" ou "portée", ici : "segment") représente un fragment de document qui peut contenir des nœuds et des parties de nœuds texte dans un document donné. + +Un segment peut être crée en utilisant la méthode [createRange](/fr/docs/Web/API/document/createRange) de l'objet [document](/fr/docs/Web/API/document). Les objets range peuvent également être récupérés en utilisant la méthode [getRangeAt](/fr/docs/Web/API/Selection/getRangeAt) de l'objet [selection](/fr/docs/Web/API/Selection). + +### Propriétés + +- [collapsed](/fr/docs/Web/API/range/collapsed) + - : Renvoie un booléen indiquant si le point de départ et le point final du segment sont confondus. +- [commonAncestorContainer](/fr/docs/Web/API/range/commonAncestorContainer) + - : Renvoie le nœud le plus profond qui contient à la fois les nœuds `startContainer` et `endContainer`. +- [endContainer](/fr/docs/Web/API/range/endContainer) + - : Renvoie le nœud dans lequel le segment se termine. +- [endOffset](/fr/docs/Web/API/range/endOffset) + - : Renvoie un nombre représentant l'endroit où le segment se termine dans `endContainer`. +- [startContainer](/fr/docs/Web/API/range/startContainer) + - : Renvoie le nœud dans lequel le segment débute. +- [startOffset](/fr/docs/Web/API/range/startOffset) + - : Renvoie un nombre représentant l'endroit où le segment débute dans `startContainer`. + +### Méthodes + +#### Méthodes de positionnement + +Ces méthodes permettent de définir le début et la fin d'un segment. + +- [setStart](/fr/docs/Web/API/range/setStart) + - : Définit le point de départ d'un segment. +- [setEnd](/fr/docs/Web/API/range/setEnd) + - : Définit le point final d'un segment. +- [setStartBefore](/fr/docs/Web/API/range/setStartBefore) + - : Définit le point de départ d'un segment relativement à un autre nœud. +- [setStartAfter](/fr/docs/Web/API/range/setStartAfter) + - : Définit le point de départ d'un segment relativement à un autre nœud. +- [setEndBefore](/fr/docs/Web/API/range/setEndBefore) + - : Définit le point final d'un segment relativement à un autre nœud. +- [setEndAfter](/fr/docs/Web/API/range/setEndAfter) + - : Définit le point final d'un segment relativement à un autre nœud. +- [selectNode](/fr/docs/Web/API/range/selectNode) + - : Le contenu du segment devient le nœud et son contenu. +- [selectNodeContents](/fr/docs/Web/API/range/selectNodeContents) + - : le contenu du segment devient le contenu du nœud. +- [collapse](/fr/docs/Web/API/range/collapse) + - : Replie le segment sur l'un de ses points frontières. + +#### Méthodes de modification + +Ces méthodes recupèrent les nœuds d'un segment et modifient le contenu d'un segment. + +- [cloneContents](/fr/docs/Web/API/range/cloneContents) + - : Renvoie un fragment de document où sont copiés les nœuds d'un segment. +- [deleteContents](/fr/docs/Web/API/range/deleteContents) + - : Supprime du document le contenu d'un segment. +- [extractContents](/fr/docs/Web/API/range/extractContents) + - : Déplace le contenu d'un segment, de l'arbre du document vers un fragment de document. +- [insertNode](/fr/docs/Web/API/range/insertNode) + - : Insère un nœud au début d'un segment. +- [surroundContents](/fr/docs/Web/API/range/surroundContents) + - : Déplace le contenu d'un segment dans un nouveau nœud. + +#### Autres méthodes + +- [compareBoundaryPoints](/fr/docs/Web/API/range/compareBoundaryPoints) + - : Compare les points frontières de deux segments. +- [cloneRange](/fr/docs/Web/API/range/cloneRange) + - : Renvoie un objet `Range` avec des points frontières identiques à ceux du segment cloné. +- [detach](/fr/docs/Web/API/range/detach) + - : Supprime le segment afin d'améliorer la performance. +- [toString](/fr/docs/Web/API/range/toString) + - : Renvoie le texte du segment. + +#### Les méthodes Gecko + +Cette section décrit les méthodes de range qui sont particulières à Mozilla et ne font pas partie des spécifications DOM W3C. + +- [compareNode](/fr/docs/Web/API/range/compareNode) {{ Obsolete_inline() }} + - : Renvoie une constante qui indique si le nœud est avant, après, dans ou englobe le segment. +- [comparePoint](/fr/docs/Web/API/range/comparePoint) + - : Renvoie -1, 0, ou 1, indiquant si le point se trouve avant, après, ou dans le segment. +- [createContextualFragment](/fr/docs/Web/API/range/createContextualFragment) + - : Renvoie un fragment de document créé à partir d'un morceau de code donné. +- [intersectsNode](/fr/docs/Web/API/range/intersectsNode) {{ Obsolete_inline() }} + - : Renvoie un booléen indiquant si un nœud donné a une intersection avec le segment. +- [isPointInRange](/fr/docs/Web/API/range/isPointInRange) + - : Renvoie un booléen indiquant si le point donné est dans le segment. diff --git a/files/fr/web/api/range/insertnode/index.md b/files/fr/web/api/range/insertnode/index.md index bfbe3dc9df..0f3e45f448 100644 --- a/files/fr/web/api/range/insertnode/index.md +++ b/files/fr/web/api/range/insertnode/index.md @@ -3,63 +3,44 @@ title: Range.insertNode() slug: Web/API/Range/insertNode translation_of: Web/API/Range/insertNode --- -<div>{{ApiRef("DOM")}}</div> +{{ApiRef("DOM")}} -<p>La méthode <code><strong>Range.insertNode()</strong></code> insère un nœud au début du {{domxref("Range")}}.</p> +La méthode **`Range.insertNode()`** insère un nœud au début du {{domxref("Range")}}. -<p>Le nouveau nœud est inséré au point de départ du <code>Range</code>. Si le nouveau nœud est sur le point d’être ajouté à un {{domxref("Node")}} texte, ce <code>Node</code> est coupé en deux au point d’insertion, et l’insertion se fait entre les deux nœuds texte.</p> +Le nouveau nœud est inséré au point de départ du `Range`. Si le nouveau nœud est sur le point d’être ajouté à un {{domxref("Node")}} texte, ce `Node` est coupé en deux au point d’insertion, et l’insertion se fait entre les deux nœuds texte. -<p>Si le nouveau nœud est un fragment de document, les enfants du fragment sont insérés à la place.</p> +Si le nouveau nœud est un fragment de document, les enfants du fragment sont insérés à la place. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><em>range</em>.insertNode(<em>newNode</em>); -</pre> + range.insertNode(newNode); -<h3 id="Paramètres">Paramètres</h3> +### Paramètres -<dl> - <dt><em>newNode</em></dt> - <dd>Le {{domxref("Node")}} à insérer au début du <code>range</code>.</dd> -</dl> +- _newNode_ + - : Le {{domxref("Node")}} à insérer au début du `range`. -<h2 id="Exemple">Exemple</h2> +## Exemple -<pre class="brush: js">range = document.createRange(); +```js +range = document.createRange(); newNode = document.createElement("p"); newNode.appendChild(document.createTextNode("New Node Inserted Here")); range.selectNode(document.getElementsByTagName("div").item(0)); range.insertNode(newNode); -</pre> +``` -<h2 id="Spécifications">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-range-insertnode', 'Range.insertNode()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>Pas de changement</td> - </tr> - <tr> - <td>{{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-insertNode', 'Range.insertNode()')}}</td> - <td>{{Spec2('DOM2 Traversal_Range')}}</td> - <td>Définition initiale</td> - </tr> - </tbody> -</table> +| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------- | ------------------- | +| {{SpecName('DOM WHATWG', '#dom-range-insertnode', 'Range.insertNode()')}} | {{Spec2('DOM WHATWG')}} | Pas de changement | +| {{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-insertNode', 'Range.insertNode()')}} | {{Spec2('DOM2 Traversal_Range')}} | Définition initiale | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Range.insertNode")}}</p> +{{Compat("api.Range.insertNode")}} -<h2 id="Voir_aussi">Voir aussi</h2> +## Voir aussi -<ul> - <li><a href="/en-US/docs/Web/API/Document_Object_Model">L’index des interfaces DOM</a></li> -</ul> +- [L’index des interfaces DOM](/en-US/docs/Web/API/Document_Object_Model) diff --git a/files/fr/web/api/range/selectnode/index.md b/files/fr/web/api/range/selectnode/index.md index 25e418cc4d..eca4135b5a 100644 --- a/files/fr/web/api/range/selectnode/index.md +++ b/files/fr/web/api/range/selectnode/index.md @@ -8,57 +8,39 @@ tags: - Range translation_of: Web/API/Range/selectNode --- -<p>{{ApiRef("DOM")}}</p> +{{ApiRef("DOM")}} -<p>La méthode <code>Range.selectNode()</code> définit le {{domxref ("Range")}} destiné à contenir le {{domxref("Node")}} et son contenu. Le {{domxref ("Node")}} parent du début et de la fin du {{domxref("Range")}} sera le même que le parent du <em>noeudDeReference</em>.</p> +La méthode `Range.selectNode()` définit le {{domxref ("Range")}} destiné à contenir le {{domxref("Node")}} et son contenu. Le {{domxref ("Node")}} parent du début et de la fin du {{domxref("Range")}} sera le même que le parent du _noeudDeReference_. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><em>range</em>.selectNode(<em>noeudDeReference</em>); -</pre> + range.selectNode(noeudDeReference); -<h3 id="Parameters">Paramètres</h3> +### Paramètres -<dl> - <dt><em>noeudDeReference</em></dt> - <dd>Le {{domxref("Node")}} à choisir à l'intérieur d'un <code>{domxref("Range")}}</code>.</dd> -</dl> +- _noeudDeReference_ + - : Le {{domxref("Node")}} à choisir à l'intérieur d'un `{domxref("Range")}}`. -<h2 id="Example">Exemple</h2> +## Exemple -<pre class="brush:js">var range = document.createRange(); +```js +var range = document.createRange(); var noeudDeReference = document.getElementsByTagName("div").item(0); -range.selectNode(noeudDeReference);</pre> +range.selectNode(noeudDeReference); +``` -<h2 id="Specification">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-range-selectnode', 'Range.selectNode()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>Aucun changement.</td> - </tr> - <tr> - <td>{{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-selectNode', 'Range.selectNode()')}}</td> - <td>{{Spec2('DOM2 Traversal_Range')}}</td> - <td>Spécification initiale.</td> - </tr> - </tbody> -</table> +| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------------------------------------------- | -------------------------------------------- | ----------------------- | +| {{SpecName('DOM WHATWG', '#dom-range-selectnode', 'Range.selectNode()')}} | {{Spec2('DOM WHATWG')}} | Aucun changement. | +| {{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-selectNode', 'Range.selectNode()')}} | {{Spec2('DOM2 Traversal_Range')}} | Spécification initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.Range.selectNode")}}</p> +{{Compat("api.Range.selectNode")}} -<h2 id="Voir_aussi">Voir aussi</h2> +## Voir aussi -<ul> - <li><a href="/fr/docs/Web/API/Document_Object_Model">Référence du DOM</a></li> -</ul> +- [Référence du DOM](/fr/docs/Web/API/Document_Object_Model) diff --git a/files/fr/web/api/range/setstart/index.md b/files/fr/web/api/range/setstart/index.md index 019a481c37..a6dcadd6d3 100644 --- a/files/fr/web/api/range/setstart/index.md +++ b/files/fr/web/api/range/setstart/index.md @@ -8,64 +8,45 @@ tags: - Range translation_of: Web/API/Range/setStart --- -<p>{{ApiRef("DOM")}}</p> +{{ApiRef("DOM")}} -<p>La methode <strong><code>Range.setStart() </code></strong>définit la position de départ d'un {{ domxref("Range") }}.</p> +La methode **`Range.setStart() `**définit la position de départ d'un {{ domxref("Range") }}. -<p>Si le <code>startNode</code> est un {{ domxref("Node") }} de type <code>Text</code>, <code>Comment</code>, ou <code>CDATASection</code>, alors startOffset est le nombre de caractères depuis le départ du <code>startNode</code>. Pour les autres types de <code>Nœud</code>, <code>startOffset</code> est le nombre de noeuds enfants entre le debut du <code>startNode</code>.</p> +Si le `startNode` est un {{ domxref("Node") }} de type `Text`, `Comment`, ou `CDATASection`, alors startOffset est le nombre de caractères depuis le départ du `startNode`. Pour les autres types de `Nœud`, `startOffset` est le nombre de noeuds enfants entre le debut du `startNode`. -<p>Si vous définissez le point de départ en dessous (plus bas dans le document), le point final entraînera une plage réduite avec les points de départ et de fin réglés tous les deux sur la position de départ spécifiée.</p> +Si vous définissez le point de départ en dessous (plus bas dans le document), le point final entraînera une plage réduite avec les points de départ et de fin réglés tous les deux sur la position de départ spécifiée. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><em>range</em>.setStart(<em>startNode</em>, <em>startOffset</em>); -</pre> + range.setStart(startNode, startOffset); -<h3 id="Parameters">Paramètres</h3> +### Paramètres -<dl> - <dt><em>startNode</em></dt> - <dd>{{ domxref("Node") }} ou {{ domxref("Range") }} devrait démarrer.</dd> - <dt><em>startOffset</em></dt> - <dd>Un entier supérieur ou égal à zéro représentant le décalage pour le début du {{domxref ("Range")}} à partir du début de startNode.</dd> -</dl> +- _startNode_ + - : {{ domxref("Node") }} ou {{ domxref("Range") }} devrait démarrer. +- _startOffset_ + - : Un entier supérieur ou égal à zéro représentant le décalage pour le début du {{domxref ("Range")}} à partir du début de startNode. -<h2 id="Example">Example</h2> +## Example -<pre class="brush: js">var range = document.createRange(); +```js +var range = document.createRange(); var startNode = document.getElementsByTagName("p").item(2); var startOffset = 0; range.setStart(startNode,startOffset); -</pre> +``` -<h2 id="Specification">Spécifications</h2> +## Spécifications -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Specification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-range-setstart', 'Range.setStart()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-setStart', 'Range.setStart()')}}</td> - <td>{{Spec2('DOM2 Traversal_Range')}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> +| Specification | Statut | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------- | -------------------- | +| {{SpecName('DOM WHATWG', '#dom-range-setstart', 'Range.setStart()')}} | {{Spec2('DOM WHATWG')}} | | +| {{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-setStart', 'Range.setStart()')}} | {{Spec2('DOM2 Traversal_Range')}} | Définition initiale. | -<h2 id="Browser_compatibility">Compatibilité navigateurs</h2> +## Compatibilité navigateurs -<p>{{Compat("api.Range.setStart")}}</p> +{{Compat("api.Range.setStart")}} -<h2 id="See_also">Voir aussi</h2> +## Voir aussi -<ul> - <li><a href="/fr/docs/DOM/DOM_Reference">L'index des interfaces DOM</a></li> -</ul> +- [L'index des interfaces DOM](/fr/docs/DOM/DOM_Reference) diff --git a/files/fr/web/api/range/surroundcontents/index.md b/files/fr/web/api/range/surroundcontents/index.md index 4b8b6fa87e..e157cd42f2 100644 --- a/files/fr/web/api/range/surroundcontents/index.md +++ b/files/fr/web/api/range/surroundcontents/index.md @@ -3,68 +3,51 @@ title: Range.surroundContents() slug: Web/API/Range/surroundContents translation_of: Web/API/Range/surroundContents --- -<div>{{ApiRef("DOM")}}</div> +{{ApiRef("DOM")}} -<p>La méthode <strong><code>Range.surroundContents()</code></strong> déplace le contenu du {{ domxref("Range") }} dans un nouveau nœud, plaçant le nouveau nœud au début du <code>range</code> spécifié.</p> +La méthode **`Range.surroundContents()`** déplace le contenu du {{ domxref("Range") }} dans un nouveau nœud, plaçant le nouveau nœud au début du `range` spécifié. -<p>Cette méthode est à peu près équivalente à :</p> +Cette méthode est à peu près équivalente à : -<pre class="brush: js">newNode.appendChild(range.extractContents()); -range.insertNode(newNode)</pre> +```js +newNode.appendChild(range.extractContents()); +range.insertNode(newNode) +``` -<p>Après déplacement, les bornes du <code>range</code> incluent <code>newNode</code>.</p> +Après déplacement, les bornes du `range` incluent `newNode`. -<p>Cependant, une exception sera levée si le {{ domxref("Range") }} découpe un nœud non-{{ domxref("Text") }} sur une seule de ses bornes. C’est-à-dire que, contrairement à l’alternative ci-dessus, s’il y a des nœuds partiellement sélectionnés, ils ne seront pas clonés ; à la place, l’opération échouera.</p> +Cependant, une exception sera levée si le {{ domxref("Range") }} découpe un nœud non-{{ domxref("Text") }} sur une seule de ses bornes. C’est-à-dire que, contrairement à l’alternative ci-dessus, s’il y a des nœuds partiellement sélectionnés, ils ne seront pas clonés ; à la place, l’opération échouera. -<h2 id="Syntax">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox"><em>range</em>.surroundContents(<em>newNode</em>); -</pre> + range.surroundContents(newNode); -<h3 id="Paramètres">Paramètres</h3> +### Paramètres -<dl> - <dt><em>newNode</em></dt> - <dd>Un {{ domxref("Node") }} à insérer à l’emplacement du <code>range</code>.</dd> -</dl> +- _newNode_ + - : Un {{ domxref("Node") }} à insérer à l’emplacement du `range`. -<h2 id="Example">Exemple</h2> +## Exemple -<pre class="brush:js">var range = document.createRange(); +```js +var range = document.createRange(); var newNode = document.createElement("p"); range.selectNode(document.getElementsByTagName("div").item(0)); range.surroundContents(newNode); -</pre> - -<h2 id="Specification">Spécifications</h2> - -<table class="standard-table"> - <tbody> - <tr> - <th scope="col">Spécification</th> - <th scope="col">Statut</th> - <th scope="col">Commentaire</th> - </tr> - <tr> - <td>{{SpecName('DOM WHATWG', '#dom-range-surroundcontents', 'Range.surroundContents()')}}</td> - <td>{{Spec2('DOM WHATWG')}}</td> - <td>Pas de changement.</td> - </tr> - <tr> - <td>{{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-surroundContents', 'Range.surroundContents()')}}</td> - <td>{{Spec2('DOM2 Traversal_Range')}}</td> - <td>Spécification initiale.</td> - </tr> - </tbody> -</table> - -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> - -<p>{{Compat("api.Range.surroundContents")}}</p> - -<h2 id="Voir_aussi">Voir aussi</h2> - -<ul> - <li><a href="/fr/docs/DOM/DOM_Reference">L’index des interfaces DOM</a></li> -</ul> +``` + +## Spécifications + +| Spécification | Statut | Commentaire | +| ------------------------------------------------------------------------------------------------------------------------------------------------------------ | -------------------------------------------- | ----------------------- | +| {{SpecName('DOM WHATWG', '#dom-range-surroundcontents', 'Range.surroundContents()')}} | {{Spec2('DOM WHATWG')}} | Pas de changement. | +| {{SpecName('DOM2 Traversal_Range', 'ranges.html#Level2-Range-method-surroundContents', 'Range.surroundContents()')}} | {{Spec2('DOM2 Traversal_Range')}} | Spécification initiale. | + +## Compatibilité des navigateurs + +{{Compat("api.Range.surroundContents")}} + +## Voir aussi + +- [L’index des interfaces DOM](/fr/docs/DOM/DOM_Reference) |