diff options
author | julieng <julien.gattelier@gmail.com> | 2021-10-02 17:20:24 +0200 |
---|---|---|
committer | SphinxKnight <SphinxKnight@users.noreply.github.com> | 2021-10-02 17:30:20 +0200 |
commit | 1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde (patch) | |
tree | 30a56efd3eff3a01bd1611e1840fdbbfacf544a4 /files/fr/web/api/htmltablerowelement | |
parent | c05efa8d7ae464235cf83d7c0956e42dc6974103 (diff) | |
download | translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.gz translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.bz2 translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.zip |
convert content to md
Diffstat (limited to 'files/fr/web/api/htmltablerowelement')
-rw-r--r-- | files/fr/web/api/htmltablerowelement/index.md | 106 | ||||
-rw-r--r-- | files/fr/web/api/htmltablerowelement/insertcell/index.md | 106 |
2 files changed, 81 insertions, 131 deletions
diff --git a/files/fr/web/api/htmltablerowelement/index.md b/files/fr/web/api/htmltablerowelement/index.md index a382d43e45..5e810405a9 100644 --- a/files/fr/web/api/htmltablerowelement/index.md +++ b/files/fr/web/api/htmltablerowelement/index.md @@ -9,85 +9,55 @@ tags: - TopicStub translation_of: Web/API/HTMLTableRowElement --- -<div>{{ APIRef("HTML DOM") }}</div> +{{ APIRef("HTML DOM") }} -<p>L'interface <strong><code>HTMLTableRowElement</code></strong> fournit des propriétés et des méthodes spéciales (au-delà de l'interface {{domxref("HTMLElement")}} dont elle dispose également par héritage) pour manipuler la mise en page et la présentation des lignes dans un tableau HTML.</p> +L'interface **`HTMLTableRowElement`** fournit des propriétés et des méthodes spéciales (au-delà de l'interface {{domxref("HTMLElement")}} dont elle dispose également par héritage) pour manipuler la mise en page et la présentation des lignes dans un tableau HTML. -<p>{{InheritanceDiagram(600, 120)}}</p> +{{InheritanceDiagram(600, 120)}} -<h2 id="Properties">Propriétés</h2> +## Propriétés -<p><em>Hérite des propriétés de son parent, {{domxref("HTMLElement")}}.</em></p> +_Hérite des propriétés de son parent, {{domxref("HTMLElement")}}._ -<dl> - <dt>{{domxref("HTMLTableRowElement.align")}} {{obsolete_inline}}</dt> - <dd>Est un {{domxref("DOMString")}} contenant une valeur énumérée reflétant l'attribut {{htmlattrxref("align", "tr")}}. Il indique l'alignement du contenu de l'élément par rapport au contexte environnant. Les valeurs possibles sont <code>"left"</code>, <code>"right"</code>, et <code>"center"</code>.</dd> - <dt>{{domxref("HTMLTableRowElement.bgColor")}} {{obsolete_inline}}</dt> - <dd>Est un {{domxref("DOMString")}} contenant la couleur de fond des cellules. Il reflète l'attribut obsolète {{htmlattrxref("bgColor", "tr")}} attribute.</dd> - <dt>{{domxref("HTMLTableRowElement.cells")}} {{readonlyInline}}</dt> - <dd>Renvoie une {{domxref("HTMLCollection")}} en direct contenant les cellules de la ligne. La <code>HTMLCollection</code> est active et est automatiquement mise à jour lorsque des cellules sont ajoutées ou supprimées.</dd> - <dt>{{domxref("HTMLTableRowElement.ch")}} {{obsolete_inline}}</dt> - <dd>Est un {{domxref("DOMString")}} contenant un seul caractère. Ce caractère est celui sur lequel aligner toutes les cellules d'une colonne. Il reflète {{htmlattrxref("char", "tr")}} et par défaut les points décimaux associés à la langue, par exemple <code>'.'</code> pour l'anglais, ou <code>','</code> pour le français. Cette propriété était facultative et n'était pas très bien prise en charge.</dd> - <dt>{{domxref("HTMLTableRowElement.chOff")}} {{obsolete_inline}}</dt> - <dd>Est un {{domxref("DOMString")}} contenant un entier indiquant combien de caractère doivent être laissés à droite (pour les scripts de gauche à droite; ou à gauche pour les scripts de droite à gauche) du caractère défini par <code>HTMLTableRowElement.ch</code>. Cette propriété était facultative et n'était pas très bien prise en charge.</dd> - <dt>{{domxref("HTMLTableRowElement.rowIndex")}} {{readonlyInline}}</dt> - <dd>Renvoie une valeur <code>long</code> qui donne la position logique de la ligne dans la table entière. Si la ligne ne fait pas partie d'une table, renvoie <code>-1</code>.</dd> - <dt>{{domxref("HTMLTableRowElement.sectionRowIndex")}} {{readonlyInline}}</dt> - <dd>Renvoie une valeur <code>long</code> qui donne la position logique de la ligne dans la section de table à laquelle elle appartient. Si la ligne ne fait pas partie d'une section, renvoie <code>-1</code>.</dd> - <dt>{{domxref("HTMLTableRowElement.vAlign")}} {{obsolete_inline}}</dt> - <dd>Est un {{domxref("DOMString")}} représentant une valeur énumérée indiquant comment le contenu de la cellule doit être aligné verticalement. Il reflète l'attribut {{htmlattrxref("valign", "tr")}} et peut avoir l'une des valeurs suivantes : <code>"top"</code>, <code>"middle"</code>, <code>"bottom"</code>, ou <code>"baseline"</code>.</dd> -</dl> +- {{domxref("HTMLTableRowElement.align")}} {{obsolete_inline}} + - : Est un {{domxref("DOMString")}} contenant une valeur énumérée reflétant l'attribut {{htmlattrxref("align", "tr")}}. Il indique l'alignement du contenu de l'élément par rapport au contexte environnant. Les valeurs possibles sont `"left"`, `"right"`, et `"center"`. +- {{domxref("HTMLTableRowElement.bgColor")}} {{obsolete_inline}} + - : Est un {{domxref("DOMString")}} contenant la couleur de fond des cellules. Il reflète l'attribut obsolète {{htmlattrxref("bgColor", "tr")}} attribute. +- {{domxref("HTMLTableRowElement.cells")}} {{readonlyInline}} + - : Renvoie une {{domxref("HTMLCollection")}} en direct contenant les cellules de la ligne. La `HTMLCollection` est active et est automatiquement mise à jour lorsque des cellules sont ajoutées ou supprimées. +- {{domxref("HTMLTableRowElement.ch")}} {{obsolete_inline}} + - : Est un {{domxref("DOMString")}} contenant un seul caractère. Ce caractère est celui sur lequel aligner toutes les cellules d'une colonne. Il reflète {{htmlattrxref("char", "tr")}} et par défaut les points décimaux associés à la langue, par exemple `'.'` pour l'anglais, ou `','` pour le français. Cette propriété était facultative et n'était pas très bien prise en charge. +- {{domxref("HTMLTableRowElement.chOff")}} {{obsolete_inline}} + - : Est un {{domxref("DOMString")}} contenant un entier indiquant combien de caractère doivent être laissés à droite (pour les scripts de gauche à droite; ou à gauche pour les scripts de droite à gauche) du caractère défini par `HTMLTableRowElement.ch`. Cette propriété était facultative et n'était pas très bien prise en charge. +- {{domxref("HTMLTableRowElement.rowIndex")}} {{readonlyInline}} + - : Renvoie une valeur `long` qui donne la position logique de la ligne dans la table entière. Si la ligne ne fait pas partie d'une table, renvoie `-1`. +- {{domxref("HTMLTableRowElement.sectionRowIndex")}} {{readonlyInline}} + - : Renvoie une valeur `long` qui donne la position logique de la ligne dans la section de table à laquelle elle appartient. Si la ligne ne fait pas partie d'une section, renvoie `-1`. +- {{domxref("HTMLTableRowElement.vAlign")}} {{obsolete_inline}} + - : Est un {{domxref("DOMString")}} représentant une valeur énumérée indiquant comment le contenu de la cellule doit être aligné verticalement. Il reflète l'attribut {{htmlattrxref("valign", "tr")}} et peut avoir l'une des valeurs suivantes : `"top"`, `"middle"`, `"bottom"`, ou `"baseline"`. -<h2 id="Methods">Méthodes</h2> +## Méthodes -<p><em>Hérite des méthodes de son parent, {{domxref("HTMLElement")}}</em>.</p> +_Hérite des méthodes de son parent, {{domxref("HTMLElement")}}_. -<dl> - <dt>{{domxref("HTMLTableRowElement.deleteCell()")}}</dt> - <dd>Supprime la cellule à la position donnée dans la ligne. Si la position donnée est supérieure (ou égale car elle commence à zéro) au nombre de cellules dans la ligne, ou est inférieure à <code>0</code>, elle déclenche une {{domxref("DOMException")}} avec la valeur <code>IndexSizeError</code>.</dd> - <dt>{{domxref("HTMLTableRowElement.insertCell()")}}</dt> - <dd>Insère une nouvelle cellule juste avant la position donnée dans la ligne. Si la position donnée n'est pas donnée ou est <code>-1</code>, elle ajoute la cellule à la ligne. Si la position donnée est supérieure (ou égale car elle commence à zéro) au nombre de cellules dans la ligne, ou est inférieure à <code>-1</code>, elle déclenche une {{domxref("DOMException")}} avec la valeur <code>IndexSizeError</code>. Renvoie une référence à un <a href="/en-US/docs/Web/API/HTMLTableCellElement">HTMLTableCellElement [en-US]</a>.</dd> -</dl> +- {{domxref("HTMLTableRowElement.deleteCell()")}} + - : Supprime la cellule à la position donnée dans la ligne. Si la position donnée est supérieure (ou égale car elle commence à zéro) au nombre de cellules dans la ligne, ou est inférieure à `0`, elle déclenche une {{domxref("DOMException")}} avec la valeur `IndexSizeError`. +- {{domxref("HTMLTableRowElement.insertCell()")}} + - : Insère une nouvelle cellule juste avant la position donnée dans la ligne. Si la position donnée n'est pas donnée ou est `-1`, elle ajoute la cellule à la ligne. Si la position donnée est supérieure (ou égale car elle commence à zéro) au nombre de cellules dans la ligne, ou est inférieure à `-1`, elle déclenche une {{domxref("DOMException")}} avec la valeur `IndexSizeError`. Renvoie une référence à un [HTMLTableCellElement \[en-US\]](/en-US/docs/Web/API/HTMLTableCellElement). -<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">Commantaire</th> - </tr> - <tr> - <td>{{SpecName('HTML WHATWG', "#htmltablerowelement", "HTMLTableRowElement")}}</td> - <td>{{Spec2('HTML WHATWG')}}</td> - <td></td> - </tr> - <tr> - <td>{{SpecName('HTML5 W3C', "tabular-data.html#the-tr-element", "HTMLTableRowElement")}}</td> - <td>{{Spec2('HTML5 W3C')}}</td> - <td>Le paramètre de <code>insertCell</code> est désormais facultatif et vaut par défaut <code>-1</code>.</td> - </tr> - <tr> - <td>{{SpecName('DOM2 HTML', 'html.html#ID-6986576', 'HTMLTableRowElement')}}</td> - <td>{{Spec2('DOM2 HTML')}}</td> - <td>Les propriétés <code>cells</code>, <code>rowIndex</code>, et <code>selectionRowIndex</code> sont désormais en lecture seule.<br> - Les méthodes <code>insertCell</code> et <code>deleteCell</code> peuvent déclencher des exceptions.</td> - </tr> - <tr> - <td>{{SpecName('DOM1', 'level-one-html.html#ID-6986576', 'HTMLTableRowElement')}}</td> - <td>{{Spec2('DOM1')}}</td> - <td>Défintion initiale.</td> - </tr> - </tbody> -</table> +| Spécification | Statut | Commantaire | +| ---------------------------------------------------------------------------------------------------------------- | -------------------------------- | ------------------------------------------------------------------------------------------------------------------------------------------------------------------------ | +| {{SpecName('HTML WHATWG', "#htmltablerowelement", "HTMLTableRowElement")}} | {{Spec2('HTML WHATWG')}} | | +| {{SpecName('HTML5 W3C', "tabular-data.html#the-tr-element", "HTMLTableRowElement")}} | {{Spec2('HTML5 W3C')}} | Le paramètre de `insertCell` est désormais facultatif et vaut par défaut `-1`. | +| {{SpecName('DOM2 HTML', 'html.html#ID-6986576', 'HTMLTableRowElement')}} | {{Spec2('DOM2 HTML')}} | Les propriétés `cells`, `rowIndex`, et `selectionRowIndex` sont désormais en lecture seule. Les méthodes `insertCell` et `deleteCell` peuvent déclencher des exceptions. | +| {{SpecName('DOM1', 'level-one-html.html#ID-6986576', 'HTMLTableRowElement')}} | {{Spec2('DOM1')}} | Défintion initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.HTMLTableRowElement")}}</p> +{{Compat("api.HTMLTableRowElement")}} -<h2 id="Voir_aussi">Voir aussi</h2> +## Voir aussi -<ul> - <li>L'élément HTML implémentant cette interface : {{HTMLElement("tr")}}.</li> -</ul> +- L'élément HTML implémentant cette interface : {{HTMLElement("tr")}}. diff --git a/files/fr/web/api/htmltablerowelement/insertcell/index.md b/files/fr/web/api/htmltablerowelement/insertcell/index.md index 7b4ebb53b1..38ce65bf91 100644 --- a/files/fr/web/api/htmltablerowelement/insertcell/index.md +++ b/files/fr/web/api/htmltablerowelement/insertcell/index.md @@ -3,49 +3,47 @@ title: HTMLTableRowElement.insertCell() slug: Web/API/HTMLTableRowElement/insertCell translation_of: Web/API/HTMLTableRowElement/insertCell --- -<div>{{APIRef("HTML DOM")}}</div> +{{APIRef("HTML DOM")}} -<p>La méthode <strong><code>HTMLTableRowElement.insertCell()</code></strong> insère une nouvelle cellule ({{HtmlElement("td")}}) dans une ligne de tableau ({{HtmlElement("tr")}}) et renvoie une référence sur cette cellule.</p> +La méthode **`HTMLTableRowElement.insertCell()`** insère une nouvelle cellule ({{HtmlElement("td")}}) dans une ligne de tableau ({{HtmlElement("tr")}}) et renvoie une référence sur cette cellule. -<div class="note"> -<p><strong>Note :</strong> <code>insertCell()</code> insère la cellule directement dans la ligne. La cellule n’a pas besoin d’être ajoutée séparément comme cela serait le cas si {{domxref("Document.createElement()")}} avait été utilisé pour créer le nouvel élément <code><td></code>.</p> -</div> +> **Note :** `insertCell()` insère la cellule directement dans la ligne. La cellule n’a pas besoin d’être ajoutée séparément comme cela serait le cas si {{domxref("Document.createElement()")}} avait été utilisé pour créer le nouvel élément `<td>`. -<h2 id="Syntaxe">Syntaxe</h2> +## Syntaxe -<pre class="syntaxbox">var <var>newCell</var> = <var>HTMLTableRowElement</var>.insertCell(<var>index</var>); -</pre> + var newCell = HTMLTableRowElement.insertCell(index); -<p>{{domxref("HTMLTableRowElement")}} est une référence sur un élément HTML {{HtmlElement("tr")}}.</p> +{{domxref("HTMLTableRowElement")}} est une référence sur un élément HTML {{HtmlElement("tr")}}. -<h3 id="Paramètres">Paramètres</h3> +### Paramètres -<dl> - <dt><code>index</code> {{optional_inline}}</dt> - <dd><code>index</code> est l’index de cellule de la nouvelle cellule. Si <code>index</code> est <code>-1</code> ou égal au nombre actuel de cellules, la nouvelle cellule est ajoutée à la fin la ligne. Si <code>index</code> est supérieur au nombre de cellules, une exception <code>IndexSizeError</code> sera levée. Si <code>index</code> est omis, la valeur sera <code>-1</code> par défaut.</dd> -</dl> +- `index` {{optional_inline}} + - : `index` est l’index de cellule de la nouvelle cellule. Si `index` est `-1` ou égal au nombre actuel de cellules, la nouvelle cellule est ajoutée à la fin la ligne. Si `index` est supérieur au nombre de cellules, une exception `IndexSizeError` sera levée. Si `index` est omis, la valeur sera `-1` par défaut. -<h3 id="Valeur_de_retour">Valeur de retour</h3> +### Valeur de retour -<p><code>newCell</code> est une {{domxref("HTMLTableCellElement")}} qui fait référence à la nouvelle cellule.</p> +`newCell` est une {{domxref("HTMLTableCellElement")}} qui fait référence à la nouvelle cellule. -<h2 id="Exemple">Exemple</h2> +## Exemple -<p>Cet exemple utilise {{domxref("HTMLTableElement.insertRow()")}} pour ajouter une nouvelle ligne à une table.</p> +Cet exemple utilise {{domxref("HTMLTableElement.insertRow()")}} pour ajouter une nouvelle ligne à une table. -<p>Nous utilisons ensuite <code>insertCell(0)</code> pour insérer une nouvelle cellule dans la nouvelle ligne (pour être du HTML valide, un <code><tr></code> doit avoir au moins un élément <code><td></code>). Enfin, nous ajoutons du texte à la cellule en utilisant {{domxref("Document.createTextNode()")}} et {{domxref("Node.appendChild()")}}.</p> +Nous utilisons ensuite `insertCell(0)` pour insérer une nouvelle cellule dans la nouvelle ligne (pour être du HTML valide, un `<tr>` doit avoir au moins un élément `<td>`). Enfin, nous ajoutons du texte à la cellule en utilisant {{domxref("Document.createTextNode()")}} et {{domxref("Node.appendChild()")}}. -<h3 id="HTML">HTML</h3> +### HTML -<pre class="brush: html"><table id="my-table"> - <tr><td>Row 1</td></tr> - <tr><td>Row 2</td></tr> - <tr><td>Row 3</td></tr> -</table></pre> +```html +<table id="my-table"> + <tr><td>Row 1</td></tr> + <tr><td>Row 2</td></tr> + <tr><td>Row 3</td></tr> +</table> +``` -<h3 id="JavaScript">JavaScript</h3> +### JavaScript -<pre class="brush: js">function addRow(tableID) { +```js +function addRow(tableID) { // Obtient une référence sur la table let tableRef = document.getElementById(tableID); @@ -61,43 +59,25 @@ translation_of: Web/API/HTMLTableRowElement/insertCell } // Appelle addRow() avec l’ID de la table -addRow('my-table');</pre> - -<h3 id="Résultat">Résultat</h3> - -<p>{{EmbedLiveSample("Example")}}</p> - -<h2 id="Spécifications">Spécifications</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("HTML WHATWG", "tables.html#dom-tr-insertcell", "HTMLTableRowElement.insertCell()")}}</td> - <td>{{Spec2("HTML WHATWG")}}</td> - <td> </td> - </tr> - <tr> - <td>{{SpecName("DOM2 HTML", "html.html#ID-68927016", "HTMLTableRowElement.insertCell()")}}</td> - <td>{{Spec2("DOM2 HTML")}}</td> - <td>Définition initiale.</td> - </tr> - </tbody> -</table> +addRow('my-table'); +``` + +### Résultat + +{{EmbedLiveSample("Example")}} + +## Spécifications + +| Spécification | Statut | Commentaire | +| -------------------------------------------------------------------------------------------------------------------------------- | -------------------------------- | -------------------- | +| {{SpecName("HTML WHATWG", "tables.html#dom-tr-insertcell", "HTMLTableRowElement.insertCell()")}} | {{Spec2("HTML WHATWG")}} | | +| {{SpecName("DOM2 HTML", "html.html#ID-68927016", "HTMLTableRowElement.insertCell()")}} | {{Spec2("DOM2 HTML")}} | Définition initiale. | -<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2> +## Compatibilité des navigateurs -<p>{{Compat("api.HTMLTableRowElement.insertCell")}}</p> +{{Compat("api.HTMLTableRowElement.insertCell")}} -<h2 id="Voir_aussi">Voir aussi</h2> +## Voir aussi -<ul> - <li>{{domxref("HTMLTableElement.insertRow()")}}</li> - <li>L’élément HTML représentant les cellules : {{domxref("HTMLTableCellElement")}}</li> -</ul> +- {{domxref("HTMLTableElement.insertRow()")}} +- L’élément HTML représentant les cellules : {{domxref("HTMLTableCellElement")}} |