Element

  • Revision slug: DOM/element
  • Revision title: element
  • Revision id: 7068
  • Created:
  • Creator: tshinnic
  • Is current revision? No
  • Comment Element.children returns HTMLCollection, not NodeList; 23 words added, 13 words removed

Revision Content

{{ DomRef() }}

This chapter provides a brief reference for the general methods, properties, and events available to most HTML and XML elements in the Gecko DOM.

Various W3C specifications apply to elements:

The articles listed here span the above and include links to the appropriate W3C DOM specification.

While these interfaces are generally shared by most HTML and XML elements, there are more specialized interfaces for particular objects listed in the DOM HTML Specification. Note, however, that these HTML interfaces are "only for [HTML 4.01] and [XHTML 1.0] documents and are not guaranteed to work with any future version of XHTML." The HTML 5 draft does state it aims for backwards compatibility with these HTML interfaces but says of them that "some features that were formerly deprecated, poorly supported, rarely used or considered unnecessary have been removed." One can avoid the potential conflict by moving entirely to DOM XML attribute methods such as getAttribute().

{{ domxref("HTMLHtmlElement","Html") }}, {{ domxref("HTMLHeadElement","Head") }}, {{ domxref("HTMLLinkElement","Link") }}, {{ domxref("HTMLTitleElement","Title") }}, {{ domxref("HTMLMetaElement","Meta") }}, {{ domxref("HTMLBaseElement","Base") }}, {{ domxref("HTMLIsIndexElement","IsIndex") }}, {{ domxref("HTMLStyleElement","Style") }}, {{ domxref("HTMLBodyElement","Body") }}, {{ domxref("HTMLFormElement","Form") }}, {{ domxref("HTMLSelectElement","Select") }}, {{ domxref("HTMLOptGroupElement","OptGroup") }}, Option, {{ domxref("HTMLInputElement","Input") }}, {{ domxref("HTMLTextAreaElement","TextArea") }}, {{ domxref("HTMLButtonElement","Button") }}, {{ domxref("HTMLLabelElement","Label") }}, {{ domxref("HTMLFieldSetElement","FieldSet") }}, {{ domxref("HTMLLegendElement","Legend") }}, {{ domxref("HTMLUListElement","UList") }}, {{ domxref("OList") }}, {{ domxref("DList") }}, {{ domxref("Directory") }}, {{ domxref("Menu") }}, {{ domxref("LI") }}, {{ domxref("Div") }}, {{ domxref("Paragraph") }}, {{ domxref("Heading") }}, {{ domxref("Quote") }}, {{ domxref("Pre") }}, {{ domxref("BR") }}, {{ domxref("BaseFont") }}, {{ domxref("Font") }}, {{ domxref("HR") }}, {{ domxref("Mod") }}, {{ domxref("HTMLAnchorElement","Anchor") }}, {{ domxref("Image") }}, {{ domxref("HTMLObjectElement","Object") }}, {{ domxref("Param") }}, {{ domxref("Applet") }}, {{ domxref("Map") }}, {{ domxref("Area") }}, {{ domxref("Script") }}, {{ domxref("HTMLTableElement","Table") }}, {{ domxref("TableCaption") }}, {{ domxref("TableCol") }}, {{ domxref("TableSection") }}, {{ domxref("HTMLTableRowElement","TableRow") }}, {{ domxref("TableCell") }}, {{ domxref("FrameSet") }}, {{ domxref("Frame") }}, {{ domxref("HTMLIFrameElement","IFrame") }}

Properties

Name Description Type Availability
{{ domxref("Node.attributes","attributes") }} All attributes associated with an element. {{ domxref("NamedNodeMap") }} All
{{ domxref("Node.baseURI","baseURI") }} Base URI as a string String HTML, XUL
{{ domxref("element.baseURIObject","baseURIObject") }} {{ Fx_minversion_inline("3") }} The read-only {{ Interface("nsIURI") }} object representing the base URI for the element. {{ Interface("nsIURI") }} All (with UniversalXPConnect privileges)
{{ domxref("Element.childElementCount","childElementCount") }} {{ fx_minversion_inline("3.5") }} The number of child nodes that are elements. Number

HTML, XUL

{{ domxref("Node.childNodes","childNodes") }} All child nodes of an element.

A live {{ interface("nsIDOMNodeList") }} of the current child elements.

{{ domxref("NodeList") }} All
{{ domxref("Element.children","children") }} {{ gecko_minversion_inline("1.9") }}

All child nodes of an element as a collection.

