Element Has Parent

Benchmark created by Fardin on October 14, 2014

Description

Preparation HTML

<div id="the-parent" class="also has class">
  <div>
    <div class="im-yo-dad">
      <div id="missing-child"></div>
    </div>
  </div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Setup

function hasParent(element, parentSelector) {
      var potentialParents = document.querySelectorAll(parentSelector);
      for(i in potentialParents) if(potentialParents[i].contains(element))
        return potentialParents[i];
      return false;
    }
    
    function hasSomeParentTheClass(element, classname) {
      if (element.className.split(' ').indexOf(classname)>=0) return true;
      return element.parentNode && hasSomeParentTheClass(element.parentNode, classname);
    }
    
    
    var child = document.getElementById('missing-child');

Test runner

hasParent(child, '#the-parent')

hasParent(child, '.also')

hasParent(child, '#the-parent.also.has.class')

hasSomeParentTheClass(child, 'also')

hasParent(child, '#the-parent > div .im-yo-dad')

jQuery(child).parents('#the-parent')

jQuery(child).parents('.also')

jQuery(child).parents('#the-parent.also.has.class')

jQuery(child).parents('#the-parent > div .im-yo-dad')

Revisions

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

• Revision 1: published by Fardin on October 14, 2014