HTMLElement

  • Revision slug: Web/API/HTMLElement
  • Revision title: HTMLElement
  • Revision id: 436919
  • Created:
  • Creator: teoli
  • Is current revision? No
  • Comment

Revision Content

{{DomRef}}

The HTMLElement interface represents any HTML element. Some elements directly implement this interface, other implement it via an interface that inherit it.

Properties

Inherits properties from its parent, {{domxref("Element")}}.

Name Type Description
{{domxref("element.accessKey", "accessKey")}} {{HTMLVersionInline(5)}} {{domxref("DOMString")}} The access key assigned to the element.
{{domxref("element.accessKeyLabel", "accessKeyLabel")}} {{HTMLVersionInline(5)}} {{domxref("DOMString")}} A string that represents the element's assigned access key.
{{domxref("element.className", "className")}} {{domxref("DOMString")}} The name of the CSS class assigned to the element.
{{domxref("element.dataset", "dataset")}} {{HTMLVersionInline(5)}} {{domxref("DOMStringMap")}} The element's data-* attribute as a map.
{{domxref("element.dir", "dir")}} {{domxref("DOMString")}} The element's dir attribute.
{{domxref("element.id", "id")}} {{domxref("DOMString")}} The element's ID.
{{domxref("element.lang", "lang")}} {{domxref("DOMString")}} The element's lang attribute.
{{domxref("element.title", "title")}} {{domxref("DOMString")}} The element's title.

Methods

Inherits methods from its parent, {{domxref("Element")}}.

Name & Arguments Return Description

{{domxref("element.blur()", "blur()")}} {{HTMLVersionInline(5)}}

void Removes keyboard focus from the currently focused element.
{{domxref("element.click()", "click()")}} {{HTMLVersionInline(5)}} void Sends a mouse click event to the element.
{{domxref("element.focus()", "focus()")}} {{HTMLVersionInline(5)}} void Makes the element the current keyboard focus.

Specifications

Specification Status Comment
{{SpecName('HTML WHATWG', 'elements.html#htmlelement', 'HTMLElement')}} {{Spec2('HTML WHATWG')}}  
{{SpecName('DOM2 HTML', '#ID-011100101', 'HTMLElement')}} {{Spec2('DOM2 HTML')}}  
{{SpecName('DOM1', '#ID-011100101', 'HTMLElement')}} {{Spec2('DOM1')}} Initial definition.

Browser compatibility

{{CompatibilityTable}}

Feature Firefox (Gecko) Chrome Internet Explorer Opera Safari
Basic support {{CompatGeckoDesktop("1.0")}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}}
{{domxref("element.accessKey", "accessKey")}} {{CompatGeckoDesktop("5.0")}} 17.0 {{CompatUnknown}} {{CompatUnknown}} {{CompatVersionUnknown}}(535.10)
{{domxref("element.accessKeyLabel", "accessKeyLabel")}} {{CompatGeckoDesktop("8.0")}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}} {{CompatNo}}{{WebkitBug(72715)}}
{{domxref("element.blur()", "blur()")}} {{CompatGeckoDesktop("5.0")}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}}
{{domxref("element.click()", "click()")}} {{CompatGeckoDesktop("5.0")}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}} {{CompatVersionUnknown}}(535.24)
{{domxref("element.dataset", "dataset")}} {{CompatGeckoDesktop("6.0")}} 9.0 {{CompatUnknown}} 11.10 5.1
{{domxref("element.focus()", "focus()")}} {{CompatGeckoDesktop("5.0")}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}}
Feature Firefox Mobile (Gecko) Android IE Mobile Opera Mobile Safari Mobile
Basic support

{{CompatGeckoMobile("1.0")}}

