aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/api/htmloptionelement/option/index.md
diff options
context:
space:
mode:
authorjulieng <julien.gattelier@gmail.com>2021-10-02 17:20:24 +0200
committerSphinxKnight <SphinxKnight@users.noreply.github.com>2021-10-02 17:30:20 +0200
commit1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde (patch)
tree30a56efd3eff3a01bd1611e1840fdbbfacf544a4 /files/fr/web/api/htmloptionelement/option/index.md
parentc05efa8d7ae464235cf83d7c0956e42dc6974103 (diff)
downloadtranslated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.gz
translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.tar.bz2
translated-content-1407c8fdef01ecd0ffb8a8bd46e7113f119b9fde.zip
convert content to md
Diffstat (limited to 'files/fr/web/api/htmloptionelement/option/index.md')
-rw-r--r--files/fr/web/api/htmloptionelement/option/index.md94
1 files changed, 41 insertions, 53 deletions
diff --git a/files/fr/web/api/htmloptionelement/option/index.md b/files/fr/web/api/htmloptionelement/option/index.md
index 975d2cc634..70ed813c2d 100644
--- a/files/fr/web/api/htmloptionelement/option/index.md
+++ b/files/fr/web/api/htmloptionelement/option/index.md
@@ -8,35 +8,34 @@ tags:
- HTMLOptionElement
translation_of: Web/API/HTMLOptionElement/Option
---
-<div>{{APIRef("HTML DOM")}}</div>
+{{APIRef("HTML DOM")}}
-<p>Le constructeur <strong><code>Option()</code></strong> permet de créer un nouvel objet {{domxref("HTMLOptionElement")}}.</p>
+Le constructeur **`Option()`** permet de créer un nouvel objet {{domxref("HTMLOptionElement")}}.
-<h2 id="Syntaxe">Syntaxe</h2>
+## Syntaxe
-<pre class="syntaxbox">var <em>o</em><em>ptionElementReference</em> = new Option(<em>text</em>, <em>value</em>, <em>defaultSelected</em>, <em>selected</em>);</pre>
+ var optionElementReference = new Option(text, value, defaultSelected, selected);
-<h3 id="Parameters">Parameters</h3>
+### Parameters
-<dl>
- <dt><code>text</code> {{optional_inline}}</dt>
- <dd>Une chaîne de caractères {{domxref("DOMString")}} représentant le contenu de l'élément, c'est-à-dire le texte affiché. Si cet argument n'est pas spécifié, c'est la chaîne vide qui sera utilisée.</dd>
- <dt><code>value</code> {{optional_inline}}</dt>
- <dd>Une chaîne de caractères {{domxref("DOMString")}} représentant la valeur de {{domxref("HTMLOptionElement")}}, c’est-à-dire l’attribut HTML <code>value</code> de l'élément {{htmlelement("option")}}. Si cet argument n'est pas fourni, ce sera la valeur de <code>text</code> qui sera reprise comme valeur (par exemple pour l'élément {{htmlelement("select")}} associé lorsque le formulaire est envoyé au serveur).</dd>
- <dt><code>defaultSelected</code> {{optional_inline}}</dt>
- <dd>Un {{domxref("Boolean")}} qui définit la valeur de l'attribut {{htmlattrxref("selected", "option")}}, c'est-à-dire que cette {{htmlelement("option")}} sera la valeur par défaut sélectionné dans l'élément {{htmlelement("select")}} lors du premier chargement de la page. S'il n'est pas spécifié, la valeur <code>false</code> sera utilisée par défaut.</dd>
- <dt><code>selected</code> {{optional_inline}}</dt>
- <dd>Un {{domxref("Boolean")}} qui définit l'état sélectionné de l'option, la valeur par défaut est <code>false</code> (non sélectionné). Si cet argument est absent et même si l'argument <code>defaultSelected</code> vaut <code>true</code>, l'option ne sera pas pas sélectionnée.</dd>
-</dl>
+- `text` {{optional_inline}}
+ - : Une chaîne de caractères {{domxref("DOMString")}} représentant le contenu de l'élément, c'est-à-dire le texte affiché. Si cet argument n'est pas spécifié, c'est la chaîne vide qui sera utilisée.
+- `value` {{optional_inline}}
+ - : Une chaîne de caractères {{domxref("DOMString")}} représentant la valeur de {{domxref("HTMLOptionElement")}}, c’est-à-dire l’attribut HTML `value` de l'élément {{htmlelement("option")}}. Si cet argument n'est pas fourni, ce sera la valeur de `text` qui sera reprise comme valeur (par exemple pour l'élément {{htmlelement("select")}} associé lorsque le formulaire est envoyé au serveur).
+- `defaultSelected` {{optional_inline}}
+ - : Un {{domxref("Boolean")}} qui définit la valeur de l'attribut {{htmlattrxref("selected", "option")}}, c'est-à-dire que cette {{htmlelement("option")}} sera la valeur par défaut sélectionné dans l'élément {{htmlelement("select")}} lors du premier chargement de la page. S'il n'est pas spécifié, la valeur `false` sera utilisée par défaut.
+- `selected` {{optional_inline}}
+ - : Un {{domxref("Boolean")}} qui définit l'état sélectionné de l'option, la valeur par défaut est `false` (non sélectionné). Si cet argument est absent et même si l'argument `defaultSelected` vaut `true`, l'option ne sera pas pas sélectionnée.
-<h2 id="Exemples">Exemples</h2>
+## Exemples
-<h3 id="Ajouter_de_nouvelles_options">Ajouter de nouvelles options</h3>
+### Ajouter de nouvelles options
-<pre class="brush: js">/* Imaginons qu'on ait le code HTML suivant dans le document
-&lt;select id='s'&gt;
+```js
+/* Imaginons qu'on ait le code HTML suivant dans le document
+<select id='s'>
-&lt;/select&gt;
+</select>
*/
var s = document.getElementById('s');
@@ -45,16 +44,17 @@ var options = [Quatre, Cinq, Six];
options.forEach(function(element,key) {
s[key] = new Option(element,key);
});
-</pre>
+```
-<h3 id="Ajouter_des_options_avec_différents_paramètres">Ajouter des options avec différents paramètres</h3>
+### Ajouter des options avec différents paramètres
-<pre class="brush: js">/* Imaginons qu'ont ait le code HTML suivant dans le document
-&lt;select id="s"&gt;
- &lt;option&gt;Premier&lt;/option&gt;
- &lt;option&gt;Deuxième&lt;/option&gt;
- &lt;option&gt;Troisième&lt;/option&gt;
-&lt;/select&gt;
+```js
+/* Imaginons qu'ont ait le code HTML suivant dans le document
+<select id="s">
+ <option>Premier</option>
+ <option>Deuxième</option>
+ <option>Troisième</option>
+</select>
*/
var s = document.getElementById('s');
@@ -73,28 +73,16 @@ options.forEach(function(element, key) {
});
/* Résultat dans le DOM / HTML modifié :
-&lt;select id="s"&gt;
- &lt;option value="0"&gt;zéro&lt;/option&gt;
- &lt;option value="1" selected=""&gt;un&lt;/option&gt;
- &lt;option value="2"&gt;deux&lt;/option&gt; // L'utilisateur verra cette option sélectionnée
-&lt;/select&gt;
-*/</pre>
-
-<h2 id="Spécifications">Spécifications</h2>
-
-<table class="standard-table">
- <thead>
- <tr>
- <th scope="col">Spécification</th>
- <th scope="col">État</th>
- <th scope="col">Commentaires</th>
- </tr>
- </thead>
- <tbody>
- <tr>
- <td><a href="http://www.w3.org/TR/2012/WD-html5-20121025/the-option-element.html#dom-option">HTML5 La définition de Option dans cette spécification.</a></td>
- <td>Recommendation</td>
- <td></td>
- </tr>
- </tbody>
-</table>
+<select id="s">
+ <option value="0">zéro</option>
+ <option value="1" selected="">un</option>
+ <option value="2">deux</option> // L'utilisateur verra cette option sélectionnée
+</select>
+*/
+```
+
+## Spécifications
+
+| Spécification | État | Commentaires |
+| ----------------------------------------------------------------------------------------------------------------------------------------- | -------------- | ------------ |
+| [HTML5 La définition de Option dans cette spécification.](http://www.w3.org/TR/2012/WD-html5-20121025/the-option-element.html#dom-option) | Recommendation | |