JQuery Tree Traversing

JavaScript performance comparison

Test case created by Sara and last updated

Preparation code

<div>
<div>
<span>
<ul>
<li>This is the first item <a href="#">I am an anchor</a></li>
<li>This is a parent<div>I am a child</div><div>I am a sibling</div></li>
<li>I am a sibling</li>
</ul></span>
<div>I'm the next and closest div.</div>
</div>
<span>I'm a span</span>
<div>I'm the next div</div>
</div>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
    

Preparation code output

<div> <div> <span> <ul> <li>This is the first item <a href="#">I am an anchor</a></li> <li>This is a parent<div>I am a child</div><div>I am a sibling</div></li> <li>I am a sibling</li> </ul></span> <div>I'm the next and closest div.</div> </div> <span>I'm a span</span> <div>I'm the next div</div> </div>

Test runner

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

Java applet disabled.

Testing in CCBot 2.0.0 / Other 0.0.0
Test Ops/sec
children()
var a = $('li').children('div');
pending…
closest()
var a = $('li').closest('div');
pending…
find()
var a = $('li').find('div');
pending…
next()
var a = $('li').next('div');
pending…
nextAll()
var a = $('li').nextAll('div');
pending…
offsetParent()
var a = $('li').offsetParent('div');
pending…
parent()
var a = $('li').parent('div');
pending…
parentsUntil()
var a = $('li').parentsUntil('span');
pending…
prev()
var a = $('div').prev('span');
pending…
prevAll()
var a = $('div').prevAll('span');
pending…
sibling()
var a = $('div').siblings('div');
pending…

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.

0 Comments

  • This is the first item I am an anchor
  • This is a parent
    I am a child
    I am a sibling
  • I am a sibling
I'm the next and closest div.
I'm a span
I'm the next div