jquery selector speed (v45)

Revision 45 of this benchmark created on March 15, 2012

Description

Preparation HTML

<div id="container1">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li class="target" id="target" an_attribute="target">
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div>

<div id="container1">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div>

<div id="container1">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div>

<div id="container1">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div>

<div id="container">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="targetid" class="target">
      2
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div><div id="container1">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div>
<div id="container1">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div>
<div id="container1">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div>
<div id="container1">
  <ul>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li id="foo">
      3
    </li>
    <li>
      1
    </li>
    <li id="one-two-three">
      3
    </li>
    <li id="targetid22">
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      1
    </li>
    <li class="target2">
      2
    </li>
    <li>
      3
    </li>
  </ul>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>

Test runner

$('.target').css('border', '1px solid red');

$('#target').css('border', '1px solid red');

$('.target [an_attribute="target"]').css('border', '1px solid red');

$('#target [an_attribute="target"]').css('border', '1px solid red');

$('#container1 [an_attribute="target"]').css('border', '1px solid red');

var e = document.getElementById('targetid');
$(e).css('border', '1px solid red');

$('[an_attribute=target]').css('border', '1px solid red');

var e = document.getElementsByClassName('target');
$(e).css('border', '1px solid red');

Revisions

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

• Revision 1: published by AlienWebguy on July 26, 2011
• Revision 2: published on July 26, 2011
• Revision 3: published on July 26, 2011
• Revision 4: published on July 26, 2011
• Revision 5: published on July 26, 2011
• Revision 6: published on July 26, 2011
• Revision 7: published on July 26, 2011
• Revision 8: published on July 28, 2011
• Revision 9: published on July 28, 2011
• Revision 10: published on August 12, 2011
• Revision 11: published on August 16, 2011
• Revision 13: published on August 31, 2011
• Revision 14: published on August 31, 2011
• Revision 16: published on September 9, 2011
• Revision 17: published on September 13, 2011
• Revision 18: published by Jordan on September 14, 2011
• Revision 19: published on September 21, 2011
• Revision 20: published by Ryan Graham on September 21, 2011
• Revision 21: published on September 27, 2011
• Revision 22: published by SkeLLLa on November 1, 2011
• Revision 23: published by SkeLLLa on November 1, 2011
• Revision 24: published by sb on November 2, 2011
• Revision 25: published by Tony on November 2, 2011
• Revision 27: published on November 10, 2011
• Revision 28: published by Guhe Louis on November 22, 2011
• Revision 29: published on December 2, 2011
• Revision 30: published by Paul Grenier on December 2, 2011
• Revision 32: published on December 9, 2011
• Revision 33: published on December 15, 2011
• Revision 34: published on December 15, 2011
• Revision 35: published on December 15, 2011
• Revision 36: published on January 9, 2012
• Revision 37: published on January 18, 2012
• Revision 40: published on January 31, 2012
• Revision 41: published by Tom Taylor on February 1, 2012
• Revision 43: published by Jérôme Tamarelle on February 13, 2012
• Revision 45: published on March 15, 2012
• Revision 46: published by Mike Smith on March 19, 2012
• Revision 47: published on April 2, 2012
• Revision 48: published on April 2, 2012
• Revision 49: published on April 2, 2012
• Revision 50: published by Ludwig on April 9, 2012
• Revision 51: published on April 10, 2012
• Revision 52: published on April 13, 2012
• Revision 53: published on April 13, 2012
• Revision 54: published on April 17, 2012
• Revision 55: published on April 17, 2012
• Revision 56: published on April 17, 2012
• Revision 57: published on April 27, 2012
• Revision 58: published on April 27, 2012
• Revision 59: published on June 5, 2012
• Revision 60: published on June 23, 2012
• Revision 61: published by John Marty on June 28, 2012
• Revision 63: published on July 10, 2012
• Revision 65: published on July 18, 2012
• Revision 66: published on August 5, 2012
• Revision 70: published by mateus on September 4, 2012
• Revision 72: published on September 4, 2012
• Revision 73: published by mateus on September 5, 2012
• Revision 74: published by mateus on September 5, 2012
• Revision 75: published on September 5, 2012
• Revision 78: published on September 28, 2012
• Revision 79: published on October 2, 2012
• Revision 80: published on November 6, 2012
• Revision 81: published on November 6, 2012
• Revision 82: published on November 7, 2012
• Revision 83: published by Payrouse Nicolas on November 7, 2012
• Revision 84: published by Payrouse Nicolas on November 7, 2012
• Revision 85: published on November 21, 2012
• Revision 86: published on December 3, 2012
• Revision 87: published on December 13, 2012
• Revision 88: published on February 7, 2013
• Revision 91: published on April 23, 2013
• Revision 92: published on June 4, 2013
• Revision 93: published on September 9, 2013
• Revision 94: published on September 30, 2013
• Revision 96: published on December 9, 2013
• Revision 97: published by Christian on December 23, 2013
• Revision 98: published on January 20, 2014
• Revision 99: published on January 21, 2014
• Revision 100: published on January 27, 2014
• Revision 101: published on February 5, 2014
• Revision 102: published on February 5, 2014
• Revision 103: published on February 5, 2014
• Revision 104: published on February 5, 2014
• Revision 106: published on February 20, 2014
• Revision 108: published by Name selectors on March 11, 2014
• Revision 109: published on March 12, 2014
• Revision 110: published on March 17, 2014
• Revision 111: published on March 19, 2014
• Revision 112: published by Daniel Sherson on March 19, 2014
• Revision 113: published on March 25, 2014
• Revision 115: published by Denis on October 15, 2014