aboutsummaryrefslogtreecommitdiff
path: root/files/fr/web/html/element/output
diff options
context:
space:
mode:
authorPeter Bengtsson <mail@peterbe.com>2020-12-08 14:40:17 -0500
committerPeter Bengtsson <mail@peterbe.com>2020-12-08 14:40:17 -0500
commit33058f2b292b3a581333bdfb21b8f671898c5060 (patch)
tree51c3e392513ec574331b2d3f85c394445ea803c6 /files/fr/web/html/element/output
parent8b66d724f7caf0157093fb09cfec8fbd0c6ad50a (diff)
downloadtranslated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.gz
translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.tar.bz2
translated-content-33058f2b292b3a581333bdfb21b8f671898c5060.zip
initial commit
Diffstat (limited to 'files/fr/web/html/element/output')
-rw-r--r--files/fr/web/html/element/output/index.html115
1 files changed, 115 insertions, 0 deletions
diff --git a/files/fr/web/html/element/output/index.html b/files/fr/web/html/element/output/index.html
new file mode 100644
index 0000000000..56ca6c1592
--- /dev/null
+++ b/files/fr/web/html/element/output/index.html
@@ -0,0 +1,115 @@
+---
+title: '<output> : l''élément de sortie'
+slug: Web/HTML/Element/output
+tags:
+ - Element
+ - Formulaires
+ - HTML
+ - Reference
+ - Web
+translation_of: Web/HTML/Element/output
+---
+<div>{{HTMLRef}}</div>
+
+<p>L'élément HTML <strong><code>&lt;output&gt;</code></strong> représente un conteneur dans lequel un site ou une application peut injecter le résultat d'un calcul ou d'une action utilisateur.</p>
+
+<h2 id="Attributs">Attributs</h2>
+
+<p>Comme tous les autres éléments HTML, cet élément inclut <a href="/fr/docs/Web/HTML/Attributs_universels">les attributs universels</a>.</p>
+
+<dl>
+ <dt>{{htmlattrdef("for")}}</dt>
+ <dd>Une liste d'<a href="/fr/docs/Web/HTML/Attributs_universels/id">identifiants </a>d'autres éléments, séparés par des espaces, qui ont joué un rôle dans le calcul (en tant que valeurs d'entrée ou autrement).</dd>
+ <dt>{{htmlattrdef("form")}}</dt>
+ <dd>L'identifiant d'un élément de formulaire ({{HTMLElement("form")}}) auquel cet élément est rattaché. La valeur de cet attribut doit être un identifiant (<code>id</code>) d'un formulaire qui fait partie du même document. Cet attribut n'est pas nécessaire si l'élément <code>&lt;output&gt;</code> est situé dans un formulaire ou si l'élément <code>&lt;output&gt;</code> n'est pas du tout associé à un formulaire. Cet attribut permet ainsi de placer l'élément <code>&lt;output&gt;</code> où on veut dans le document, pas nécessairement comme descendant d'un formulaire.</dd>
+ <dt>{{htmlattrdef("name")}}</dt>
+ <dd>Le nom de l'élément, utilisé pour identifier l'élément <code>&lt;output&gt;</code> lors de l'envoi du formulaire.</dd>
+</dl>
+
+<h2 id="Exemples">Exemples</h2>
+
+<p>Le formulaire qui suit fournit un curseur dont la valeur peut aller de 0 à 100 ainsi qu'un élément {{HTMLElement("input")}} dans lequel on peut saisir un deuxième nombre. Les deux nombres sont additionnés et le résultat est affiché dans l'élément <code>&lt;output&gt;</code> et est actualisé lorsqu'une des deux valeurs est modifiée.</p>
+
+<h3 id="HTML">HTML</h3>
+
+<pre class="brush: html">&lt;form oninput="result.value=parseInt(a.value)+parseInt(b.value)"&gt;
+ &lt;input type="range" name="b" value="50" /&gt; +
+ &lt;input type="number" name="a" value="10" /&gt; =
+ &lt;output name="result"&gt;60&lt;/output&gt;
+&lt;/form&gt;
+</pre>
+
+<h3 id="Résultat">Résultat</h3>
+
+<p>{{EmbedLiveSample('Exemples','300','200')}}</p>
+
+<h2 id="Résumé_technique">Résumé technique</h2>
+
+<table class="properties">
+ <tbody>
+ <tr>
+ <th scope="row"><a href="/fr/docs/Web/HTML/Catégorie_de_contenu">Catégories de contenu</a></th>
+ <td><a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_de_flux">Contenu de flux</a>, <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé">contenu phrasé</a>, <a href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Contenu_associ%C3%A9_aux_formulaires">contenu associé au formulaire (énuméré, étiquetable, réinitialisable)</a>, <a href="/fr/docs/Web/HTML/Cat%C3%A9gorie_de_contenu#Contenu_tangible">contenu tangible</a>.</td>
+ </tr>
+ <tr>
+ <th scope="row">Contenu autorisé</th>
+ <td><a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé">Contenu phrasé</a>.</td>
+ </tr>
+ <tr>
+ <th scope="row">Omission de balises</th>
+ <td>{{no_tag_omission}}</td>
+ </tr>
+ <tr>
+ <th scope="row">Parents autorisés</th>
+ <td>Tout élément qui accepte du <a href="/fr/docs/Web/HTML/Catégorie_de_contenu#Contenu_phrasé">contenu phrasé</a>.</td>
+ </tr>
+ <tr>
+ <th scope="row">Rôles ARIA autorisés</th>
+ <td>Tous les rôles sont autorisés.</td>
+ </tr>
+ <tr>
+ <th scope="row">Interface DOM</th>
+ <td>{{domxref("HTMLOutputElement")}}</td>
+ </tr>
+ </tbody>
+</table>
+
+<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>{{SpecName('HTML WHATWG', 'the-button-element.html#the-output-element', '&lt;output&gt;')}}</td>
+ <td>{{Spec2('HTML WHATWG')}}</td>
+ <td> </td>
+ </tr>
+ <tr>
+ <td>{{SpecName('HTML5 W3C', 'forms.html#the-output-element', '&lt;output&gt;')}}</td>
+ <td>{{Spec2('HTML5 W3C')}}</td>
+ <td> </td>
+ </tr>
+ </tbody>
+</table>
+
+<h2 id="Compatibilité_des_navigateurs">Compatibilité des navigateurs</h2>
+
+<div class="hidden">Le tableau de compatibilité de cette page a été généré à partir de données structurées. Si vous souhaitez contribuer à ces données, n'hésitez pas à envoyer une<em>pull request</em> sur <a href="https://github.com/mdn/browser-compat-data">https://github.com/mdn/browser-compat-data</a>.</div>
+
+<p>{{Compat("html.elements.output")}}</p>
+
+<div class="blockIndicator note">
+<p><strong>Note :</strong> La plupart des navigateurs implémente cet élément comme s'il avait l'attribut <code>aria-live</code> par défaut. Les outils d'assistance annonceront donc les résultats des interactions avec l'interface utilisateur qui arrivent sur cet élément sans demander à avoir passé le focus depuis un autre contrôle. Toutefois, ce comportement n'est pas précisément décrit dans les spécifications actuelles.</p>
+</div>
+
+<h2 id="Voir_aussi">Voir aussi</h2>
+
+<ul>
+ <li>Les autres éléments relatifs aux formulaires : {{HTMLElement("form")}}, {{HTMLElement("input")}}, {{HTMLElement("button")}}, {{HTMLElement("datalist")}}, {{HTMLElement("legend")}}, {{HTMLElement("label")}}, {{HTMLElement("select")}}, {{HTMLElement("optgroup")}}, {{HTMLElement("option")}}, {{HTMLElement("textarea")}}, {{HTMLElement("keygen")}}, {{HTMLElement("fieldset")}}, {{HTMLElement("progress")}} et {{HTMLElement("meter")}}.</li>
+</ul>