{{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}} {{CompatUnknown}}
{{domxref("element.accessKey", "accessKey")}} {{CompatGeckoMobile("5.0")}}
{{domxref("element.accessKeyLabel", "accessKeyLabel")}} {{CompatGeckoMobile("8.0")}}
{{domxref("element.blur()", "blur()")}} {{CompatGeckoMobile("5.0")}}
{{domxref("element.click()", "click()")}} {{CompatGeckoMobile("5.0")}}
{{domxref("element.dataset", "dataset")}} {{CompatGeckoMobile("6.0")}}
{{domxref("element.focus()", "focus()")}} {{CompatGeckoMobile("5.0")}}

See also

  • {{domxref("Element")}}

Revision Source

<div>
  {{DomRef}}</div>
<p>The <strong><code>HTMLElement</code></strong> interface represents any <a href="/en-US/docs/Web/HTML" title="/en-US/docs/Web/HTML">HTML</a> element. Some elements directly implement this interface, other implement it via an interface that inherit it.</p>
<h2 id="Properties">Properties</h2>
<p><em>Inherits properties from its parent, {{domxref("Element")}}.</em></p>
<table class="standard-table">
  <thead>
    <tr>
      <th scope="col">Name</th>
      <th scope="col">Type</th>
      <th scope="col">Description</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>{{domxref("element.accessKey", "accessKey")}} {{HTMLVersionInline(5)}}</td>
      <td>{{domxref("DOMString")}}</td>
      <td>The access key assigned to the element.</td>
    </tr>
    <tr>
      <td>{{domxref("element.accessKeyLabel", "accessKeyLabel")}} {{HTMLVersionInline(5)}}</td>
      <td>{{domxref("DOMString")}}</td>
      <td>A string that represents the element's assigned access key.</td>
    </tr>
    <tr>
      <td>{{domxref("element.className", "className")}}</td>
      <td>{{domxref("DOMString")}}</td>
      <td>The name of the CSS class assigned to the element.</td>
    </tr>
    <tr>
      <td>{{domxref("element.dataset", "dataset")}} {{HTMLVersionInline(5)}}</td>
      <td>{{domxref("DOMStringMap")}}</td>
      <td>The element's <code>data-*</code> attribute as a map.</td>
    </tr>
    <tr>
      <td>{{domxref("element.dir", "dir")}}</td>
      <td>{{domxref("DOMString")}}</td>
      <td>The element's <code>dir</code> attribute.</td>
    </tr>
    <tr>
      <td>{{domxref("element.id", "id")}}</td>
      <td>{{domxref("DOMString")}}</td>
      <td>The element's ID.</td>
    </tr>
    <tr>
      <td>{{domxref("element.lang", "lang")}}</td>
      <td>{{domxref("DOMString")}}</td>
      <td>The element's <code>lang</code> attribute.</td>
    </tr>
    <tr>
      <td>{{domxref("element.title", "title")}}</td>
      <td>{{domxref("DOMString")}}</td>
      <td>The element's title.</td>
    </tr>
  </tbody>
</table>
<h2 id="Methods">Methods</h2>
<p><em>Inherits methods from its parent, {{domxref("Element")}}.</em></p>
<table class="standard-table">
  <thead>
    <tr>
      <th scope="col">Name &amp; Arguments</th>
      <th scope="col">Return</th>
      <th scope="col">Description</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>
        <p>{{domxref("element.blur()", "blur()")}} {{HTMLVersionInline(5)}}</p>
      </td>
      <td><code>void</code></td>
      <td>Removes keyboard focus from the currently focused element.</td>
    </tr>
    <tr>
      <td>{{domxref("element.click()", "click()")}} {{HTMLVersionInline(5)}}</td>
      <td><code>void</code></td>
      <td>Sends a mouse click event to the element.</td>
    </tr>
    <tr>
      <td>{{domxref("element.focus()", "focus()")}} {{HTMLVersionInline(5)}}</td>
      <td><code>void</code></td>
      <td>Makes the element the current keyboard focus.</td>
    </tr>
  </tbody>
