Question about a function (fnGetSibling)

[nikos]

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.

[Ingolme]

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.

[nikos]

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

[Ingolme]

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?

[nikos]

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?

[Ingolme]

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.

[nikos]

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>

[Ingolme]

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>

[nikos]

Thank you very much Ingolme, you helped me alot. If it is necessary this thread can be closed.