diff options
author | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:43:23 -0500 |
---|---|---|
committer | Peter Bengtsson <mail@peterbe.com> | 2020-12-08 14:43:23 -0500 |
commit | 218934fa2ed1c702a6d3923d2aa2cc6b43c48684 (patch) | |
tree | a9ef8ac1e1b8fe4207b6d64d3841bfb8990b6fd0 /files/zh-tw/web/api/element/index.html | |
parent | 074785cea106179cb3305637055ab0a009ca74f2 (diff) | |
download | translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.tar.gz translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.tar.bz2 translated-content-218934fa2ed1c702a6d3923d2aa2cc6b43c48684.zip |
initial commit
Diffstat (limited to 'files/zh-tw/web/api/element/index.html')
-rw-r--r-- | files/zh-tw/web/api/element/index.html | 674 |
1 files changed, 674 insertions, 0 deletions
diff --git a/files/zh-tw/web/api/element/index.html b/files/zh-tw/web/api/element/index.html new file mode 100644 index 0000000000..d363baeead --- /dev/null +++ b/files/zh-tw/web/api/element/index.html @@ -0,0 +1,674 @@ +--- +title: Element +slug: Web/API/Element +tags: + - API + - DOM + - DOM Reference + - Element + - NeedsTranslation + - TopicStub + - Élément(2) +translation_of: Web/API/Element +--- +<p>{{ APIRef("DOM") }}</p> + +<p><span class="seoSummary"><strong><code>Element</code></strong> 介面表示了一個在 {{domxref("Document")}} 中的物件,其描述了各類型元素的共同屬性與方法,<code>Element</code> 的子介面則定義了不同類型元素的具體行為並增加額外的功能。</span>例如 {{domxref("HTMLElement")}} 為所有 HTML 元素的基礎介面,而 {{domxref("SVGElement")}} 則是定義所有 SVG 元素的介面。</p> + +<p>在 Web 領域之外,如 XUL 語言也能藉由 <code>XULElement</code> 介面來繼承 <code>Element</code>。</p> + +<p>{{InheritanceDiagram}}</p> + +<h2 id="Properties" name="Properties">屬性</h2> + +<p><em>Inherits properties from its parent interface, {{domxref("Node")}}, and by extension that interface's parent, {{domxref("EventTarget")}}. It implements the properties of {{domxref("ParentNode")}}, {{domxref("ChildNode")}}, {{domxref("NonDocumentTypeChildNode")}}, </em>and {{domxref("Animatable")}}.</p> + +<dl> + <dt>{{ domxref("Element.assignedSlot")}} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns the {{domxref("HTMLSlotElement")}} interface associated with the element.</dd> + <dt>{{ domxref("Element.attributes") }} {{readOnlyInline}}</dt> + <dd>Returns a {{ domxref("NamedNodeMap") }} object containing the assigned attributes of the corresponding HTML element.</dd> + <dt>{{ domxref("Element.classList") }} {{readOnlyInline}}</dt> + <dd>Returns a {{ domxref("DOMTokenList") }} containing the list of class attributes.</dd> + <dt>{{ domxref("Element.className") }}</dt> + <dd>Is a {{domxref("DOMString")}} representing the class of the element.</dd> + <dt>{{ domxref("Element.clientHeight") }} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the inner height of the element.</dd> + <dt>{{ domxref("Element.clientLeft") }} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the width of the left border of the element.</dd> + <dt>{{ domxref("Element.clientTop") }} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the width of the top border of the element.</dd> + <dt>{{ domxref("Element.clientWidth") }} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the inner width of the element.</dd> + <dt>{{domxref("Element.computedName")}} {{readOnlyInline}}</dt> + <dd>Returns a {{domxref("DOMString")}} containing the label exposed to accessibility.</dd> + <dt>{{domxref("Element.computedRole")}} {{readOnlyInline}}</dt> + <dd>Returns a {{domxref("DOMString")}} containing the ARIA role that has been applied to a particular element.</dd> + <dt>{{ domxref("Element.id") }}</dt> + <dd>Is a {{domxref("DOMString")}} representing the id of the element.</dd> + <dt>{{ domxref("Element.innerHTML") }}</dt> + <dd>Is a {{domxref("DOMString")}} representing the markup of the element's content.</dd> + <dt>{{ domxref("Element.localName") }} {{readOnlyInline}}</dt> + <dd>A {{domxref("DOMString")}} representing the local part of the qualified name of the element.</dd> + <dt>{{domxref("Element.namespaceURI")}} {{readonlyInline}}</dt> + <dd>The namespace URI of the element, or <code>null</code> if it is no namespace. + <div class="note"> + <p><strong>Note:</strong> 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") }}</p> + </div> + </dd> + <dt>{{ domxref("NonDocumentTypeChildNode.nextElementSibling") }} {{readOnlyInline}}</dt> + <dd>Is a {{ domxref("Element") }}, the element immediately following the given one in the tree, or <code>null</code> if there's no sibling node.</dd> + <dt>{{ domxref("Element.outerHTML") }} {{experimental_inline}}</dt> + <dd>Is a {{domxref("DOMString")}} representing the markup of the element including its content. When used as a setter, replaces the element with nodes parsed from the given string.</dd> + <dt>{{ domxref("Element.prefix") }} {{readOnlyInline}}</dt> + <dd>A {{domxref("DOMString")}} representing the namespace prefix of the element, or <code>null</code> if no prefix is specified.</dd> + <dt>{{ domxref("NonDocumentTypeChildNode.previousElementSibling") }} {{readOnlyInline}}</dt> + <dd>Is a {{ domxref("Element") }}, the element immediately preceding the given one in the tree, or <code>null</code> if there is no sibling element.</dd> + <dt>{{ domxref("Element.scrollHeight") }} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the scroll view height of an element.</dd> + <dt>{{ domxref("Element.scrollLeft") }} {{experimental_inline}}</dt> + <dd>Is a {{jsxref("Number")}} representing the left scroll offset of the element.</dd> + <dt>{{ domxref("Element.scrollLeftMax") }} {{non-standard_inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the maximum left scroll offset possible for the element.</dd> + <dt>{{ domxref("Element.scrollTop") }} {{experimental_inline}}</dt> + <dd>Is a {{jsxref("Number")}} representing the top scroll offset the an element.</dd> + <dt>{{ domxref("Element.scrollTopMax") }} {{non-standard_inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the maximum top scroll offset possible for the element.</dd> + <dt>{{ domxref("Element.scrollWidth") }} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns a {{jsxref("Number")}} representing the scroll view width of the element.</dd> + <dt>{{domxref("Element.shadowRoot") }} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns the youngest shadow root that is hosted by the element.</dd> + <dt>{{domxref("Element.slot")}} {{experimental_inline}}</dt> + <dd>Returns the name of the shadow DOM slot attatched to the element. A slot is a placeholder inside a web component that users can fill with their own markup.</dd> + <dt>{{domxref("Element.tabStop")}} {{non-standard_inline}}</dt> + <dd>Is a {{jsxref("Boolean")}} indicating if the element can receive input focus via the tab key.</dd> + <dt>{{ domxref("Element.tagName") }} {{readOnlyInline}}</dt> + <dd>Returns a {{domxref("String")}} with the name of the tag for the given element.</dd> + <dt>{{ domxref("Element.undoManager")}} {{experimental_inline}} {{readOnlyInline}}</dt> + <dd>Returns the {{domxref("UndoManager")}} associated with the element.</dd> + <dt>{{ domxref("Element.undoScope")}} {{experimental_inline}}</dt> + <dd>Is a {{jsxref("Boolean")}} indicating if the element is an undo scope host, or not.</dd> +</dl> + +<div class="note"> +<p><strong>Note:</strong> DOM Level 3 defined <code>namespaceURI</code>, <code>localName</code> and <code>prefix</code> on the {{domxref("Node")}} interface. In DOM4 they were moved to <code>Element</code>.</p> + +<p>This change is implemented in Chrome since version 46.0 and Firefox since version 48.0.</p> +</div> + +<h3 id="Handlers" name="Handlers">事件處理器</h3> + +<dl> + <dt>{{ domxref("Element.ongotpointercapture") }}</dt> + <dd>Returns the event handler for the {{event("gotpointercapture")}} event type.</dd> + <dt>{{ domxref("Element.onlostpointercapture") }}</dt> + <dd>Returns the event handler for the {{event("lostpointercapture")}} event type.</dd> + <dt>{{ domxref("Element.onwheel") }} {{ non-standard_inline() }}</dt> + <dd>Returns the event handling code for the <code>wheel</code> event.</dd> +</dl> + +<h2 id="Methods" name="Methods">方法</h2> + +<p><em>Inherits methods from its parents {{domxref("Node")}}, and its own parent, {{domxref("EventTarget")}}<em>, and implements those of {{domxref("ParentNode")}}, {{domxref("ChildNode")}}<em>, {{domxref("NonDocumentTypeChildNode")}}, </em></em>and {{domxref("Animatable")}}.</em></p> + +<dl> + <dt>{{ domxref("EventTarget.addEventListener()") }}</dt> + <dd>Registers an event handler to a specific event type on the element.</dd> + <dt>{{domxref("Element.attachShadow()")}} {{experimental_inline}}</dt> + <dd>Attatches a shadow DOM tree to the specified element and returns a reference to its {{domxref("ShadowRoot")}}.</dd> + <dt>{{domxref("Element.animate()")}} {{experimental_inline}}</dt> + <dd>A shortcut method to create and run an animation on an element. Returns the created Animation object instance.</dd> + <dt>{{ domxref("Element.closest()")}} {{experimental_inline}}</dt> + <dd>Returns the {{domxref("Element")}}, descendant of this element (or this element itself), that is the closest ancestor of the elements selected by the selectors given in parameter.</dd> + <dt>{{ domxref("Element.createShadowRoot()")}} {{experimental_inline}} {{deprecated_inline()}}</dt> + <dd>Creates a <a href="/en-US/docs/Web/Web_Components/Shadow_DOM">shadow DOM</a> on on the element, turning it into a shadow host. Returns a {{domxref("ShadowRoot")}}.</dd> + <dt>{{ domxref("EventTarget.dispatchEvent()") }}</dt> + <dd>Dispatches an event to this node in the DOM and returns a {{jsxref("Boolean")}} that indicates that at least one handler has not canceled it.</dd> + <dt>{{domxref("Element.find()")}}{{experimental_inline}}</dt> + <dd>...</dd> + <dt>{{domxref("Element.findAll()")}}{{experimental_inline}}</dt> + <dd>...</dd> + <dt>{{domxref("Element.getAnimations()")}} {{experimental_inline}}</dt> + <dd>Returns an array of Animation objects currently active on the element.</dd> + <dt>{{ domxref("Element.getAttribute()") }}</dt> + <dd>Retrieves the value of the named attribute from the current node and returns it as an {{jsxref("Object")}}.</dd> + <dt>{{ domxref("Element.getAttributeNames()") }}</dt> + <dd> </dd> + <dt>{{ domxref("Element.getAttributeNS()") }}</dt> + <dd>Retrieves the value of the attribute with the specified name and namespace, from the current node and returns it as an {{jsxref("Object")}}.</dd> + <dt>{{ domxref("Element.getAttributeNode()") }} {{obsolete_inline}}</dt> + <dd>Retrieves the node representation of the named attribute from the current node and returns it as an {{ domxref("Attr") }}.</dd> + <dt>{{ domxref("Element.getAttributeNodeNS()") }} {{obsolete_inline}}</dt> + <dd>Retrieves the node representation of the attribute with the specified name and namespace, from the current node and returns it as an {{ domxref("Attr") }}.</dd> + <dt>{{ domxref("Element.getBoundingClientRect()") }}</dt> + <dd>...</dd> + <dt>{{ domxref("Element.getClientRects()") }}</dt> + <dd>Returns a collection of rectangles that indicate the bounding rectangles for each line of text in a client.</dd> + <dt>{{domxref("Element.getDestinationInsertionPoints()")}} {{experimental_inline}}</dt> + <dd>…</dd> + <dt>{{ domxref("Element.getElementsByClassName()") }}</dt> + <dd>Returns a live {{ domxref("HTMLCollection") }} that contains all descendants of the current element that possess the list of classes given in the parameter.</dd> + <dt>{{ domxref("Element.getElementsByTagName()") }}</dt> + <dd>Returns a live {{ domxref("HTMLCollection") }} containing all descendant elements, of a particular tag name, from the current element.</dd> + <dt>{{ domxref("Element.getElementsByTagNameNS()") }}</dt> + <dd>Returns a live {{ domxref("HTMLCollection") }} containing all descendant elements, of a particular tag name and namespace, from the current element.</dd> + <dt>{{ domxref("Element.hasAttribute()") }}</dt> + <dd>Returns a {{jsxref("Boolean")}} indicating if the element has the specified attribute or not.</dd> + <dt>{{ domxref("Element.hasAttributeNS()") }}</dt> + <dd>Returns a {{jsxref("Boolean")}} indicating if the element has the specified attribute, in the specified namespace, or not.</dd> + <dt>{{ domxref("Element.hasAttributes()") }}</dt> + <dd>Returns a {{jsxref("Boolean")}} indicating if the element has one or more HTML attributes present.</dd> + <dt>{{ domxref("Element.insertAdjacentElement") }} {{experimental_inline}}</dt> + <dd>Inserts a given element node at a given position relative to the element it is invoked upon.</dd> + <dt>{{ domxref("Element.insertAdjacentHTML") }} {{experimental_inline}}</dt> + <dd>Parses the text as HTML or XML and inserts the resulting nodes into the tree in the position given.</dd> + <dt>{{ domxref("Element.insertAdjacentText") }} {{experimental_inline}}</dt> + <dd>Inserts a given text node at a given position relative to the element it is invoked upon.</dd> + <dt>{{ domxref("Element.matches()") }}<code> </code>{{experimental_inline}}</dt> + <dd>Returns a {{jsxref("Boolean")}} indicating whether or not the element would be selected by the specified selector string.</dd> + <dt>{{ domxref("Element.querySelector()") }}</dt> + <dd>Returns the first {{ domxref("Node") }} which matches the specified selector string relative to the element.</dd> + <dt>{{ domxref("Element.querySelectorAll") }}</dt> + <dd>Returns a {{ domxref("NodeList") }} of nodes which match the specified selector string relative to the element.</dd> + <dt>{{ domxref("Element.releasePointerCapture")}}</dt> + <dd>Releases (stops) pointer capture that was previously set for a specific {{domxref("PointerEvent","pointer event")}}.</dd> + <dt>{{domxref("ChildNode.remove()")}} {{experimental_inline}}</dt> + <dd>Removes the element from the children list of its parent.</dd> + <dt>{{ domxref("Element.removeAttribute()") }}</dt> + <dd>Removes the named attribute from the current node.</dd> + <dt>{{ domxref("Element.removeAttributeNS()") }}</dt> + <dd>Removes the attribute with the specified name and namespace, from the current node.</dd> + <dt>{{ domxref("Element.removeAttributeNode()") }} {{obsolete_inline}}</dt> + <dd>Removes the node representation of the named attribute from the current node.</dd> + <dt>{{ domxref("EventTarget.removeEventListener()") }}</dt> + <dd>Removes an event listener from the element.</dd> + <dt>{{ domxref("Element.requestFullscreen()") }} {{experimental_inline}}</dt> + <dd>Asynchronously asks the browser to make the element full-screen.</dd> + <dt>{{ domxref("Element.requestPointerLock()")}} {{experimental_inline}}</dt> + <dd>Allows to asynchronously ask for the pointer to be locked on the given element.</dd> +</dl> + +<dl> + <dt>{{ domxref("Element.scrollIntoView()") }} {{experimental_inline}}</dt> + <dd>Scrolls the page until the element gets into the view.</dd> + <dt>{{ domxref("Element.setAttribute()") }}</dt> + <dd>Sets the value of a named attribute of the current node.</dd> + <dt>{{ domxref("Element.setAttributeNS()") }}</dt> + <dd>Sets the value of the attribute with the specified name and namespace, from the current node.</dd> + <dt>{{ domxref("Element.setAttributeNode()") }} {{obsolete_inline}}</dt> + <dd>Sets the node representation of the named attribute from the current node.</dd> + <dt>{{ domxref("Element.setAttributeNodeNS()") }} {{obsolete_inline}}</dt> + <dd>Setw the node representation of the attribute with the specified name and namespace, from the current node.</dd> + <dt>{{ domxref("Element.setCapture()") }} {{non-standard_inline}}</dt> + <dd>Sets up mouse event capture, redirecting all mouse events to this element.</dd> + <dt>{{domxref("Element.setPointerCapture()")}}</dt> + <dd>Designates a specific element as the capture target of future {{domxref("PointerEvent","pointer events")}}.</dd> +</dl> + +<h2 id="規範">規範</h2> + +<table class="standard-table"> + <thead> + <tr> + <th scope="col">Specification</th> + <th scope="col">Status</th> + <th scope="col">Comment</th> + </tr> + </thead> + <tbody> + <tr> + <td>{{SpecName('Shadow DOM')}}</td> + <td>{{Spec2('Shadow DOM')}}</td> + <td> </td> + </tr> + <tr> + <td>{{SpecName("Web Animations", '', '')}}</td> + <td>{{Spec2("Web Animations")}}</td> + <td>Added the <code>getAnimations()</code> method.</td> + </tr> + <tr> + <td>{{SpecName('Undo Manager', '', 'Element')}}</td> + <td>{{Spec2('Undo Manager')}}</td> + <td>Added the <code>undoScope</code> and <code>undoManager</code> properties.</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events 2', '#extensions-to-the-element-interface', 'Element')}}</td> + <td>{{Spec2('Pointer Events 2')}}</td> + <td>Added the following event handlers: <code>ongotpointercapture</code> and <code>onlostpointercapture</code>.<br> + Added the following methods: <code>setPointerCapture()</code> and <code>releasePointerCapture()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Pointer Events', '#extensions-to-the-element-interface', 'Element')}}</td> + <td>{{Spec2('Pointer Events')}}</td> + <td>Added the following event handlers: <code>ongotpointercapture</code> and <code>onlostpointercapture</code>.<br> + Added the following methods: <code>setPointerCapture()</code> and <code>releasePointerCapture()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Selectors API Level 2', '#interface-definitions', 'Element')}}</td> + <td>{{Spec2('Selectors API Level 2')}}</td> + <td>Added the following methods:<code> matches()</code> (implemented as <code>mozMatchesSelector()</code>), <code>find()</code>, <code>findAll()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Selectors API Level 1', '#interface-definitions', 'Element')}}</td> + <td>{{Spec2('Selectors API Level 1')}}</td> + <td>Added the following methods: <code>querySelector()</code> and <code>querySelectorAll()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Pointer Lock', 'index.html#element-interface', 'Element')}}</td> + <td>{{Spec2('Pointer Lock')}}</td> + <td>Added the <code>requestPointerLock()</code> method.</td> + </tr> + <tr> + <td>{{SpecName('Fullscreen', '#api', 'Element')}}</td> + <td>{{Spec2('Fullscreen')}}</td> + <td>Added the <code>requestFullscreen()</code> method.</td> + </tr> + <tr> + <td>{{SpecName('DOM Parsing', '#extensions-to-the-element-interface', 'Element')}}</td> + <td>{{Spec2('DOM Parsing')}}</td> + <td>Added the following properties: <code>innerHTML</code>, and <code>outerHTML</code>.<br> + Added the following method: <code>insertAdjacentHTML()</code>.</td> + </tr> + <tr> + <td>{{SpecName('CSSOM View', '#extensions-to-the-element-interface', 'Element')}}</td> + <td>{{Spec2('CSSOM View')}}</td> + <td>Added the following properties: <code>scrollTop</code>, <code>scrollLeft</code>, <code>scrollWidth</code>, <code>scrollHeight</code>, <code>clientTop</code>, <code>clientLeft</code>, <code>clientWidth</code>, and <code>clientHeight</code>.<br> + Added the following methods: <code>getClientRects()</code>, <code>getBoundingClientRect()</code>, and <code>scrollIntoView()</code>.</td> + </tr> + <tr> + <td>{{SpecName('Element Traversal', '#ecmascript-bindings', 'Element')}}</td> + <td>{{Spec2('Element Traversal')}}</td> + <td>Added inheritance of the {{domxref("ElementTraversal")}} interface.</td> + </tr> + <tr> + <td>{{SpecName('DOM WHATWG', '#interface-element', 'Element')}}</td> + <td>{{Spec2('DOM WHATWG')}}</td> + <td>Removed the following methods: <code>closest()</code>, <code>setIdAttribute()</code>, <code>setIdAttributeNS()</code>, and <code>setIdAttributeNode()</code>.<br> + Removed the <code>schemaTypeInfo</code> property.<br> + Modified the return value of <code>getElementsByTag()</code> and <code>getElementsByTagNS()</code>.<br> + Moved <code>hasAttributes()</code> from the <code>Node</code> interface to this one.<br> + Inserted <code>insertAdjacentElement()</code> and <code>insertAdjacentText()</code>.</td> + </tr> + <tr> + <td>{{SpecName('DOM3 Core', 'core.html#ID-745549614', 'Element')}}</td> + <td>{{Spec2('DOM3 Core')}}</td> + <td>Added the following methods: <code>setIdAttribute()</code>, <code>setIdAttributeNS()</code>, and <code>setIdAttributeNode()</code>. These methods were never implemented and have been removed in later specifications.<br> + Added the <code>schemaTypeInfo</code> property. This property was never implemented and has been removed in later specifications.</td> + </tr> + <tr> + <td>{{SpecName('DOM2 Core', 'core.html#ID-745549614', 'Element')}}</td> + <td>{{Spec2('DOM2 Core')}}</td> + <td>The <code>normalize()</code> method has been moved to {{domxref("Node")}}.</td> + </tr> + <tr> + <td>{{SpecName('DOM1', 'level-one-core.html#ID-745549614', 'Element')}}</td> + <td>{{Spec2('DOM1')}}</td> + <td>Initial definition.</td> + </tr> + </tbody> +</table> + +<h2 id="瀏覽器相容性">瀏覽器相容性</h2> + +<div>{{CompatibilityTable}}</div> + +<div id="compat-desktop"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Chrome</th> + <th>Edge</th> + <th>Firefox (Gecko)</th> + <th>Internet Explorer</th> + <th>Opera</th> + <th>Safari (WebKit)</th> + </tr> + <tr> + <td>Basic support</td> + <td>1.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>1.0</td> + </tr> + <tr> + <td><code>children</code></td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9")}}</td> + <td>7.0 with a significant bug [1]<br> + 9.0 according to the spec</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>childElementCount</code>, <code>nextElementSibling</code>, <code>previousElementSibling</code></td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9.1")}}</td> + <td>9.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td><code>firstElementChild</code>, <code>lastElementChild</code></td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9")}}</td> + <td>9.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td><code>classList</code></td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9.2")}}</td> + <td> </td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td><code>outerHTML</code> {{experimental_inline}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("11")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td><code>clientLeft</code>, <code>clientTop</code> {{experimental_inline}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9.1")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td><code>getBoundingClientRect()</code>, <code>getClientRects()</code> {{experimental_inline}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td><code>querySelector()</code>, <code>querySelectorAll()</code></td> + <td>1.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("1.9.1")}}</td> + <td>8.0</td> + <td>10.0</td> + <td>3.2 (525.3)</td> + </tr> + <tr> + <td><code>insertAdjacentHTML()</code> {{experimental_inline}}</td> + <td>1.0</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("8")}}</td> + <td>4.0</td> + <td>7.0</td> + <td>4.0 (527)</td> + </tr> + <tr> + <td><code>setCapture() </code>{{non-standard_inline}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("2")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>oncopy</code>, <code>oncut</code>, <code>onpaste</code> {{non-standard_inline}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("1.9")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td> </td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>onwheel</code> {{non-standard_inline}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("17")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>ongotpointercapture</code>, <code>onlostpointercapture</code>, <code>setPointerCapture()</code>, and <code>releasePointerCapture()</code></td> + <td>{{CompatChrome(52.0)}} [4]</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}} <sup>[3]</sup></td> + <td>10.0</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>matches()</code> {{experimental_inline}}</td> + <td>{{CompatVersionUnknown}} with the non-standard name <code>webkitMatchesSelector</code></td> + <td>{{CompatVersionUnknown}} {{property_prefix("webkit")}} {{property_prefix("ms")}}</td> + <td>{{CompatGeckoDesktop("1.9.2")}} with the non-standard name <code>mozMatchesSelector</code><br> + {{CompatGeckoDesktop("34")}} with the standard name</td> + <td>9.0 with the non-standard name <code>msMatchesSelector</code></td> + <td>11.5 with the non-standard name <code>oMatchesSelector</code><br> + 15.0 with the non-standard name <code>webkitMatchesSelector</code></td> + <td>5.0 with the non-standard name <code>webkitMatchesSelector</code></td> + </tr> + <tr> + <td><code>find()</code> and <code>findAll()</code></td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>requestPointerLock()</code></td> + <td>16.0 {{property_prefix("webkit")}}, behind an about:flags<br> + 22.0 {{property_prefix("webkit")}} (with special cases, progressively lifted see [2])</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("14")}}{{property_prefix("moz")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>requestFullscreen()</code></td> + <td>14.0 {{property_prefix("webkit")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("10")}} {{property_prefix("moz")}}</td> + <td>11.0 {{property_prefix("ms")}}</td> + <td>12.10<br> + 15.0 {{property_prefix("webkit")}}</td> + <td>5.1 {{property_prefix("webkit")}}</td> + </tr> + <tr> + <td><code>undoManager</code> and <code>undoScope</code></td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatVersionUnknown}} (behind the <code>dom.undo_manager.enabled</code> pref)</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>attributes</code></td> + <td>{{CompatUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("22")}}<br> + Before this it was available via the {{domxref("Node")}} interface that any <code>element</code> inherits.</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>scrollTopMax()</code> and <code>scrollLeftMax()</code></td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("16")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + </tr> + <tr> + <td><code>closest()</code></td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoDesktop("35")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>hasAttributes()</code></td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("1.0")}} (on the {{domxref("Node")}} interface)<br> + {{CompatGeckoDesktop("35")}} (on this interface</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td><code>insertAdjacentElement()</code>, <code>insertAdjacentText()</code></td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoDesktop("48.0")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + </tr> + <tr> + <td><code>assignedSlot</code>, <code>attatchShadow</code>, <code>shadowRoot</code>, and <code>slot</code></td> + <td>{{CompatChrome(53)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + </tr> + <tr> + <td><code>computedRole</code> and <code>computedName</code></td> + <td>{{CompatChrome(41)}}[4]</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>28[4]</td> + <td>{{CompatUnknown}}</td> + </tr> + </tbody> +</table> +</div> + +<div id="compat-mobile"> +<table class="compat-table"> + <tbody> + <tr> + <th>Feature</th> + <th>Android</th> + <th>Android Webview</th> + <th>Edge</th> + <th>Firefox Mobile (Gecko)</th> + <th>IE Phone</th> + <th>Opera Mobile</th> + <th>Safari Mobile</th> + <th>Chrome for Android</th> + </tr> + <tr> + <td>Basic support</td> + <td>1.0</td> + <td> </td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("1")}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>1.0</td> + <td> </td> + </tr> + <tr> + <td><code>scrollTopMax()</code> and <code>scrollLeftMax()</code></td> + <td>{{CompatNo}}</td> + <td> </td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("16")}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td> </td> + </tr> + <tr> + <td><code>closest()</code></td> + <td>{{CompatUnknown}}</td> + <td> </td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("35")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td> </td> + </tr> + <tr> + <td><code>hasAttributes()</code></td> + <td>{{CompatVersionUnknown}}</td> + <td> </td> + <td>{{CompatNo}}</td> + <td>{{CompatGeckoMobile("1.0")}} (on the {{domxref("Node")}} interface)<br> + {{CompatGeckoMobile("35")}} (on this interface</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td> </td> + </tr> + <tr> + <td><code>insertAdjacentElement()</code>, <code>insertAdjacentText()</code></td> + <td>{{CompatVersionUnknown}}</td> + <td> </td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatGeckoMobile("48.0")}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td>{{CompatVersionUnknown}}</td> + <td> </td> + </tr> + <tr> + <td><code>assignedSlot</code>, <code>attatchShadow</code>, <code>shadowRoot</code>, and <code>slot</code></td> + <td>{{CompatNo}}</td> + <td>{{CompatChrome(53.0)}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatChrome(53)}}</td> + </tr> + <tr> + <td><code>computedRole</code> and <code>computedName</code></td> + <td>{{CompatNo}}</td> + <td>{{CompatNo}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatUnknown}}</td> + <td>28[4]</td> + <td>{{CompatUnknown}}</td> + <td>{{CompatNo}}</td> + </tr> + </tbody> +</table> +</div> + +<p>[1] Internet Explorer 7 and 8 incorrectly return the comments as part of the children of an Element. This is fixed in Internet Explorer 9 and later.</p> + +<p>[2] Chrome 16 allowed <code>webkitRequestPointerLock()</code> only in fullscreen; Chrome 21 for trusted web site (permission asked); Chrome 22 allowed it by default for all same-origin document; Chrome 23 allowed it in sandboxed {{HTMLElement("iframe")}} if the non-standard value <code>webkit-allow-pointer-lock</code> is set to the {{htmlattrxref("sandbox", "iframe")}} attribute.</p> + +<p>[3] Implementation withdrawn. See {{Bug("1166347")}}.</p> + +<p>[4] Behind a flag.</p> |