ParentNode

ParentNode mixin contains methods and properties that are common to all types of Node objects that can have children. It's implemented by Element , Document ,和 DocumentFragment 对象。

Locating DOM elements using selectors to learn how to use CSS selectors to find nodes or elements of interest.

特性

ParentNode.childElementCount 只读
Returns the number of children of this ParentNode which are elements.
ParentNode.children 只读
Returns a live HTMLCollection containing all of the Element objects that are children of this ParentNode , omitting all of its non-element nodes.
ParentNode.firstElementChild 只读
Returns the first node which is both a child of this ParentNode and is also an Element ,或 null if there is none.
ParentNode.lastElementChild 只读
Returns the last node which is both a child of this ParentNode and is an Element ,或 null if there is none.

方法

ParentNode.append()
Inserts a set of Node objects or DOMString objects after the last child of the ParentNode . DOMString objects are inserted as equivalent Text nodes.
ParentNode.prepend()
Inserts a set of Node objects or DOMString objects before the first child of the ParentNode . DOMString objects are inserted as equivalent Text nodes.
ParentNode.querySelector()
Returns the first Element with the current element as root that matches the specified group of selectors.
ParentNode.querySelectorAll()
返回 NodeList representing a list of elements with the current element as root that matches the specified group of selectors.
ParentNode.replaceChildren()
Replaces the existing children of a node with a specified new set of children.

规范

规范 状态 Comment
DOM
The definition of 'ParentNode' in that specification.
实时标准 Split the ElementTraversal interface into ChildNode and ParentNode ParentNode.firstElementChild , ParentNode.lastElementChild ,和 ParentNode.childElementCount properties are now defined on the latter. Added the ParentNode.children property, and the ParentNode.querySelector() , ParentNode.querySelectorAll() , ParentNode.append() ,和 ParentNode.prepend() 方法。
Element Traversal Specification
The definition of 'ElementTraversal' in that specification.
Obsolete Added the initial definition of its properties to the ElementTraversal pure interface and used it on Element .

浏览器兼容性

更新 GitHub 上的兼容性数据
Desktop Mobile
Chrome Edge Firefox Internet Explorer Opera Safari Android webview Chrome for Android Firefox for Android Opera for Android Safari on iOS Samsung Internet
ParentNode Chrome 1 Edge 12 Firefox 3.5 IE 9 Opera 10 Safari 4 WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
append
Chrome 54 Edge 17 Firefox 49 IE No Opera 39 Safari 10 WebView Android 54 Chrome Android 54 Firefox Android 49 Opera Android 41 Safari iOS 10 Samsung Internet Android 6.0
childElementCount Chrome 1 Edge 12 Firefox 3.5 IE 9 Opera 10 Safari 4 WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
children Chrome 1 Edge 12 Firefox 3.5 IE 9
9
Internet Explorer 6, 7 and 8 supported it, but erroneously includes Comment nodes.
Opera 10 Safari 4 WebView Android 1 Chrome Android 18 Firefox Android 4 Opera Android 10.1 Safari iOS 9 Samsung Internet Android 1.0
Support on Document and DocumentFragment
Chrome 29 Edge ≤79 Firefox 25 IE No Opera 16 Safari No WebView Android Yes Chrome Android Yes Firefox Android ? Opera Android ? Safari iOS No Samsung Internet Android Yes
firstElementChild Chrome 1 Edge 12 Firefox 3.5 IE 9 Opera 10 Safari 4 WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
lastElementChild Chrome 1 Edge 12 Firefox 3.5 IE 9 Opera 10 Safari 4 WebView Android Yes Chrome Android Yes Firefox Android 4 Opera Android Yes Safari iOS Yes Samsung Internet Android Yes
prepend
Chrome 54 Edge 17 Firefox 49 IE No Opera 39 Safari 10 WebView Android 54 Chrome Android 54 Firefox Android 49 Opera Android 41 Safari iOS 10 Samsung Internet Android 6.0
querySelector Chrome 1 Edge 12 Firefox 3.5 IE 9
9
Internet Explorer 8 only supported CSS2 selectors.
Opera 10 Safari 4 WebView Android ≤37 Chrome Android 18 Firefox Android Yes Opera Android 10.1 Safari iOS 3.2 Samsung Internet Android Yes
querySelectorAll Chrome 1 Edge 12 Firefox 3.5 IE 9
9
Internet Explorer 8 only supported CSS2 selectors.
Opera 10 Safari 4 WebView Android Yes Chrome Android Yes Firefox Android Yes Opera Android 10.1 Safari iOS 3.2 Samsung Internet Android Yes
replaceChildren
Chrome No Edge No Firefox 78 IE No Opera No Safari 14 WebView Android No Chrome Android No Firefox Android No Opera Android No Safari iOS 14 Samsung Internet Android No

图例

完整支持
完整支持
不支持
不支持
兼容性未知
兼容性未知
实验。期望将来行为有所改变。
实验。期望将来行为有所改变。
见实现注意事项。

另请参阅