Preparation code

<section>
<div><div><div><div><aside id="end" class="end"><div><div><div><div><div><div><div><div>
<article>
<p>
<span id="start" class="start"></span>
</p>
</article>
</div></div></div></div></div></div></div></div></aside></div></div></div></div>
</section>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
 
<script>
  Benchmark.prototype.setup = function() {
    var startJQ = $( '#start' ),
        startDOM = $( '#start' )[0];
    
    
    Element.prototype.closestByTagName = function ( tagName ) {
    
        return this.tagName && this.tagName.toUpperCase() == tagName.toUpperCase()
            ? this
            : this.parentNode.closestByTagName && this.parentNode.closestByTagName( tagName );
    
    };
    
  };
</script>

Preparation code output

Test runner

Warning! For accurate results, please disable Firebug before running the tests. (Why?)

Java applet disabled.

var element = startJQ.closest( 'span' ),
    element = startJQ.closest( 'aside' ),
    element = startJQ.closest( 'header' );
 

var element = startDOM.closestByTagName( 'span' ),
    element = startDOM.closestByTagName( 'aside' ),
    element = startDOM.closestByTagName( 'header' );
 

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

Compare results of other browsers

0 comments