Info

After reading http://www.learningjquery.com./2011/12/using-jquerys-pushstack-for-reusable-dom-traversing-methods I was wondering if this approach gave any advantage over caching selectors.

Preparation code

<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<ul class="first">
  <li class="foo">
    list item
    <span class="number">
      1
    </span>
  </li>
  <li>
    list item
    <span class="number">
      2
    </span>
  </li>
  <li class="bar">
    list item
    <span class="number">
      3
    </span>
  </li>
</ul>
<ul class="second">
  <li class="foo">
    list item 1
  </li>
  <li>
    list item 2
  </li>
  <li class="bar">
    list item 3
  </li>
</ul>

Preparation code output

Test runner

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

Java applet disabled.

$('ul.first').find('.foo').end().find('.bar');

var $first = $('ul.first');
$first.find('.foo');
$first.find('.bar');

Compare results of other browsers

Revisions

You can edit these tests or add even more tests to this page by appending /edit to the URL. Here’s a list of current revisions for this page:

• Revision 1: published by Kito on 24th December 2011
• Revision 2: published on 1st March 2012
• Revision 3: published on 21st September 2012

0 comments