Home/ Questions/Q 6755443
In Process

The Archive Base Latest Questions

Editorial Team
  • 0
Asked: 2026-05-26T13:24:02+00:00

I have the following HTML markup: <body> <div class=wrapper> <div class=head> <p class=title>title</p> <a

  • 0

I have the following HTML markup:

<body>
   <div class="wrapper">
      <div class="head">
         <p class="title">title</p>
         <a href="#" class="logo"></a>
      </div>
   </div>
</body

I need to get something like the following – the “A” element with class “logo” is the seconde childNode of the div element with class “head”. The div element with class “head” is the first childNode of the div element with class “wrapper”, the div element with class “wrapper” is the first childNode of body. Then I would get the location of the link with class “logo” as follows:

var a = [1, 1, 2]

So, if I go in the opposite direction using the array above, I will find the link with class “logo” in the DOM starting from the body element. Could anybody tell me how can this be achieved with JavaScript?

Thanks in advance.

Share

Leave an answer

You must login to add an answer.

Need An Account,

1 Answer

  1. Editorial Team

    Here’s a pair of functions adapted from some existing code of mine to turn a node into an array of nested positions within a node and back again.

    Live demo: http://jsfiddle.net/DSNUv/

    Code:

    function getNodeIndex(node) {
    var i = 0;
    while( (node = node.previousSibling) ) {
        i++;
    }
    return i;
}

function nodeToPath(node, rootNode) {
    var path = [], n = node;
    rootNode = rootNode || document.documentElement;
    while (n && n != rootNode) {
        path.push(getNodeIndex(n));
        n = n.parentNode;
    }
    return path;
}

function pathToNode(path, rootNode) {
    rootNode = rootNode || document.documentElement;
    var node = rootNode;
    var i = path.length, nodeIndex;

    while (i--) {
        nodeIndex = path[i];
        if (nodeIndex < node.childNodes.length) {
            node = node.childNodes[nodeIndex];
        } else {
            throw new Error("Child node index out of range: " + nodeIndex);
        }
    }

    return node;
}

    Example use:

    var a = document.getElementsByTagName("a")[0];

var path = nodeToPath(a, document.body);
alert(path);

var el = pathToNode(path, document.body);
alert(el.className);
    • 0