{{ domxref("HTMLCollection") }} HTML, XUL
{{ domxref("element.classList","classList") }} {{ gecko_minversion_inline("1.9.2") }} Token list of class attribute {{ domxref("DOMTokenList") }} HTML
{{ domxref("element.className","className") }} Gets/sets the class of the element. String HTML, XUL
{{ domxref("element.clientHeight","clientHeight") }} The inner height of an element. Number HTML
{{ domxref("element.clientLeft","clientLeft") }} The width of the left border of an element. Number HTML
{{ domxref("element.clientTop","clientTop") }} The width of the top border of an element. Number HTML
{{ domxref("element.clientWidth","clientWidth") }} The inner width of an element. Number HTML
{{ domxref("Element.contentEditable","contentEditable") }} {{ gecko_minversion_inline("1.9") }} Gets/sets whether or not the element is editable. String HTML, XUL
{{ domxref("element.dataset","dataset") }} Allows access to read and write custom data attributes on the element. {{ domxref("DOMStringMap") }} HTML
{{ domxref("element.dir","dir") }} Gets/sets the directionality of the element. String HTML, XUL
{{ domxref("Node.firstChild","firstChild") }} The first direct child node of an element, or null if this element has no child nodes. {{ domxref("Node") }} All
{{ domxref("Element.firstElementChild","firstElementChild") }} {{ gecko_minversion_inline("1.9") }} The first direct child element of an element, or null if the element has no child elements. {{ domxref("Element") }} HTML, XUL
{{ domxref("element.id","id") }} Gets/sets the id of the element. String HTML, XUL
{{ domxref("element.innerHTML","innerHTML") }} Gets/sets the markup of the element's content. String HTML
{{ domxref("Element.isContentEditable","isContentEditable") }} {{ gecko_minversion_inline("2") }} Indicates whether or not the content of the element can be edited. Read only. Boolean HTML, XUL
{{ domxref("element.lang","lang") }} Gets/sets the language of an element's attributes, text, and element contents. String HTML
{{ domxref("Node.lastChild","lastChild") }} The last direct child node of an element, or null if this element has no child nodes. {{ domxref("Node") }} All
{{ domxref("Element.lastElementChild","lastElementChild") }} {{ gecko_minversion_inline("1.9") }} The last direct child element of an element, or null if the element has no child elements. {{ domxref("Element") }} HTML, XUL
{{ domxref("Node.localName","localName") }} The local part of the qualified name of an element. In Firefox 3.5 and earlier, the property upper-cases the local name for HTML elements (but not XHTML elements). In later versions, this does not happen, so the property is in lower case for both HTML and XHTML. {{ gecko_minversion_inline("1.9.2") }} String All
Name Description Type Availability
{{ domxref("element.name","name") }} Gets/sets the name attribute of an element. String HTML
{{ domxref("Node.namespaceURI","namespaceURI") }} The namespace URI of this node, or null if it is no namespace. In Firefox 3.5 and earlier, HTML elements are in no namespace. In later versions, HTML elements are in the http://www.w3.org/1999/xhtml namespace in both HTML and XML trees. {{ gecko_minversion_inline("1.9.2") }} String All
{{ domxref("Node.nextSibling","nextSibling") }} The node immediately following the given one in the tree, or null if there is no sibling node. {{ domxref("Node") }} All
{{ domxref("Element.nextElementSibling","nextElementSibling") }} {{ fx_minversion_inline("3.5") }} The element immediately following the given one in the tree, or null if there's no sibling node. {{ domxref("Element") }} HTML, XUL
{{ domxref("Node.nodeName","nodeName") }} The name of the node. String All
{{ domxref("Node.nodePrincipal","nodePrincipal") }} {{ Fx_minversion_inline("3") }} The node's principal. {{ Interface("nsIPrincipal") }} All (with UniversalXPConnect privileges)
{{ domxref("Node.nodeType","nodeType") }} A number representing the type of the node. Is always equal to 1 for DOM elements. Number All
{{ domxref("Node.nodeValue","nodeValue") }} The value of the node. Is always equal to null for DOM elements. String All
{{ domxref("element.offsetHeight","offsetHeight") }} The height of an element, relative to the layout. Number HTML
{{ domxref("element.offsetLeft","offsetLeft") }} The distance from this element's left border to its offsetParent's left border. Number HTML
{{ domxref("element.offsetParent","offsetParent") }} The element from which all offset calculations are currently computed. {{ domxref("Element") }} HTML
{{ domxref("element.offsetTop","offsetTop") }} The distance from this element's top border to its offsetParent's top border. Number HTML
{{ domxref("element.offsetWidth","offsetWidth") }} The width of an element, relative to the layout. Number HTML
{{ domxref("element.outerHTML","outerHTML") }}
{{ gecko_minversion_inline("11") }}
Gets the markup of the element including its content. When used as a setter, replaces the element with nodes parsed from the given string. String HTML
{{ domxref("Node.ownerDocument","ownerDocument") }} The document that this node is in, or null if the node is not inside of one. {{ domxref("Document") }} All
Name Description Type Availability
{{ domxref("Node.parentNode","parentNode") }} The parent element of this node, or null if the node is not inside of a {{ domxref("document","DOM Document") }}. {{ domxref("Node") }} All
{{ domxref("Node.prefix","prefix") }} The namespace prefix of the node, or null if no prefix is specified. String All
{{ domxref("Node.previousSibling","previousSibling") }} The node immediately preceding the given one in the tree, or null if there is no sibling node. {{ domxref("Node") }} All
{{ domxref("Element.previousElementSibling","previousElementSibling") }} {{ fx_minversion_inline("3.5") }} The element immediately preceding the given one in the tree, or null if there is no sibling element. {{ domxref("Element") }} HTML, XUL
{{ domxref("element.schemaTypeInfo","schemaTypeInfo") }} Returns TypeInfo regarding schema information for the element (also available on {{ domxref("Attr") }}). {{ domxref("TypeInfo") }} Not supported
{{ domxref("element.scrollHeight","scrollHeight") }} The scroll view height of an element. Number HTML
{{ domxref("element.scrollLeft","scrollLeft") }} Gets/sets the left scroll offset of an element. Number HTML
{{ domxref("element.scrollTop","scrollTop") }} Gets/sets the top scroll offset of an element. Number HTML
{{ domxref("element.scrollWidth","scrollWidth") }} The scroll view width of an element. Number HTML
spellcheck Controls spell-checking (present on all HTML elements) Boolean HTML
{{ domxref("element.style","style") }} An object representing the declarations of an element's style attributes. {{ domxref("CSSStyleDeclaration") }} HTML, XUL
{{ domxref("element.tabIndex","tabIndex") }} Gets/sets the position of the element in the tabbing order. Number HTML
{{ domxref("element.tagName","tagName") }} The name of the tag for the given element. String All
{{ domxref("Node.textContent","textContent") }} Gets/sets the textual contents of an element and all its descendants. String All
{{ domxref("element.title","title") }} A string that appears in a popup box when mouse is over the element. String HTML

Methods

Name & Description Return Availability
{{ domxref("element.addEventListener","addEventListener") }}( type, listener, useCapture )
Register an event handler to a specific event type on the element.
- {{ domxref("event","All") }}
{{ domxref("Node.appendChild","appendChild") }}( {{ domxref("Node","appendedNode") }} )
Insert a node as the last child node of this element.
{{ domxref("Node") }} All
{{ domxref("element.blur","blur") }}()
Removes keyboard focus from the current element.
- HTML, XUL
{{ domxref("element.click","click") }}()
Simulates a click on the current element.
- HTML, XUL
{{ domxref("Node.cloneNode","cloneNode") }}( deep )
Clone a node, and optionally, all of its contents.
{{ domxref("Node") }} All
{{ domxref("Node.compareDocumentPosition","compareDocumentPosition") }} ( {{ domxref("Node","otherNode") }} ) Number All
{{ domxref("element.dispatchEvent","dispatchEvent") }}( {{ domxref("event") }} )
Dispatch an event to this node in the DOM.
Boolean All
{{ domxref("element.focus","focus") }}()
Gives keyboard focus to the current element.
- HTML, XUL
{{ domxref("element.getAttribute","getAttribute") }}( name )
Retrieve the value of the named attribute from the current node.
Object All
{{ domxref("element.getAttributeNS","getAttributeNS") }}( namespace, name )
Retrieve the value of the attribute with the specified name and namespace, from the current node.
Object All
{{ domxref("element.getAttributeNode","getAttributeNode") }}( name )
Retrieve the node representation of the named attribute from the current node.
{{ domxref("Attr") }} All
{{ domxref("element.getAttributeNodeNS","getAttributeNodeNS") }}( namespace, name )
Retrieve the node representation of the attribute with the specified name and namespace, from the current node.
{{ domxref("Attr") }} All
{{ domxref("element.getBoundingClientRect","getBoundingClientRect") }} ( )    

