HTML and CSS Reference
In-Depth Information
allows you to accelerate this button simply by pressing a special key like
ALT
in conjunction
with the character values present in the attribute. There is some discussion about the
attribute eventually supporting words rather than just individual keys.
contenteditable
Initially a proprietary Microsoft attribute, this HTML5 attribute when set allows users to
directly edit content rendered in the browser. Values are
false
,
true
, and
inherit
. A
value of
false
prevents content from being edited by users;
true
allows editing. The
default value,
inherit
, applies the value of the affected element's parent element.
contextmenu
The
contextmenu
attribute is used to define an element's context menu, which is generally
the menu invoked upon a mouse right-click. The attribute's value should hold a string that
references the
id
value of a
<menu>
tag found in the DOM. If there is no element found or
no value, then the element has no special context menu and the user agent should show its
default menu. Internet Explorer and many other browsers support an
oncontextmenu
attribute that could be used to implement the idea of this emerging attribute.
data-X (Custom Data Attributes)
HTML5 defines a standard way to include developer-defined data attributes in tags, often
for the consumption by script. The general idea is to use the prefix
data-
and then pick a
variable name to include some nonvisual data on a tag. For example, here an
author
variable has been defined as custom data:
<p id="p1" data-author="Thomas A. Powell">
This is a data-X example
</p>
This value could then be read using the standard DOM
getAttribute()
method,
<form>
<input type="button" value="Show Author" onclick="alert(document.
getElementById('p1').getAttribute('data-author')); ">
</form>
or using new HTML5 DOM objects and properties for accessing such data:
<form>
<input type="button" value="Show Author" onclick="alert(document.
getElementById('p1').dataset.author);">
</form>
These attribute values should not be used by a user agent to style when rendering and
are solely for developer use. In many ways, the attribute is the direct consequence of people
just inventing attributes and forgoing validation,
<p id="p1" data-author="Thomas A. Powell">
This is a fake attribute example
</p>
