jquery-list-child-selectors

Benchmark created by Stephen on


Description

Tests which jQuery selection method is fastest for getting a collection of HTML <ul> list elements. Note that if you have nested lists (i.e., <ul> <li> <ul> <li> </ul> </li> </ul> that only $('#list').children('li') will provide the correct number of child <li> elements for the first level. Using $('#list').children() appears to also include the second level <ul> element.

Preparation HTML

<ul id="list">
    <li>first</li>
    <li>second</li>
    <li>tree</li>
    <li>fo</li>
    <li>fif</li>
</ul>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.5.1/jquery.min.js"></script>

Test runner

Ready to run.

Testing in
TestOps/sec
id+children()
$('#list').children();
ready
id+tag
$('#list li');
ready
id+children(tag)
$('#list').children('li');
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 on