jQuery .find() vs. context selector (v7)

Revision 7 of this benchmark created on

Description

comparing selector speed

Preparation HTML

<ul class="account-nav">
                                                <li class="myaccount" id="myaccount"><a href="#"><span>My Account</span></a></li>
                                                <li class="addressbook" id="addressbook"><a href="#"><span>Address Book</span></a></li>
                                                <li class="myreviews" id="myreviews"><a href="#"><span>My Reviews</span></a></li>
                                                <li class="loremipsum" id="loremipsum"><a href="#"><span>Lorem Ipsum</span></a></li>
                                                <li class="orderhistory" id="orderhistory"><a href="#"><span>Order History</span></a></li>
                                                <li class="discounts" id="discounts"><a href="#"><span>Discounts</span></a></li>
                                                <li class="tickets" id="tickets"><a href="#"><span>Help Tickets</span></a></li>
<li class="addressbook"><a href="#"><span>Address Book</span></a></li>


                                        </ul>

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

Test runner

Ready to run.

Testing in
TestOps/sec
find method
$(".account-nav").find('#addressbook').addClass("active");
ready
context method
$('#addressbook').addClass("active");
ready
find using class
$('.addressbook').addClass("active");
ready
$(".account-nav").find('.addressbook').addClass("active");
ready

Revisions

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