{{ domxref("element.getClientRects","getClientRects") }} ( )
Returns a collection of rectangles that indicate the bounding rectangles for each line of text in a client.

   
Name & Description Return Availability
{{ domxref("Element.getElementsByClassName","getElementsByClassName") }}( ) {{ domxref("NodeList") }}  
{{ domxref("element.getElementsByTagName","getElementsByTagName") }}( name )
Retrieve a set of all descendant elements, of a particular tag name, from the current element.
{{ domxref("NodeList") }} All
{{ domxref("element.getElementsByTagNameNS","getElementsByTagNameNS") }}( namespace, name )
Retrieve a set of all descendant elements, of a particular tag name and namespace, from the current element.
{{ domxref("NodeList") }} All
{{ domxref("Node.getFeature","getFeature") }} ( feature, version ) Object All
{{ domxref("Node.getUserData","getUserData") }} ( key ) {{ domxref("DOMUserData") }} All
{{ domxref("element.hasAttribute","hasAttribute") }}( name )
Check if the element has the specified attribute, or not.
Boolean All
{{ domxref("element.hasAttributeNS","hasAttributeNS") }}( namespace, name )
Check if the element has the specified attribute, in the specified namespace, or not.
Boolean All
{{ domxref("Node.hasAttributes","hasAttributes") }}()
Check if the element has any attributes, or not.
Boolean All
{{ domxref("Node.hasChildNodes","hasChildNodes") }}()
Check if the element has any child nodes, or not.
Boolean All
{{ domxref("Node.insertBefore","insertBefore") }}( {{ domxref("Node","insertedNode") }}, {{ domxref("Node","adjacentNode") }} )
Inserts the first node before the second, child, Node in the DOM.
{{ domxref("Node") }} All
{{ domxref("Node.isDefaultNamespace","isDefaultNamespace") }} ( namespaceURI ) Boolean All
{{ domxref("Node.isEqualNode","isEqualNode") }} ( {{ domxref("Node","nodeArg") }} ) Boolean All
{{ domxref("Node.isSameNode","isSameNode") }} ( {{ domxref("Node","otherNode") }} Boolean All
{{ domxref("Node.isSupported","isSupported") }} ( feature, version ) Boolean All
{{ domxref("Node.lookupNamespaceURI","lookupNamespaceURI") }} ( prefix ) String All
{{ domxref("Node.lookupPrefix","lookupPrefix") }} ( namespaceURI ) String All
{{ domxref("Element.mozMatchesSelector","mozMatchesSelector") }}( selector )
Returns whether or not the element would be selected by the specified selector string.
Boolean All
{{ domxref("Element.mozRequestFullScreen", "mozRequestFullScreen") }}( ) {{ non-standard_inline() }}
Asynchronously asks the browser to make the element full-screen.
- All
{{ domxref("Node.normalize","normalize") }}()
Clean up all the text nodes under this element (merge adjacent, remove empty).
- All
{{ domxref("Element.querySelector","querySelector") }}( selectors[, nsresolver] ) {{ fx_minversion_inline("3.5") }} {{ domxref("Node") }} All
{{ domxref("Element.querySelectorAll","querySelectorAll") }}( selectors[, nsresolver] ){{ fx_minversion_inline("3.5") }} {{ domxref("NodeList") }} All
{{ domxref("element.removeAttribute","removeAttribute") }}( name )
Remove the named attribute from the current node.
- All
{{ domxref("element.removeAttributeNS","removeAttributeNS") }}( namespace, name )
Remove the attribute with the specified name and namespace, from the current node.
- All
Name & Description Return Availability
{{ domxref("element.removeAttributeNode","removeAttributeNode") }}( {{ domxref("Attr","attrNode") }} )
Remove the node representation of the named attribute from the current node.
- All
{{ domxref("Node.removeChild","removeChild") }}( {{ domxref("Node","removedNode") }} )
Removes a child node from the current element.
{{ domxref("Node") }} All
{{ domxref("element.removeEventListener","removeEventListener") }}( type, handler, useCapture )
Removes an event listener from the element.
- {{ domxref("event","All") }}
{{ domxref("Node.replaceChild","replaceChild") }}( {{ domxref("Node","insertedNode") }}, {{ domxref("Node","replacedNode") }} )
Replaces one child node in the current element with another.
{{ domxref("Node") }} All
{{ domxref("element.scrollIntoView","scrollIntoView") }}( alignWithTop )
Scrolls the page until the element gets into the view.
- HTML
{{ domxref("element.setAttribute","setAttribute") }}( name, value )
Set the value of the named attribute from the current node.
- All
{{ domxref("element.setAttributeNS","setAttributeNS") }}( namespace, name, value )
Set the value of the attribute with the specified name and namespace, from the current node.
- All
{{ domxref("element.setAttributeNode","setAttributeNode") }}( name, {{ domxref("Attr","attrNode") }} )
Set the node representation of the named attribute from the current node.
- All
{{ domxref("element.setAttributeNodeNS","setAttributeNodeNS") }}( namespace, name, {{ domxref("Attr","attrNode") }} )
Set the node representation of the attribute with the specified name and namespace, from the current node.
- All
{{ domxref("element.setCapture","setCapture") }}( retargetToElement )
Sets up mouse event capture, redirecting all mouse events to this element.
- All

{{ domxref("element.setIdAttribute","setIdAttribute") }} (name, isIdBoolean)
Sets the attribute to be treated as an ID type attribute.

- Not supported
{{ domxref("element.setIdAttributeNS","setIdAttributeNS") }} ( namespaceURI, localName, isIdBoolean )
Sets the attribute to be treated as an ID type attribute.
- Not supported
{{ domxref("element.setIdAttributeNode","setIdAttributeNode") }} ( idAttr, isIdBoolean )
Sets the attribute to be treated as an ID type attribute.
- Not supported
{{ domxref("Node.setUserData","setUserData") }} ( key, {{ domxref("DOMUserData","data") }}, handler ) {{ domxref("DOMUserData") }} All
{{ domxref("Element.insertAdjacentHTML","insertAdjacentHTML") }} ( {{ domxref("DOMString","position") }}, {{ domxref("DOMString","text") }} )
Parses the text as HTML or XML and inserts the resulting nodes into the tree in the position given.
- All

Event handlers

These are properties that correspond to the HTML 'on' event attributes.

Unlike the corresponding attributes, the values of these properties are functions (or any other object implementing the EventListener interface) rather than a string. In fact, assigning an event attribute in HTML creates a wrapper function around the specified code. For example, given the following HTML:

<div onclick="foo();">click me!</div>

If element is a reference to this div, the value of element.onclick is effectively:

function onclick(event) {
   foo();
}

Note how the {{ domxref("event") }} object is passed as parameter event to this wrapper function.

{{ gecko_callout_heading("9.0") }}

Starting in Gecko 9.0 {{ geckoRelease("9.0") }}, you can now use the syntax if ("onabort" in element) to determine whether or not a given event handler property exists. This is because event handler interfaces have been updated to be proper web IDL interfaces. See DOM event handlers for details.

{{ domxref("element.onafterscriptexecute") }} {{ gecko_minversion_inline("2.0") }} {{ non-standard_inline() }}
The event handling code for the afterscriptexecute event; this is used only for {{ HTMLElement("script") }} elements.
{{ domxref("element.onbeforescriptexecute") }} {{ gecko_minversion_inline("2.0") }} {{ non-standard_inline() }}
The event handling code for the beforescriptexecute event; this is used only for {{ HTMLElement("script") }} elements.
{{ domxref("element.oncopy","oncopy") }} {{ Fx_minversion_inline("3") }}
Returns the event handling code for the copy event.
{{ domxref("element.oncut","oncut") }} {{ Fx_minversion_inline("3") }}
Returns the event handling code for the cut event.
{{ domxref("element.onpaste","onpaste") }} {{ Fx_minversion_inline("3") }}
Returns the event handling code for the paste event.
{{ domxref("element.onbeforeunload","onbeforeunload") }}
Returns the event handling code for the beforeunload event.
{{ domxref("element.onblur","onblur") }}
Returns the event handling code for the blur event.
{{ domxref("element.onchange","onchange") }}
Returns the event handling code for the change event.
{{ domxref("element.onclick","onclick") }}
Returns the event handling code for the click event.
{{ domxref("element.oncontextmenu","oncontextmenu") }}
Returns the event handling code for the contextmenu event.
{{ domxref("element.ondblclick","ondblclick") }}
Returns the event handling code for the dblclick event.
{{ domxref("element.onfocus","onfocus") }}
Returns the event handling code for the focus event.
{{ domxref("element.onkeydown","onkeydown") }}
Returns the event handling code for the keydown event.
{{ domxref("element.onkeypress","onkeypress") }}
Returns the event handling code for the keypress event.
{{ domxref("element.onkeyup","onkeyup") }}
Returns the event handling code for the keyup event.
{{ domxref("element.onmousedown","onmousedown") }}
Returns the event handling code for the mousedown event.
{{ domxref("element.onmousemove","onmousemove") }}
Returns the event handling code for the mousemove event.
{{ domxref("element.onmouseout","onmouseout") }}
Returns the event handling code for the mouseout event.
{{ domxref("element.onmouseover","onmouseover") }}
Returns the event handling code for the mouseover event.
{{ domxref("element.onmouseup","onmouseup") }}
Returns the event handling code for the mouseup event.
{{ domxref("element.onresize","onresize") }}
Returns the event handling code for the resize event.
{{ domxref("element.onscroll","onscroll") }}
Returns the event handling code for the scroll event.

Other Events

There are also other DOM Events like DOMSubtreeModified, DOMAttrModified etc. as well as Gecko-Specific DOM Events like DOMContentLoaded, DOMTitleChanged etc.

Constants

See {{ domxref("Node") }} for those constants which Element inherits.

{{ languages( { "de": "de/DOM/element", "es": "es/DOM/element", "fr": "fr/DOM/element", "ja": "ja/DOM/element", "pl": "pl/DOM/element", "pt": "pt/DOM/element", "zh-cn": "cn/DOM/element" } ) }}

Revision Source

<p>{{ DomRef() }}</p>
<p>This chapter provides a brief reference for the general methods, properties, and events available to most HTML and XML elements in the Gecko DOM.</p>
<p>Various W3C specifications apply to elements:</p>
<ul> <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Core/">DOM Core Specification</a>—describes the core interfaces shared by most DOM objects in HTML and XML documents</li> <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-HTML/">DOM HTML Specification</a>—describes interfaces for objects in HTML and XHTML documents that build on the core specification</li> <li><a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/">DOM Events Specification</a>—describes events shared by most DOM objects, building on the DOM Core and <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Views/">Views</a> specifications</li> <li><a class="external" href="http://www.w3.org/TR/ElementTraversal/" title="http://www.w3.org/TR/ElementTraversal/">Element Traversal Specification</a>—describes the new attributes that allow traversal of elements in the DOM tree {{ fx_minversion_inline("3.5") }}</li>
</ul>
<p>The articles listed here span the above and include links to the appropriate W3C DOM specification.</p>
<p>While these interfaces are generally shared by most HTML and XML elements, there are more specialized interfaces for particular objects listed in the DOM HTML Specification. Note, however, that these HTML interfaces are "only for [HTML 4.01] and [XHTML 1.0] documents and are not guaranteed to work with any future version of XHTML." The HTML 5 draft does state it aims for backwards compatibility with these HTML interfaces but says of them that "some features that were formerly deprecated, poorly supported, rarely used or considered unnecessary have been removed." One can avoid the potential conflict by moving entirely to DOM XML attribute methods such as <code>getAttribute()</code>.</p>
<p>{{ domxref("HTMLHtmlElement","Html") }}, {{ domxref("HTMLHeadElement","Head") }}, {{ domxref("HTMLLinkElement","Link") }}, {{ domxref("HTMLTitleElement","Title") }}, {{ domxref("HTMLMetaElement","Meta") }}, {{ domxref("HTMLBaseElement","Base") }}, {{ domxref("HTMLIsIndexElement","IsIndex") }}, {{ domxref("HTMLStyleElement","Style") }}, {{ domxref("HTMLBodyElement","Body") }}, {{ domxref("HTMLFormElement","Form") }}, {{ domxref("HTMLSelectElement","Select") }}, {{ domxref("HTMLOptGroupElement","OptGroup") }}, <a href="/en/HTML/Element/HTMLOptionElement" title="en/HTML/Element/HTMLOptionElement">Option</a>, {{ domxref("HTMLInputElement","Input") }}, {{ domxref("HTMLTextAreaElement","TextArea") }}, {{ domxref("HTMLButtonElement","Button") }}, {{ domxref("HTMLLabelElement","Label") }}, {{ domxref("HTMLFieldSetElement","FieldSet") }}, {{ domxref("HTMLLegendElement","Legend") }}, {{ domxref("HTMLUListElement","UList") }}, {{ domxref("OList") }}, {{ domxref("DList") }}, {{ domxref("Directory") }}, {{ domxref("Menu") }}, {{ domxref("LI") }}, {{ domxref("Div") }}, {{ domxref("Paragraph") }}, {{ domxref("Heading") }}, {{ domxref("Quote") }}, {{ domxref("Pre") }}, {{ domxref("BR") }}, {{ domxref("BaseFont") }}, {{ domxref("Font") }}, {{ domxref("HR") }}, {{ domxref("Mod") }}, {{ domxref("HTMLAnchorElement","Anchor") }}, {{ domxref("Image") }}, {{ domxref("HTMLObjectElement","Object") }}, {{ domxref("Param") }}, {{ domxref("Applet") }}, {{ domxref("Map") }}, {{ domxref("Area") }}, {{ domxref("Script") }}, {{ domxref("HTMLTableElement","Table") }}, {{ domxref("TableCaption") }}, {{ domxref("TableCol") }}, {{ domxref("TableSection") }}, {{ domxref("HTMLTableRowElement","TableRow") }}, {{ domxref("TableCell") }}, {{ domxref("FrameSet") }}, {{ domxref("Frame") }}, {{ domxref("HTMLIFrameElement","IFrame") }}</p>
<h3 name="Properties">Properties</h3>
<table class="fullwidth-table"> <tbody> <tr> <th>Name</th> <th>Description</th> <th>Type</th> <th>Availability</th> </tr> <tr> <td><code>{{ domxref("Node.attributes","attributes") }}</code></td> <td>All attributes associated with an element.</td> <td><code>{{ domxref("NamedNodeMap") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.baseURI","baseURI") }}</code></td> <td>Base URI as a string</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("element.baseURIObject","baseURIObject") }}</code> {{ Fx_minversion_inline("3") }}</td> <td>The read-only {{ Interface("nsIURI") }} object representing the base URI for the element.</td> <td>{{ Interface("nsIURI") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a> (with UniversalXPConnect privileges)</small></td> </tr> <tr> <td>{{ domxref("Element.childElementCount","childElementCount") }} {{ fx_minversion_inline("3.5") }}</td> <td>The number of child nodes that are elements.</td> <td><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></td> <td nowrap="nowrap"> <p><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></p> </td> </tr> <tr> <td><code>{{ domxref("Node.childNodes","childNodes") }}</code></td> <td>All child nodes of an element. <p>A live {{ interface("nsIDOMNodeList") }} of the current child elements.</p> </td> <td><code>{{ domxref("NodeList") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Element.children","children") }} {{ gecko_minversion_inline("1.9") }}</td> <td><br> <p>All child nodes of an element as a collection.</p> </td> <td><code>{{ domxref("HTMLCollection") }}</code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td>{{ domxref("element.classList","classList") }} {{ gecko_minversion_inline("1.9.2") }}</td> <td>Token list of class attribute</td> <td>{{ domxref("DOMTokenList") }}</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.className","className") }}</code></td> <td>Gets/sets the class of the element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("element.clientHeight","clientHeight") }}</code></td> <td>The inner height of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.clientLeft","clientLeft") }}</code></td> <td>The width of the left border of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.clientTop","clientTop") }}</code></td> <td>The width of the top border of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.clientWidth","clientWidth") }}</code></td> <td>The inner width of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td>{{ domxref("Element.contentEditable","contentEditable") }} {{ gecko_minversion_inline("1.9") }}</td> <td>Gets/sets whether or not the element is editable.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td>{{ domxref("element.dataset","dataset") }}</td> <td>Allows access to read and write custom data attributes on the element.</td> <td>{{ domxref("DOMStringMap") }}</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.dir","dir") }}</code></td> <td>Gets/sets the directionality of the element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.firstChild","firstChild") }}</code></td> <td>The first direct child node of an element, or <code>null</code> if this element has no child nodes.</td> <td><code>{{ domxref("Node") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Element.firstElementChild","firstElementChild") }} {{ gecko_minversion_inline("1.9") }}</td> <td>The first direct child element of an element, or <code>null</code> if the element has no child elements.</td> <td>{{ domxref("Element") }}</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("element.id","id") }}</code></td> <td>Gets/sets the id of the element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("element.innerHTML","innerHTML") }}</code></td> <td>Gets/sets the markup of the element's content.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td>{{ domxref("Element.isContentEditable","isContentEditable") }} {{ gecko_minversion_inline("2") }}</td> <td>Indicates whether or not the content of the element can be edited. Read only.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core JavaScript 1.5 Reference/Global Objects/Boolean"><code>Boolean</code></a></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("element.lang","lang") }}</code></td> <td>Gets/sets the language of an element's attributes, text, and element contents.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.lastChild","lastChild") }}</code></td> <td>The last direct child node of an element, or <code>null</code> if this element has no child nodes.</td> <td><code>{{ domxref("Node") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Element.lastElementChild","lastElementChild") }} {{ gecko_minversion_inline("1.9") }}</td> <td>The last direct child element of an element, or <code>null</code> if the element has no child elements.</td> <td>{{ domxref("Element") }}</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.localName","localName") }}</code></td> <td>The local part of the qualified name of an element. In Firefox 3.5 and earlier, the property upper-cases the local name for HTML elements (but not XHTML elements). In later versions, this does not happen, so the property is in lower case for both HTML and XHTML. {{ gecko_minversion_inline("1.9.2") }}</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <th>Name</th> <th>Description</th> <th>Type</th> <th>Availability</th> </tr> <tr> <td><code>{{ domxref("element.name","name") }}</code></td> <td>Gets/sets the name attribute of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.namespaceURI","namespaceURI") }}</code></td> <td>The namespace URI of this node, or <code>null</code> if it is no namespace. In Firefox 3.5 and earlier, HTML elements are in no namespace. In later versions, HTML elements are in the <code><a class="linkification-ext external" href="http://www.w3.org/1999/xhtml" title="Linkification: http://www.w3.org/1999/xhtml">http://www.w3.org/1999/xhtml</a></code> namespace in both HTML and XML trees. {{ gecko_minversion_inline("1.9.2") }}</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.nextSibling","nextSibling") }}</code></td> <td>The node immediately following the given one in the tree, or <code>null</code> if there is no sibling node.</td> <td><code>{{ domxref("Node") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Element.nextElementSibling","nextElementSibling") }} {{ fx_minversion_inline("3.5") }}</td> <td>The element immediately following the given one in the tree, or <code>null</code> if there's no sibling node.</td> <td>{{ domxref("Element") }}</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.nodeName","nodeName") }}</code></td> <td>The name of the node.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.nodePrincipal","nodePrincipal") }} </code>{{ Fx_minversion_inline("3") }}</td> <td>The node's principal.</td> <td><code>{{ Interface("nsIPrincipal") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a> (with UniversalXPConnect privileges)</small></td> </tr> <tr> <td><code>{{ domxref("Node.nodeType","nodeType") }}</code></td> <td>A number representing the type of the node. Is always equal to <code>1</code> for DOM elements.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.nodeValue","nodeValue") }}</code></td> <td>The value of the node. Is always equal to <code>null</code> for DOM elements.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.offsetHeight","offsetHeight") }}</code></td> <td>The height of an element, relative to the layout.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.offsetLeft","offsetLeft") }}</code></td> <td>The distance from this element's left border to its <code>offsetParent</code>'s left border.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.offsetParent","offsetParent") }}</code></td> <td>The element from which all offset calculations are currently computed.</td> <td><code>{{ domxref("Element") }}</code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.offsetTop","offsetTop") }}</code></td> <td>The distance from this element's top border to its <code>offsetParent</code>'s top border.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.offsetWidth","offsetWidth") }}</code></td> <td>The width of an element, relative to the layout.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.outerHTML","outerHTML") }}</code><br> {{ gecko_minversion_inline("11") }}</td> <td>Gets the markup of the element including its content. When used as a setter, replaces the element with nodes parsed from the given string.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.ownerDocument","ownerDocument") }}</code></td> <td>The document that this node is in, or <code>null</code> if the node is not inside of one.</td> <td><code>{{ domxref("Document") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <th>Name</th> <th>Description</th> <th>Type</th> <th>Availability</th> </tr> <tr> <td><code>{{ domxref("Node.parentNode","parentNode") }}</code></td> <td>The parent element of this node, or <code>null</code> if the node is not inside of a {{ domxref("document","DOM Document") }}.</td> <td><code>{{ domxref("Node") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.prefix","prefix") }}</code></td> <td>The namespace prefix of the node, or <code>null</code> if no prefix is specified.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.previousSibling","previousSibling") }}</code></td> <td>The node immediately preceding the given one in the tree, or <code>null</code> if there is no sibling node.</td> <td><code>{{ domxref("Node") }}</code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Element.previousElementSibling","previousElementSibling") }} {{ fx_minversion_inline("3.5") }}</td> <td>The element immediately preceding the given one in the tree, or <code>null</code> if there is no sibling element.</td> <td>{{ domxref("Element") }}</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td>{{ domxref("element.schemaTypeInfo","schemaTypeInfo") }}</td> <td>Returns TypeInfo regarding schema information for the element (also available on {{ domxref("Attr") }}).</td> <td>{{ domxref("TypeInfo") }}</td> <td nowrap="nowrap">Not supported</td> </tr> <tr> <td><code>{{ domxref("element.scrollHeight","scrollHeight") }}</code></td> <td>The scroll view height of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.scrollLeft","scrollLeft") }}</code></td> <td>Gets/sets the left scroll offset of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.scrollTop","scrollTop") }}</code></td> <td>Gets/sets the top scroll offset of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.scrollWidth","scrollWidth") }}</code></td> <td>The scroll view width of an element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code><a class="internal" href="/en/XUL/Attribute/spellcheck" title="En/XUL/Attribute/Spellcheck">spellcheck</a></code></td> <td>Controls <a href="/en/HTML/Controlling_spell_checking_in_HTML_forms" title="en/Controlling_spell_checking_in_HTML_forms">spell-checking</a> (present on all HTML elements)</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.style","style") }}</code></td> <td>An object representing the declarations of an element's style attributes.</td> <td><code>{{ domxref("CSSStyleDeclaration") }}</code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("element.tabIndex","tabIndex") }}</code></td> <td>Gets/sets the position of the element in the tabbing order.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.tagName","tagName") }}</code></td> <td>The name of the tag for the given element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.textContent","textContent") }}</code></td> <td>Gets/sets the textual contents of an element and all its descendants.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.title","title") }}</code></td> <td>A string that appears in a popup box when mouse is over the element.</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> </tbody>
</table>
<h3 name="Methods">Methods</h3>
<table class="fullwidth-table"> <tbody> <tr> <th>Name &amp; Description</th> <th>Return</th> <th>Availability</th> </tr> <tr> <td><code>{{ domxref("element.addEventListener","addEventListener") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">type</a>, <a href="/en/JavaScript/Reference/Global_Objects/Function" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Function">listener</a>, <a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">useCapture</a> )</code><br> Register an event handler to a specific event type on the element.</td> <td>-</td> <td nowrap="nowrap"><small>{{ domxref("event","All") }}</small></td> </tr> <tr> <td><code>{{ domxref("Node.appendChild","appendChild") }}( {{ domxref("Node","appendedNode") }} )</code><br> Insert a node as the last child node of this element.</td> <td>{{ domxref("Node") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.blur","blur") }}()</code><br> Removes keyboard focus from the current element.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("element.click","click") }}()</code><br> Simulates a click on the current element.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.cloneNode","cloneNode") }}( <a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">deep</a> )</code><br> Clone a node, and optionally, all of its contents.</td> <td>{{ domxref("Node") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.compareDocumentPosition","compareDocumentPosition") }}</code> ( <code>{{ domxref("Node","otherNode") }}</code> )</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/Number" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Number">Number</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.dispatchEvent","dispatchEvent") }}( {{ domxref("event") }} )</code><br> Dispatch an event to this node in the DOM.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.focus","focus") }}()</code><br> Gives keyboard focus to the current element.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a>, <a href="/en/XUL" title="en/XUL">XUL</a></small></td> </tr> <tr> <td><code>{{ domxref("element.getAttribute","getAttribute") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Retrieve the value of the named attribute from the current node.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Object">Object</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.getAttributeNS","getAttributeNS") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">namespace</a>, <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Retrieve the value of the attribute with the specified name and namespace, from the current node.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Object">Object</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.getAttributeNode","getAttributeNode") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Retrieve the node representation of the named attribute from the current node.</td> <td>{{ domxref("Attr") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.getAttributeNodeNS","getAttributeNodeNS") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">namespace</a>, <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Retrieve the node representation of the attribute with the specified name and namespace, from the current node.</td> <td>{{ domxref("Attr") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("element.getBoundingClientRect","getBoundingClientRect") }} ( )</td> <td> </td> <td nowrap="nowrap"> </td> </tr> <tr> <td> <p>{{ domxref("element.getClientRects","getClientRects") }} ( )<br> Returns a collection of rectangles that indicate the bounding rectangles for each line of text in a client.</p> </td> <td> </td> <td nowrap="nowrap"> </td> </tr> <tr> <th>Name &amp; Description</th> <th>Return</th> <th>Availability</th> </tr> <tr> <td>{{ domxref("Element.getElementsByClassName","getElementsByClassName") }}( )</td> <td><code>{{ domxref("NodeList") }}</code></td> <td nowrap="nowrap"> </td> </tr> <tr> <td><code>{{ domxref("element.getElementsByTagName","getElementsByTagName") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Retrieve a set of all descendant elements, of a particular tag name, from the current element.</td> <td>{{ domxref("NodeList") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.getElementsByTagNameNS","getElementsByTagNameNS") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">namespace</a>, <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Retrieve a set of all descendant elements, of a particular tag name and namespace, from the current element.</td> <td>{{ domxref("NodeList") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Node.getFeature","getFeature") }} ( <code>feature</code>, <code>version</code> )</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Object">Object</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Node.getUserData","getUserData") }} ( <code>key</code> )</td> <td>{{ domxref("DOMUserData") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.hasAttribute","hasAttribute") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Check if the element has the specified attribute, or not.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.hasAttributeNS","hasAttributeNS") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">namespace</a>, <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Check if the element has the specified attribute, in the specified namespace, or not.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.hasAttributes","hasAttributes") }}()</code><br> Check if the element has any attributes, or not.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.hasChildNodes","hasChildNodes") }}()</code><br> Check if the element has any child nodes, or not.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.insertBefore","insertBefore") }}( {{ domxref("Node","insertedNode") }}, {{ domxref("Node","adjacentNode") }} )</code><br> Inserts the first node before the second, child, Node in the DOM.</td> <td>{{ domxref("Node") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.isDefaultNamespace","isDefaultNamespace") }}</code> ( <code>namespaceURI</code> )</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Node.isEqualNode","isEqualNode") }} ( <code>{{ domxref("Node","nodeArg") }}</code> )</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.isSameNode","isSameNode") }}</code> ( <code>{{ domxref("Node","otherNode") }}</code> ) </td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.isSupported","isSupported") }} ( feature, version )</code></td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Node.lookupNamespaceURI","lookupNamespaceURI") }} ( <code>prefix</code> )</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Node.lookupPrefix","lookupPrefix") }} ( <code>namespaceURI</code> )</td> <td><code><a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">String</a></code></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Element.mozMatchesSelector","mozMatchesSelector") }}( selector )</code><br> Returns whether or not the element would be selected by the specified selector string.</td> <td><a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">Boolean</a></td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Element.mozRequestFullScreen", "mozRequestFullScreen") }}( ) {{ non-standard_inline() }}<br> Asynchronously asks the browser to make the element full-screen.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.normalize","normalize") }}()</code><br> Clean up all the text nodes under this element (merge adjacent, remove empty).</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Element.querySelector","querySelector") }}( selectors[, nsresolver] )</code> {{ fx_minversion_inline("3.5") }}</td> <td>{{ domxref("Node") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Element.querySelectorAll","querySelectorAll") }}( selectors[, nsresolver] )</code>{{ fx_minversion_inline("3.5") }}</td> <td>{{ domxref("NodeList") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.removeAttribute","removeAttribute") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Remove the named attribute from the current node.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.removeAttributeNS","removeAttributeNS") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">namespace</a>, <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a> )</code><br> Remove the attribute with the specified name and namespace, from the current node.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <th>Name &amp; Description</th> <th>Return</th> <th>Availability</th> </tr> <tr> <td><code>{{ domxref("element.removeAttributeNode","removeAttributeNode") }}( {{ domxref("Attr","attrNode") }} )</code><br> Remove the node representation of the named attribute from the current node.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("Node.removeChild","removeChild") }}( {{ domxref("Node","removedNode") }} )</code><br> Removes a child node from the current element.</td> <td>{{ domxref("Node") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.removeEventListener","removeEventListener") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">type</a>, <a href="/en/JavaScript/Reference/Global_Objects/Function" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Function">handler</a>, <a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">useCapture</a> )</code><br> Removes an event listener from the element.</td> <td>-</td> <td nowrap="nowrap"><small>{{ domxref("event","All") }}</small></td> </tr> <tr> <td><code>{{ domxref("Node.replaceChild","replaceChild") }}( {{ domxref("Node","insertedNode") }}, {{ domxref("Node","replacedNode") }} )</code><br> Replaces one child node in the current element with another.</td> <td>{{ domxref("Node") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.scrollIntoView","scrollIntoView") }}( <a href="/en/JavaScript/Reference/Global_Objects/Boolean" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Boolean">alignWithTop</a> )</code><br> Scrolls the page until the element gets into the view.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/HTML" title="en/HTML">HTML</a></small></td> </tr> <tr> <td><code>{{ domxref("element.setAttribute","setAttribute") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a>, <a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Object">value</a> )</code><br> Set the value of the named attribute from the current node.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.setAttributeNS","setAttributeNS") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">namespace</a>, <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a>, <a href="/en/JavaScript/Reference/Global_Objects/Object" title="en/Core_JavaScript_1.5_Reference/Global_Objects/Object">value</a> )</code><br> Set the value of the attribute with the specified name and namespace, from the current node.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.setAttributeNode","setAttributeNode") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a>, {{ domxref("Attr","attrNode") }} )</code><br> Set the node representation of the named attribute from the current node.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.setAttributeNodeNS","setAttributeNodeNS") }}( <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">namespace</a>, <a href="/En/Core_JavaScript_1.5_Reference/Global_Objects/String" title="en/Core_JavaScript_1.5_Reference/Global_Objects/String">name</a>, {{ domxref("Attr","attrNode") }} )</code><br> Set the node representation of the attribute with the specified name and namespace, from the current node.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td><code>{{ domxref("element.setCapture","setCapture") }}( retargetToElement )</code><br> Sets up mouse event capture, redirecting all mouse events to this element.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td> <p>{{ domxref("element.setIdAttribute","setIdAttribute") }} (<code>name</code>, <code>isIdBoolean</code>)<br> Sets the attribute to be treated as an ID type attribute.</p> </td> <td>-</td> <td nowrap="nowrap">Not supported</td> </tr> <tr> <td>{{ domxref("element.setIdAttributeNS","setIdAttributeNS") }} ( <code>namespaceURI</code>, <code>localName</code>, <code>isIdBoolean</code> )<br> Sets the attribute to be treated as an ID type attribute.</td> <td>-</td> <td nowrap="nowrap">Not supported</td> </tr> <tr> <td>{{ domxref("element.setIdAttributeNode","setIdAttributeNode") }} ( <code>idAttr</code>, <code>isIdBoolean</code> )<br> Sets the attribute to be treated as an ID type attribute.</td> <td>-</td> <td nowrap="nowrap">Not supported</td> </tr> <tr> <td>{{ domxref("Node.setUserData","setUserData") }} ( <code>key</code>, {{ domxref("DOMUserData","data") }}, <code>handler</code> )</td> <td>{{ domxref("DOMUserData") }}</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> <tr> <td>{{ domxref("Element.insertAdjacentHTML","insertAdjacentHTML") }} ( {{ domxref("DOMString","position") }}, {{ domxref("DOMString","text") }} )<br> Parses the text as HTML or XML and inserts the resulting nodes into the tree in the position given.</td> <td>-</td> <td nowrap="nowrap"><small><a href="/en/DOM" title="en/DOM">All</a></small></td> </tr> </tbody>
</table>
<h3 name="Event_Handlers">Event handlers</h3>
<p>These are properties that correspond to the HTML 'on' event attributes.</p>
<p>Unlike the corresponding attributes, the values of these properties are functions (or any other object implementing the <a class="external" href="http://www.w3.org/TR/DOM-Level-2-Events/events.html#Events-EventListener">EventListener</a> interface) rather than a string. In fact, assigning an event attribute in HTML creates a wrapper function around the specified code. For example, given the following HTML:</p>
<pre>&lt;div onclick="foo();"&gt;click me!&lt;/div&gt;
</pre>
<p>If <code>element</code> is a reference to this <code>div</code>, the value of <code>element.onclick</code> is effectively:</p>
<pre>function onclick(event) {
   foo();
}
</pre>
<p>Note how the {{ domxref("event") }} object is passed as parameter <code>event</code> to this wrapper function.</p>
<div class="geckoVersionNote" style="undefined"> <p>{{ gecko_callout_heading("9.0") }}</p> <p>Starting in Gecko 9.0 {{ geckoRelease("9.0") }}, you can now use the syntax <code>if ("onabort" in element)</code> to determine whether or not a given event handler property exists. This is because event handler interfaces have been updated to be proper web IDL interfaces. See <a href="/en/DOM/DOM_event_handlers" title="en/DOM/DOM event handlers">DOM event handlers</a> for details.</p>
</div>
<dl> <dt>{{ domxref("element.onafterscriptexecute") }} {{ gecko_minversion_inline("2.0") }} {{ non-standard_inline() }}</dt> <dd>The event handling code for the <code>afterscriptexecute</code> event; this is used only for {{ HTMLElement("script") }} elements.</dd> <dt>{{ domxref("element.onbeforescriptexecute") }} {{ gecko_minversion_inline("2.0") }} {{ non-standard_inline() }}</dt> <dd>The event handling code for the <code>beforescriptexecute</code> event; this is used only for {{ HTMLElement("script") }} elements.</dd> <dt>{{ domxref("element.oncopy","oncopy") }} {{ Fx_minversion_inline("3") }}</dt> <dd>Returns the event handling code for the copy event.</dd>
</dl>
<dl> <dt>{{ domxref("element.oncut","oncut") }} {{ Fx_minversion_inline("3") }}</dt> <dd>Returns the event handling code for the cut event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onpaste","onpaste") }} {{ Fx_minversion_inline("3") }}</dt> <dd>Returns the event handling code for the paste event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onbeforeunload","onbeforeunload") }}</dt> <dd>Returns the event handling code for the beforeunload event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onblur","onblur") }}</dt> <dd>Returns the event handling code for the blur event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onchange","onchange") }}</dt> <dd>Returns the event handling code for the change event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onclick","onclick") }}</dt> <dd>Returns the event handling code for the click event.</dd>
</dl>
<dl> <dt>{{ domxref("element.oncontextmenu","oncontextmenu") }}</dt> <dd>Returns the event handling code for the contextmenu event.</dd>
</dl>
<dl> <dt>{{ domxref("element.ondblclick","ondblclick") }}</dt> <dd>Returns the event handling code for the dblclick event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onfocus","onfocus") }}</dt> <dd>Returns the event handling code for the focus event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onkeydown","onkeydown") }}</dt> <dd>Returns the event handling code for the keydown event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onkeypress","onkeypress") }}</dt> <dd>Returns the event handling code for the keypress event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onkeyup","onkeyup") }}</dt> <dd>Returns the event handling code for the keyup event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onmousedown","onmousedown") }}</dt> <dd>Returns the event handling code for the mousedown event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onmousemove","onmousemove") }}</dt> <dd>Returns the event handling code for the mousemove event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onmouseout","onmouseout") }}</dt> <dd>Returns the event handling code for the mouseout event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onmouseover","onmouseover") }}</dt> <dd>Returns the event handling code for the mouseover event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onmouseup","onmouseup") }}</dt> <dd>Returns the event handling code for the mouseup event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onresize","onresize") }}</dt> <dd>Returns the event handling code for the resize event.</dd>
</dl>
<dl> <dt>{{ domxref("element.onscroll","onscroll") }}</dt> <dd>Returns the event handling code for the scroll event.</dd>
</dl>
<h3 name="Other_Events">Other Events</h3>
<p>There are also other <a href="/en/DOM/DOM_event_reference" title="en/DOM_Events">DOM Events</a> like <code>DOMSubtreeModified</code>, <code>DOMAttrModified</code> etc. as well as <a href="/en/Gecko-Specific_DOM_Events" title="en/Gecko-Specific_DOM_Events">Gecko-Specific DOM Events</a> like <code>DOMContentLoaded</code>, <code>DOMTitleChanged</code> etc.</p>
<h3>Constants</h3>
<p>See {{ domxref("Node") }} for those constants which Element inherits.</p>
<p>{{ languages( { "de": "de/DOM/element", "es": "es/DOM/element", "fr": "fr/DOM/element", "ja": "ja/DOM/element", "pl": "pl/DOM/element", "pt": "pt/DOM/element", "zh-cn": "cn/DOM/element" } ) }}</p>
Revert to this revision