</table>
<h2 id="Specification">Specifications</h2>
<table class="standard-table">
  <thead>
    <tr>
      <th scope="col">Specification</th>
      <th scope="col">Status</th>
      <th scope="col">Comment</th>
    </tr>
  </thead>
  <tbody>
    <tr>
      <td>{{SpecName('HTML WHATWG', 'elements.html#htmlelement', 'HTMLElement')}}</td>
      <td>{{Spec2('HTML WHATWG')}}</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>{{SpecName('DOM2 HTML', '#ID-011100101', 'HTMLElement')}}</td>
      <td>{{Spec2('DOM2 HTML')}}</td>
      <td>&nbsp;</td>
    </tr>
    <tr>
      <td>{{SpecName('DOM1', '#ID-011100101', 'HTMLElement')}}</td>
      <td>{{Spec2('DOM1')}}</td>
      <td>Initial definition.</td>
    </tr>
  </tbody>
</table>
<h2 id="Browser_compatibility">Browser compatibility</h2>
<p>{{CompatibilityTable}}</p>
<div id="compat-desktop">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Firefox (Gecko)</th>
        <th>Chrome</th>
        <th>Internet Explorer</th>
        <th>Opera</th>
        <th>Safari</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>{{CompatGeckoDesktop("1.0")}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.accessKey", "accessKey")}}</td>
        <td>{{CompatGeckoDesktop("5.0")}}</td>
        <td>17.0</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatVersionUnknown}}(<a class="external" href="http://trac.webkit.org/changeset/107483">535.10</a>)</td>
      </tr>
      <tr>
        <td>{{domxref("element.accessKeyLabel", "accessKeyLabel")}}</td>
        <td>{{CompatGeckoDesktop("8.0")}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatNo}}{{WebkitBug(72715)}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.blur()", "blur()")}}</td>
        <td>{{CompatGeckoDesktop("5.0")}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.click()", "click()")}}</td>
        <td>{{CompatGeckoDesktop("5.0")}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatVersionUnknown}}(<a class="external" href="http://trac.webkit.org/changeset/107483">535.24</a>)</td>
      </tr>
      <tr>
        <td>{{domxref("element.dataset", "dataset")}}</td>
        <td>{{CompatGeckoDesktop("6.0")}}</td>
        <td>9.0</td>
        <td>{{CompatUnknown}}</td>
        <td>11.10</td>
        <td>5.1</td>
      </tr>
      <tr>
        <td>{{domxref("element.focus()", "focus()")}}</td>
        <td>{{CompatGeckoDesktop("5.0")}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
        <td>{{CompatUnknown}}</td>
      </tr>
    </tbody>
  </table>
</div>
<div id="compat-mobile">
  <table class="compat-table">
    <tbody>
      <tr>
        <th>Feature</th>
        <th>Firefox Mobile (Gecko)</th>
        <th>Android</th>
        <th>IE Mobile</th>
        <th>Opera Mobile</th>
        <th>Safari Mobile</th>
      </tr>
      <tr>
        <td>Basic support</td>
        <td>
          <p>{{CompatGeckoMobile("1.0")}}</p>
        </td>
        <td rowspan="7">{{CompatUnknown}}</td>
        <td rowspan="7">{{CompatUnknown}}</td>
        <td rowspan="7">{{CompatUnknown}}</td>
        <td rowspan="7">{{CompatUnknown}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.accessKey", "accessKey")}}</td>
        <td>{{CompatGeckoMobile("5.0")}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.accessKeyLabel", "accessKeyLabel")}}</td>
        <td>{{CompatGeckoMobile("8.0")}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.blur()", "blur()")}}</td>
        <td>{{CompatGeckoMobile("5.0")}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.click()", "click()")}}</td>
        <td>{{CompatGeckoMobile("5.0")}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.dataset", "dataset")}}</td>
        <td>{{CompatGeckoMobile("6.0")}}</td>
      </tr>
      <tr>
        <td>{{domxref("element.focus()", "focus()")}}</td>
        <td>{{CompatGeckoMobile("5.0")}}</td>
      </tr>
    </tbody>
  </table>
</div>
<h2 id="See_also">See also</h2>
<ul>
  <li>{{domxref("Element")}}</li>
</ul>
Revert to this revision