L'élémentHTML<output> est un élément conteneur dans lequel un site ou une application peut injecter les résultats d'un calcul ou le résultat d'une action utilisateur.

Attributs

Cet élément inclut lesattributs universels.

for

Une liste d'id 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).

form

L'élément<form> auquel associer la sortie (son propriétaire de formulaire). La valeur de cet attribut doit être l'id d'un<form> dans le même document. (Si cet attribut n'est pas défini, l'élément<output> est associé à son ancêtre<form>, s'il existe.)

Cet attribut permet d'associer des éléments<output> à des<form> n'importe où dans le document, pas seulement à l'intérieur d'un<form>. Il peut aussi remplacer un ancêtre<form>. Le nom et le contenu de l'élément<output> ne sont pas envoyés lors de la soumission du formulaire.

name

Le nom de l'élément. Utilisé dans l'APIform.elements.

La valeur, le nom et le contenu de l'élément<output> ne sont PAS envoyés lors de la soumission du formulaire.

Accessibilité

De nombreux navigateurs implémentent cet élément comme une régionaria-live. Les technologies d'assistance annoncent ainsi les résultats des interactions de l'utilisateur·ice affichés dans cet élément sans exiger que la sélection soit déplacée depuis les contrôles qui produisent ces résultats.

Exemples

Le formulaire qui suit fournit un curseur dont la valeur peut aller de0 à100 ainsi qu'un élément HTML<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<output> et est actualisé lorsqu'une des deux valeurs est modifiée.

<form>  <input type="range" name="b" value="50" /> +  <input type="number" name="a" value="10" /> =  <output name="resultat" for="a b">60</output></form>

const form = document.getElementById("formulaire-exemple");const a = form.elements["a"];const b = form.elements["b"];const result = form.elements["resultat"];function updateResult() {  const aValue = a.valueAsNumber;  const bValue = b.valueAsNumber;  result.value = aValue + bValue;}form.addEventListener("input", updateResult);updateResult();

Résultat

Résumé technique

Spécifications

Compatibilité des navigateurs