mozilla

Revisão 293898 de Output

  • Slug da revisão: HTML/Element/Output
  • Título da revisão: Output
  • ID da revisão: 293898
  • Criado:
  • Criador: LeonardoPacheco
  • É a revisão atual? Não
  • Comentar

Conteúdo da revisão

{{ HTMLVersionHeader(5) }}

Sumário

O elemento saída (<output>) representa o resultado de um cálculo.

Categorias de conteúdo Flow content, phrasing content, listed, labelable, resettable form-associated element.
Conteúdo permitido Phrasing content.
Omissão de tag Precisa ter ambas as tags de início e fim.
Documento normativo HTML5, section 4.10.15

Atributos

Como qualquer elemento HTML, este elemento suporta os global attributes.

{{ htmlattrdef("for") }}
Uma lista de IDs de outros elementos, indicando que estes elementos contribuiram com valores de entrada (input) para o cálculo (ou outros afetados).
{{ htmlattrdef("form") }}
O elemento form ao qual este elemento está associado (seu "proprietário do formulário"). O valor do atributo deve ser um ID de um elemento form no mesmo documento. Se este atributo não está especificado, o elemento output deve ser descendente de um elemento form. Este atributo permite que você coloque elementos output em qualquer lugar em um documento, não apenas como descendentes de seus elementos form.
{{ htmlattrdef("name") }}
O nome do elemento.

Interface DOM

O elemento implementa a interface HTMLOutputElement .

Exemplo

<form oninput="result.value=parseInt(a.value)+parseInt(b.value)">
0<input type="range" name="b" value="50" />100 +<input type="number" name="a" value="10" /> =
<output name="result"></output>
</form>

Compatibilidade

{{ CompatibilityTable() }}

Recurso Chrome Firefox (Gecko) Internet Explorer Opera Safari
Suporte básico 10 {{ CompatGeckoDesktop("2.0") }} 10 11 nightly
Recurso Android Firefox Mobile (Gecko) IE Mobile Opera Mobile Safari Mobile
Suporte básico {{ CompatUnknown() }} {{ CompatGeckoDesktop("2.0") }} {{ CompatUnknown() }} {{ CompatUnknown() }} {{ CompatUnknown() }}

Veja também

Outros elementos relacionados ao form: {{ 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") }}.

{{ HTML:Element_Navigation() }}
{{ languages({"en":"en/HTML/Element/output", "fr":"fr/HTML/Element/output", "ja":"ja/HTML/Element/output" }) }}

Fonte da revisão

<p>{{ HTMLVersionHeader(5) }}</p>
<h2 id="Sum.C3.A1rio">Sumário</h2>
<p>O elemento saída (&lt;output&gt;) representa o resultado de um cálculo.</p>
<table class="standard-table">
  <tbody>
    <tr>
      <td>Categorias de conteúdo</td>
      <td><a href="/en/HTML/Content_categories#Flow_content" title="en/HTML/Content categories#Flow content">Flow content</a>, <a href="/en/HTML/Content_categories#Phrasing_content" title="en/HTML/Content categories#Phrasing content">phrasing content</a>, <a href="/en/HTML/Content_categories#form_listed" title="en/HTML/Content categories#form listed">listed</a>, <a href="/en/HTML/Content_categories#form_labelable" title="en/HTML/Content categories#form labelable">labelable</a>, <a href="/en/HTML/Content_categories#form_resettable" title="en/HTML/Content categories#form resettable">resettable</a> <a href="/en/HTML/Content_categories#Form-associated_content" title="en/HTML/Content categories#Form-associated content">form-associated element</a>.</td>
    </tr>
    <tr>
      <td>Conteúdo permitido</td>
      <td><a href="/en/HTML/Content_categories#Phrasing_content" title="en/HTML/Content categories#Phrasing content">Phrasing content</a>.</td>
    </tr>
    <tr>
      <td>Omissão de tag</td>
      <td>Precisa ter ambas as tags de início e fim.</td>
    </tr>
    <tr>
      <td>Documento normativo</td>
      <td><a class="external" href="http://www.w3.org/TR/html5/the-button-element.html#the-output-element" title="http://www.w3.org/TR/html5/the-button-element.html#the-output-element">HTML5, section 4.10.15</a></td>
    </tr>
  </tbody>
</table>
<h2 id="Attributes">Atributos</h2>
<p>Como qualquer elemento HTML, este elemento suporta os <a href="/en/HTML/Global_attributes" title="en/HTML/Global attributes">global attributes</a>.</p>
<dl>
  <dt>
    {{ htmlattrdef("for") }}</dt>
  <dd>
    Uma lista de IDs de outros elementos, indicando que estes elementos contribuiram com valores de entrada (input) para o cálculo (ou outros afetados).</dd>
  <dt>
    {{ htmlattrdef("form") }}</dt>
  <dd>
    O elemento form ao qual este elemento está associado (seu "proprietário do formulário"). O valor do atributo deve ser um ID de um elemento form no mesmo documento. Se este atributo não está especificado, o elemento output deve ser descendente de um elemento form. Este atributo permite que você coloque elementos output em qualquer lugar em um documento, não apenas como descendentes de seus elementos form.</dd>
  <dt>
    {{ htmlattrdef("name") }}</dt>
  <dd>
    O nome do elemento.</dd>
</dl>
<h2 id="Interface_DOM">Interface DOM</h2>
<p>O elemento implementa a interface <a href="/en/DOM/HTMLOutputElement" title="en/DOM/HTMLOutputElement">HTMLOutputElement</a> .</p>
<h2 id="Exemplo">Exemplo</h2>
<pre>
&lt;form oninput="result.value=parseInt(a.value)+parseInt(b.value)"&gt;
0&lt;input type="range" name="b" value="50" /&gt;100 +&lt;input type="number" name="a" value="10" /&gt; =
&lt;output name="result"&gt;&lt;/output&gt;
&lt;/form&gt;
</pre>
<h2 id="Compatibilidade">Compatibilidade</h2>
<p>{{ CompatibilityTable() }}</p>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Recurso</th>
        <th>Chrome</th>
        <th>Firefox (Gecko)</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari</th>
      </tr>
      <tr>
        <td>Suporte básico</td>
        <td>10</td>
        <td>{{ CompatGeckoDesktop("2.0") }}</td>
        <td>10</td>
        <td>11</td>
        <td>nightly</td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Recurso</th>
        <th>Android</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>IE Mobile</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Suporte básico</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatGeckoDesktop("2.0") }}</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatUnknown() }}</td>
        <td>{{ CompatUnknown() }}</td>
      </tr>
    </tbody>
  </table>
</div>
<h2 id="Veja_tamb.C3.A9m">Veja também</h2>
<p>Outros elementos relacionados ao form: {{ 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") }}.</p>
<div>
  {{ HTML:Element_Navigation() }}</div>
<div>
  {{ languages({"en":"en/HTML/Element/output", "fr":"fr/HTML/Element/output", "ja":"ja/HTML/Element/output" }) }}</div>
Reverter para esta revisão