---
title: <output>
slug: Web/HTML/Element/output
tags:
  - Element
  - HTML
  - HTML forms
  - HTML5
  - 'HTML:Flow content'
  - NeedsMobileBrowserCompatibility
  - Reference
  - Web
translation_of: Web/HTML/Element/output
---
<h2 id="Summary" name="Summary">Sumari</h2>

<p>L'<strong>element HTML <code>&lt;output&gt;</code></strong> representa el resultat d'una acció de càlcul o  d'usuari.</p>

<table class="properties">
 <tbody>
  <tr>
   <th scope="row"><a href="/en-US/docs/HTML/Content_categories" title="HTML/Content_categories">Categories de contingut</a></th>
   <td><a href="/en-US/docs/HTML/Content_categories#Flow_content" title="HTML/Content categories#Flow content">Contingut dinàmic</a>, <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>, <a href="/en-US/docs/HTML/Content_categories#Form_listed" title="HTML/Content categories#Form listed">enumerat</a>, <a href="/en-US/docs/HTML/Content_categories#Form_labelable" title="HTML/Content categories#Form labelable">etiquetable</a><a href="/en-US/docs/HTML/Content_categories#Form_resettable" title="HTML/Content categories#Form resettable">, reiniciable</a> <a href="/en-US/docs/HTML/Content_categories#Form-associated_content" title="HTML/Content categories#Form-associated content">element associat a formulari </a>, contingut palpable .</td>
  </tr>
  <tr>
   <th scope="row">Contingut permès</th>
   <td><a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">Phrasing content</a>.</td>
  </tr>
  <tr>
   <th scope="row">Omissió de l'etiqueta</th>
   <td>{{no_tag_omission}}</td>
  </tr>
  <tr>
   <th scope="row">Elements pares permesos</th>
   <td>Qualsevol element que accepti <a href="/en-US/docs/HTML/Content_categories#Phrasing_content" title="HTML/Content categories#Phrasing content">phrasing content</a>.</td>
  </tr>
  <tr>
   <th scope="row">Interfície DOM</th>
   <td>{{domxref("HTMLOutputElement")}}</td>
  </tr>
 </tbody>
</table>

<h2 id="Attributes" name="Attributes">Atributs</h2>

<p>Aquest element inclou els<span style="line-height: 21px;"> </span><a href="https://developer.mozilla.org/en-US/docs/HTML/Global_attributes" style="line-height: 21px;" title="HTML/Global attributes">atributs globals</a><span style="line-height: 21px;">.</span></p>

<dl>
 <dt>{{htmlattrdef("for")}}</dt>
 <dd>Una llista IDs d'altres elements, indicant que aquests elements van aportar valors d'entrada al càlcul (o afectat d'una altra manera).</dd>
 <dt>{{htmlattrdef("form")}}</dt>
 <dd>L'element form al que està associat aquest element (el seu "propietari de formulari"). El valor de l'atribut ha de ser un ID d'un element formulari en el mateix document. Si no s'especifica aquest atribut, l'element de sortida ha de ser un descendent d'un element formulari. Aquest atribut li permet dipositar elements de sortida en qualsevol lloc dins d'un document, no només com descendents dels seus elements formulari.</dd>
 <dt>{{htmlattrdef("name")}}</dt>
 <dd>El nom de l'element.</dd>
</dl>

<h2 id="Example" name="Example">Exemple</h2>

<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>

<p>{{ EmbedLiveSample('Example')}}</p>

<h2 id="Specifications" name="Specifications">Especificacions</h2>

<table class="standard-table">
 <thead>
  <tr>
   <th scope="col">Especificació</th>
   <th scope="col">Estat</th>
   <th scope="col">Comentari</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="Browser_compatibility" name="Browser_compatibility">Navegadors compatibles</h2>

<p>{{CompatibilityTable}}</p>

<div id="compat-desktop">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Característica</th>
   <th>Chrome</th>
   <th>Firefox (Gecko)</th>
   <th>Internet Explorer</th>
   <th>Opera</th>
   <th>Safari</th>
  </tr>
  <tr>
   <td>Suport bàsic</td>
   <td>10</td>
   <td>{{CompatGeckoDesktop("2.0")}}</td>
   <td>{{ CompatNo() }}</td>
   <td>11</td>
   <td>7</td>
  </tr>
 </tbody>
</table>
</div>

<div id="compat-mobile">
<table class="compat-table">
 <tbody>
  <tr>
   <th>Característica</th>
   <th>Android</th>
   <th>Firefox Mobile (Gecko)</th>
   <th>IE Mobile</th>
   <th>Opera Mobile</th>
   <th>Safari Mobile</th>
  </tr>
  <tr>
   <td>Suport bàsic</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatGeckoDesktop("2.0")}}</td>
   <td>{{CompatUnknown}}</td>
   <td>{{CompatUnknown}}</td>
   <td>7</td>
  </tr>
 </tbody>
</table>
</div>

<h2 id="See_also" name="See_also">Veure</h2>

<ul>
 <li>Altres elements relacionats amb formualris: {{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")}} and {{HTMLElement("meter")}}.</li>
</ul>

<div>{{HTMLRef}}</div>

<p> </p>