jQuery standards over qualified selectors (v2)

Revision 2 of this benchmark created by Steve on


Description

Why you shouldn't over-qualify your jQuery selectors

Preparation HTML

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<div>
  <div class='class'>
    <div id='id'>
    </div>
    <div class='class2'>
    </div>
    <div id='id2'>
    </div>
  </div>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
Single, Simple Selectors
var $class = jQuery('.class'),
    $id = jQuery('#id'),
    $class2 = jQuery('.class2'),
    $id2 = jQuery('#id2');
ready
Over Qualified
var $class = jQuery('div div.class'),
    $id = jQuery('div div.class div#id'),
    $class2 = jQuery('div div.class2'),
    $id2 = jQuery('div div#id2');
ready
Qualified
var $class = jQuery('div.class'),
    $id = jQuery('.class div#id'),
    $class2 = jQuery('.class2'),
    $id2 = jQuery('#id2');
ready

Revisions

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

  • Revision 1: published by Stephen Mathieson on
  • Revision 2: published by Steve on
  • Revision 3: published on