Sibling Index (v4)

Revision 4 of this benchmark created on


Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div>1</div>
  <div id="whereami">2</div>
</div>

Setup

function findRow(node){
        var i=1;
        while(node.previousSibling){
            node = node.previousSibling;
            if(node.nodeType === 1){
                i++;
            }
        }
        return i;
    }
    
    function findRow2(node)
    {
        return $(node).index();
    }
    
    function findRow3(node)
    {
        var i = 1;
        while (node = node.previousSibling) {
            if (node.nodeType === 1) { ++i }
        }
        return i;
    }
    
    function findRow4(node)
    {
        return [].indexOf.call(node.parentNode.childNodes, node)
    }
    
    function findRow5(node)
    {
        var i = 2;
        while (node = node.previousSibling)
            i += node.nodeType ^ 3;
        return i >> 1;
    }
    
    var node = document.getElementById('whereami'); //div node to find

Test runner

Ready to run.

Testing in
TestOps/sec
Original
findRow(node);
ready
jQuery
findRow2(node);
ready
Jack's one
findRow3(node);
ready
Experimental and wrong
findRow4(node);
ready
A little bit weird answer.
findRow5(node);
ready

Revisions

You can edit these tests or add more tests to this page by appending /edit to the URL.