nikos Posted August 22, 2016 Share Posted August 22, 2016 Hello, I found a function called fnGetSibling on https://msdn.microsoft.com/en-us/library/ms533043(v=vs.85).aspx#navigate and I was hoping to understand what it does return and why. var oPrevious = fnGetSibling(); function fnGetSibling(){ var oParent=oNode.parentElement; var iLength=oParent.children.length; for(var i=0;i < iLength;i++){ if(oParent.children[i]==oNode){ return oParent.children[i - 1]; break; } } } I have three possible options: 1. Finds and returns a reference to all childs of a node of DOM Tree. 2. Finds and returns a reference to one of the children of a node of DOM Tree. 3. Finds and returns a reference to a father of a node of DOM Tree. You are not solving any homework (it's summer), it's just from a quiz. 1 Link to comment Share on other sites More sharing options...
Ingolme Posted August 22, 2016 Share Posted August 22, 2016 In the piece of code you provided oNode is not defined, so this code doesn't actually do anything. Assuming that oNode is actually a reference to a DOM node, I'll break it down for you: // Get a reference to the parent of the node var oParent=oNode.parentElement; // Find out how many nodes are children of that parent var iLength=oParent.children.length; // The variable i starts at zero and increases by one each time the code loops // The loop ends when i is equal to the number of children in the parent of oNode for(var i=0;i < iLength;i++){ // If the node with index "i" is oNode then run the code between the braces if(oParent.children[i]==oNode) { // Return the element node with an index of one less than the oNode's index return oParent.children[i - 1]; // Exit the loop break; } } The function could be further improved if you could actually pass oNode as a parameter to the function, and it doesn't account for oNode being the first child in its parent. 2 Link to comment Share on other sites More sharing options...
nikos Posted August 22, 2016 Author Share Posted August 22, 2016 (edited) In the piece of code you provided oNode is not defined, so this code doesn't actually do anything. Assuming that oNode is actually a reference to a DOM node, I'll break it down for you: // Get a reference to the parent of the node var oParent=oNode.parentElement; // Find out how many nodes are children of that parent var iLength=oParent.children.length; // The variable i starts at zero and increases by one each time the code loops // The loop ends when i is equal to the number of children in the parent of oNode for(var i=0;i < iLength;i++){ // If the node with index "i" is oNode then run the code between the braces if(oParent.children[i]==oNode) { // Return the element node with an index of one less than the oNode's index return oParent.children[i - 1]; // Exit the loop break; } } The function could be further improved if you could actually pass oNode as a parameter to the function, and it doesn't account for oNode being the first child in its parent. Hello Ingolme and thank you for your answer, It helped me alot understanding this code. oNode should be a reference in DOM tree as you said. I have imagined it like this . So in return statement do we actually get a reference to Parent? What do you mean and it doesn't account for oNode being the first child in its parent? Edited August 22, 2016 by nikos 1 Link to comment Share on other sites More sharing options...
Ingolme Posted August 22, 2016 Share Posted August 22, 2016 The return statement says this: return oParent.children[i - 1]; oParent is the parent node, children is a list of child nodes, [i-1] is an index in the children list. It's not hard to figure out what is being returned. Have you looked at the objects and arrays tutorial pages? 2 Link to comment Share on other sites More sharing options...
nikos Posted August 23, 2016 Author Share Posted August 23, 2016 The return statement says this: return oParent.children[i - 1]; oParent is the parent node, children is a list of child nodes, [i-1] is an index in the children list. It's not hard to figure out what is being returned. Have you looked at the objects and arrays tutorial pages? I have read these tutorials, I also have tried myself their examples which were very helpful. I just read the DOM Navigation tutorial and I think it will return the previous brother of oNode and not the Parent, which is called previousSibling if I'm not mistaken. If this is correct, if oNode is number 1 child as you said in a previous post (like i imagined it in the picture), this means that there will be an error, right? 1 Link to comment Share on other sites More sharing options...
Ingolme Posted August 23, 2016 Share Posted August 23, 2016 If oNode is the first child, that means it has index 0, the function would try to return an element with index [0 - 1]. There's nothing in the list at index -1, so it would throw an error. The result of this function is different from previousSibling, because the node is always an element node. The previousSibling property may point to a text node or a comment node. 1 Link to comment Share on other sites More sharing options...
nikos Posted August 23, 2016 Author Share Posted August 23, 2016 I mean that if we have this code below, and oNode points to <p> element Using fnGetSibling it will return a reference to <h1>. What previousSibling would do in this case? <html> <head> <title>DOM Tutorial</title> </head> <body> <h1>DOM Lesson one</h1> <p>Hello world!</p> </body> </html> 1 Link to comment Share on other sites More sharing options...
Ingolme Posted August 23, 2016 Share Posted August 23, 2016 It would do the same thing. However, in this case previousSibling would reference a text node with a node value of "Some text" <html> <head> <title>DOM Tutorial</title> </head> <body> <h1>DOM Lesson one</h1> Some text <p>Hello world!</p> </body> </html> 2 Link to comment Share on other sites More sharing options...
nikos Posted August 23, 2016 Author Share Posted August 23, 2016 Thank you very much Ingolme, you helped me alot. If it is necessary this thread can be closed. 1 Link to comment Share on other sites More sharing options...
Recommended Posts
Create an account or sign in to comment
You need to be a member in order to leave a comment
Create an account
Sign up for a new account in our community. It's easy!
Register a new accountSign in
Already have an account? Sign in here.
Sign In Now