Home >Web Front-end >JS Tutorial >Instructions for use of Firefox's ElementTraversal interface_DOM

Instructions for use of Firefox's ElementTraversal interface_DOM

WBOY
WBOYOriginal
2016-05-16 18:16:331641browse
firstElementChild
To access this attribute of an element, the first child node reference of the nodeType 1 element must be returned as an Element object. If the element property being accessed does not have any child nodes, or if all such child nodes are not element nodes, then this property must return null.
lastElementChild
Accessing this property of an element must return the last child node reference of the nodeType 1 element as an Element object. If the element property being accessed does not have any child nodes, or if all such child nodes are not element nodes, then this property must return null.
previousElementSibling
To access this attribute of an element, you must return the sibling node reference of the nodeType 1 element before the element in file order as an Element object. If the element property being accessed does not have any preceding sibling nodes, or if none of these siblings are element nodes, then this property must return null.
nextElementSibling
Accessing this attribute of an element must return the sibling node reference of the element belonging to nodeType 1 in file order as an Element object. This property must return null if the element property being accessed does not have any sibling nodes that follow it, or if none of these siblings are element nodes.
childElementCount
Accessing this attribute of an element must return this belonging to nodeType 1. The current number of child nodes of the element. When accessing this attribute, the execution may store the number, or may calculate the number, But the number must always represent the number of child element nodes when accessing the property. Only direct child nodes should be counted. If one of the child nodes of the accessed attribute element also has element child nodes, the next level one will not be counted. This property must return 0 if the element to which the property is being accessed has no child nodes, or if none of these child nodes are element nodes.

Copy code The code is as follows:

function spaceChildren( el ) {
// Find the number of element nodes
var elCount = el.childElementCount;

var eachWidth = window.innerWidth / (elCount 1);

// Find the first child element
var childEl = el.firstElementChild;

// Set the initial position
var nextPos = eachWidth/2;

// Loop through the child elements one by one
while ( childEl ) {
// Place the child elements
childEl.style.setProperty( 'position', 'absolute', '' );
childEl.style.setProperty( 'left', nextPos 'px', '' );
childEl.style.setProperty( 'width', eachWidth 'px', '' );

// Increase the distance by width
nextPos = eachWidth;

// Then Navigate to next child element
childEl = childEl.nextElementSibling;
}
}
Statement:
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn