The HTMLAreaElement
interface provides special properties and methods (beyond those of the regular object HTMLElement
interface it also has available to it by inheritance) for manipulating the layout and presentation of <area>
elements.
<div id="interfaceDiagram" style="display: inline-block; position: relative; width: 100%; padding-bottom: 20%; vertical-align: middle; overflow: hidden;"><svg style="display: inline-block; position: absolute; top: 0; left: 0;" viewbox="-50 0 600 120" preserveAspectRatio="xMinYMin meet"><a xlink:href="/docs/Web/API/EventTarget" target="_top"><rect x="1" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="56" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">EventTarget</text></a><polyline points="111,25 121,20 121,30 111,25" stroke="#D4DDE4" fill="none"/><line x1="121" y1="25" x2="151" y2="25" stroke="#D4DDE4"/><a xlink:href="/docs/Web/API/Node" target="_top"><rect x="151" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="188.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Node</text></a><polyline points="226,25 236,20 236,30 226,25" stroke="#D4DDE4" fill="none"/><line x1="236" y1="25" x2="266" y2="25" stroke="#D4DDE4"/><a xlink:href="/docs/Web/API/Element" target="_top"><rect x="266" y="1" width="75" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="303.5" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">Element</text></a><polyline points="341,25 351,20 351,30 341,25" stroke="#D4DDE4" fill="none"/><line x1="351" y1="25" x2="381" y2="25" stroke="#D4DDE4"/><a xlink:href="/docs/Web/API/HTMLElement" target="_top"><rect x="381" y="1" width="110" height="50" fill="#fff" stroke="#D4DDE4" stroke-width="2px" /><text x="436" y="30" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">HTMLElement</text></a><polyline points="491,25 501,20 501,30 491,25" stroke="#D4DDE4" fill="none"/><line x1="501" y1="25" x2="509" y2="25" stroke="#D4DDE4"/><line x1="509" y1="25" x2="509" y2="90" stroke="#D4DDE4"/><line x1="509" y1="90" x2="492" y2="90" stroke="#D4DDE4"/><a xlink:href="/docs/Web/API/HTMLAreaElement" target="_top"><rect x="341" y="65" width="150" height="50" fill="#F4F7F8" stroke="#D4DDE4" stroke-width="2px" /><text x="416" y="94" font-size="12px" font-family="Consolas,Monaco,Andale Mono,monospace" fill="#4D4E53" text-anchor="middle" alignment-baseline="middle">HTMLAreaElement</text></a></svg></div>
a:hover text { fill: #0095DD; pointer-events: all;}
Properties
Inherits properties from its parent, HTMLElement
, and implements those from HTMLHyperlinkElementUtils
.
Element.accessKey
- Is a
DOMString
containing a single character that switches input focus to the control. HTMLAreaElement.alt
- Is a
DOMString
that reflects thealt
HTML attribute, containing alternative text for the element. HTMLAreaElement.coords
- Is a
DOMString
that reflects thecoords
HTML attribute, containing coordinates to define the hot-spot region. HTMLAreaElement.download
- Is a
DOMString
indicating that the linked resource is intended to be downloaded rather than displayed in the browser. The value represent the proposed name of the file. If the name is not a valid filename of the underlying OS, browser will adapt it. HTMLHyperlinkElementUtils.hash
- Is a
USVString
containing the fragment identifier (including the leading hash mark (#)), if any, in the referenced URL. HTMLHyperlinkElementUtils.host
- Is a
USVString
containing the hostname and port (if it's not the default port) in the referenced URL. HTMLHyperlinkElementUtils.hostname
- Is a
USVString
containing the hostname in the referenced URL. HTMLHyperlinkElementUtils.href
- Is a
USVString
containing that reflects thehref
HTML attribute, containing a valid URL of a linked resource. HTMLAreaElement.hreflang
- Is a
DOMString
containing that reflects thehreflang
HTML attribute, indicating the language of the linked resource. HTMLAreaElement.media
- Is a
DOMString
containing that reflects themedia
HTML attribute, indicating target media of the linked resource. HTMLAreaElement.noHref
- Is a
Boolean
flag indicating if the area is inactive (true
) or active (false
). HTMLHyperlinkElementUtils.password
- Is a
USVString
containing the password specified before the domain name. HTMLHyperlinkElementUtils.origin
Read only- Returns a
USVString
containing the origin of the URL, that is its scheme, its domain and its port. HTMLHyperlinkElementUtils.pathname
- Is a
USVString
containing the path name component, if any, of the referenced URL. HTMLHyperlinkElementUtils.port
- Is a
USVString
containing the port component, if any, of the referenced URL. HTMLHyperlinkElementUtils.protocol
- Is a
USVString
containing the protocol component (including trailing colon':'
), of the referenced URL. HTMLAreaElement.referrerPolicy
- Is a
DOMString
that reflects thereferrerpolicy
HTML attribute indicating which referrer to use when fetching the linked resource. HTMLAreaElement.rel
- Is a
DOMString
that reflects therel
HTML attribute, indicating relationships of the current document to the linked resource. HTMLAreaElement.relList
Read only- Returns a
DOMTokenList
that reflects therel
HTML attribute, indicating relationships of the current document to the linked resource, as a list of tokens. HTMLHyperlinkElementUtils.search
- Is a
USVString
containing the search element (including leading question mark'?'
), if any, of the referenced URL. HTMLAreaElement.shape
- Is a
DOMString
that reflects theshape
HTML attribute, indicating the shape of the hot-spot, limited to known values. HTMLElement.tabIndex
- Is a
long
containing the element's position in the tabbing order. HTMLAreaElement.target
- Is a
DOMString
that reflects thetarget
HTML attribute, indicating the browsing context in which to open the linked resource. HTMLAreaElement.type
- Is a
DOMString
that reflects thetype
HTML attribute, indicating the MIME type of the linked resource. HTMLHyperlinkElementUtils.username
- Is a
USVString
containing the username specified before the domain name.
Methods
Inherits methods from its parent, HTMLElement
, and implements those from HTMLHyperlinkElementUtils
.
HTMLHyperlinkElementUtils.toString()
- Returns a
USVString
containing the whole URL of the script executed in theWorker
. It is a synonym forHTMLHyperlinkElementUtils.href
.
Specifications
Specification | Status | Comment |
---|---|---|
HTML Living Standard The definition of 'HTMLAreaElement' in that specification. |
Living Standard | The following property has been added: download .Technically, the URL-related properties, media , host , hostname , pathname , port , protocol , search , and hash , have been moving to the HTMLHyperlinkElementUtils mixin, and HTMLAreaElement implements this mixin. |
HTML5 The definition of 'HTMLAreaElement' in that specification. |
Recommendation | Technically, the properties tabindex and accesskey are now defined on HTMLElement .The following property is now obsolete: nohref .The following properties have been added: rel , relList , media , hreflang , type , host , hostname , pathname , port , protocol , search , and hash . |
Document Object Model (DOM) Level 2 HTML Specification The definition of 'HTMLAreaElement' in that specification. |
Obsolete | No change from Document Object Model (DOM) Level 1 Specification. |
Document Object Model (DOM) Level 1 Specification The definition of 'HTMLAreaElement' in that specification. |
Obsolete | Initial definition |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
HTMLAreaElement | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
accessKey | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
alt | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
coords | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
download | Chrome Full support 54 | Edge Full support 13 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support 54 | Chrome Android Full support 54 | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support 6.0 |
hreflang | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
media | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
noHref | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
referrerPolicy | Chrome Full support 51 | Edge Full support 79 | Firefox Full support 50 | IE No support No | Opera Full support 38 | Safari Full support 11.1 | WebView Android Full support 51 | Chrome Android Full support 51 | Firefox Android Full support 50 | Opera Android Full support 41 | Safari iOS No support No | Samsung Internet Android Full support 7.2 |
rel | Chrome Full support 54 | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support 54 | Chrome Android Full support 54 | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support 6.0 |
relList | Chrome Full support 65 | Edge Full support 18 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support 65 | Chrome Android Full support 65 | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support 9.0 |
shape | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
tabIndex | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
target | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
type | Chrome Full support Yes | Edge Full support 12 | Firefox Full support 1 | IE Full support Yes | Opera Full support Yes | Safari Full support Yes | WebView Android Full support Yes | Chrome Android Full support Yes | Firefox Android Full support Yes | Opera Android Full support Yes | Safari iOS Full support Yes | Samsung Internet Android Full support Yes |
Legend
- Full support
- Full support
- No support
- No support
- Experimental. Expect behavior to change in the future.
- Experimental. Expect behavior to change in the future.
See also
- HTML element implementing this interface:
<area>