NextSibling and Getnextelement (node) detailed

Source: Internet
Author: User

2. Get the next element node:

function getnextelement (node) {//Declaration getnextelement functions, parameters are node nodes.
if (Node.nodetype = = 1) {//If the node node type value is equal to 1 true, that is, the node node is an element node, the function is exited and the function takes a value of node.
return node;
//If the node node type value is equal to 1, proceed to the following statement.
if (node.nextsibling) {//If the next sibling of node node exists and the condition is true, exit this function and recursively, the argument becomes the next sibling node of the node.
Return getnextelement (node.nextsibling); Calling this function from within a function itself is called a recursive call.
//If the next sibling of node node does not exist and the condition is false, continue to execute the following statement.
return null; Exits this function, and this function takes a null value.
}

A bit difficult may be return getnextelement (node.nextsibling), but even if you do not know recursion, can guess meaning. The most critical place is actually, if (Node.nodetype = 1). Because of this example, let's get the next element node with NextSibling, and nextsibling get the next node, possibly not the element node, and then we need the getnextelement function. The problem is here, and my misconception is that if (Node.nodetype = 1) should be written as if (Node.nextSibling.nodeType = 1). Look at the previous call I just figured out that var elem = getnextelement (headers[i].nextsibling); in other words, this function functions getnextelement (node) Node here is already the next sibling of Headers[i], haha, suddenly enlightened.


Note:these functions also walk up of DOM tree, so if for you have two lists and call Getnextelement on the last List-item in The list it would return the the second list.


Getnextelement (ID);

Returns the next element, regardless of type, after ID.

Getnextelement (ID, ' Li ');

Returns the next list item, after ID; Could potentially is a child of ID.

Getnextelement (ID, 1);

Returns the next element with a nodeType of 1.

Getnextelement (ID, ' Li ', false);

Returns the next list-item that resides in the same level, or higher, as ID; No child nodes are searched.

Practical Example:
<div id= "Popup" >
<p id= "Paragraph" >below are some options:</p>
<ul id= "List" >
<li>your-Choice</li>
<li id= "SecondItem" >your second choice</li>
</ul>
</div>
Getnextelement (' popup ');

Would most likely return whitespace.

Getnextelement (' popup ', 1);

Would return the H1 tag.

Getnextelement (' Paragraph ', ' Li ');

Would return the "List-item", "Your".

Getpreviouselement (' SecondItem ', ' ul ');

Would return the UL element.

Getpreviouselement (' paragraph ', 1);

Would return the paragraph element.

Getfirstchild & Getlastchild
Once again, both these functions take the same parameters and behave the same way I ' ll only provide to one.

Getfirstchild (ID);

Returns the "the" the "the" of "the", regardless of type.

Getfirstchild (ID, ' Li ');

Returns the ' the ' of the ' is ' is a list-item.

Getfirstchild (ID, 1);

Returns the "a" of ID that has a nodeType of 1.

Practical Example:
<div id= "Popup" >
<p>below are some options:</p>
<ul>
<li>your-Choice</li>
<li>your Second choice</li>
</ul>
</div>
Getfirstchild (' popup ');

Would most likely return a-Text node with some whitespace.

Getfirstchild (' popup ', 1);

Would return the H1 element.

Getfirstchild (' popup ', ' Li ');

Would return the "List-item", "Your".

Getlastchild (' popup ');

Once again, probably whitespace.

Getlastchild (' popup ', 1);

Would return the UL element.

Getlastchild (' popup ', ' Li ');

Would return to the last List-item, "Your second choice".

Getnextparent & Getpreviousparent
Again, both functions take the same parameters, so I ' ll be only show one.

Getnextparent (ID);

Returns the node next to the parent of ID.

Practical Example:
<ul>
<li id= "the" >item one</li>
</ul>
<ul>
<li id= "Second" >item two</li>
</ul>
Getnextparent (' a ');

Would return the second UL element.

Getpreviousparent (' second ');

Would return the "the" the "the".

Istype
Istype (ID, ' Li ');

Returns true if ID has a tagName of ' Li '.

Istype (ID, 3);

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.