closest vs parents:first (v3)

Revision 3 of this benchmark created by RobG on

Preparation HTML

<div class="parent">
  <div class="parent">
    <div class="parent">
      <div class="child">
        <div class="grandchild" id="grandchild">
        </div>
      </div>
    </div>
  </div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script>
  function upTo(el, tagName, count) {
    var el;
    var count = count? --count : 0;
    tagName = tagName.toLowerCase();
  
    do {
      el = el.parentNode;
      if (el.tagName && el.tagName.toLowerCase() == tagName) {
        if (!count) {
          return el;
        }
        --count;
      }
    } while (el.parentNode)
  }
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
.parents('.parent:first')
$('.grandchild').parents('.parent:first')
ready
.closest('.parent')
$('.grandchild').closest('.parent')
ready
$($()[0])
$($('.grandchild').parents('.parent')[0])
ready
POJS - first parent
document.getElementById('grandchild').parentNode;
ready
POJS - 4th div parent
upTo(document.getElementById('grandchild'), 'div', 4);
ready

Revisions

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