HTML Attributes

Global attributes can be assigned to all HTML elements. The list of these attributes is:

• accesskey
• autocapitalize
• autofocus
• contenteditable
• contextmenu (deprecated)
• data-*
• dir
• draggable
• enterkeyhint
• exportparts (experimental)
• hidden (Compare with HTMLElement.hidden)
• inert (See also HTMLElement.inert)
• inputmode
• is
• itemid
• itemprop
• itemref
• itemtype
• lang
• nonce
• part
• role
• slot
• itemscope
• spellcheck
• style
• tabindex
• title
• translate (Setting it to no tells the browser(?) not to translate the element's content).

In addition to the global attributes, there are a few attributes (which can also be specified for any element in any namespace) for which DOM defines the user agent requirements. These attributes are:

• class
• id
• slot

The attribute id is used to uniquely identify a HTML element. The value of the id attribute can be used in JavaScript to get the corresponding Node object:

var node = document.getElementById('the-id');

The attribute name is similar, but the same value can be assigned to multiple HTML tags. Thus, name does not uniquely identify a HTML element. Accordingly, the corresponding function to query for elements with a specific name value is plural and returns an array:

var nodes = document.getElementsByName('…');

A data-…="…" attribute allows to associate data with an element.

Such data can be processed in JavaScript with the DOMStringMap object which is returned by the dataset property of a HTMLElement instance.

Data atttribute values are considered private to a page and should (unlike Microformats) not be indexed by search engines.

Compare with itemscope and itemtype

The class attribute can be used by authors to extend elements which allows to create their own elements (compare with Microformat (μF)).

A browser that is not aware of the extension can still fall back to a somewhat useful representation of the element.

The media attribute can be used on the following elements:

• <link>
• <meta>
• <source>
• <style>

The value of the style attribute sets one or more CSS styles, see Inline CSS.

The style attribute can be specified on all HTML elements (although I doubt that it makes sense on some)

Compare with the <style> tag.

onclick: DOM example: onclick

HTML