jquery selector test find

JavaScript performance comparison

Test case created

Info

testing find vs class selector

Preparation code

<table class="sandbox sort-table">
    <thead>
        <tr>
            <th class="alert header">Alert</th>
            <th class="title header">Title<span class="sort-arrows"></span></th>
            <th class="updated header">Last Updated<span class="sort-arrows"></span></th>
            <th class="type header">Type<span class="sort-arrows"></span></th>
            <th class="email header">Email</th>
            <th class="delete header">Delete</th>
        </tr>
    </thead>
    <tbody>
                       
                       
            <tr id="myputnam-7472" class="odd">
                <td class="alert">
                        &nbsp;
                </td>
                <td class="title"><a href="/advisor/mutual-funds/funds/8-dynamic-asset-allocation-growth-fund/A">Dynamic Asset Allocation Growth Fund
        (PAEAX)
      - Class A
  </a></td>
                <td class="updated">
                       
                </td>
                <td class="type">
                                                Page
                                </td>
                <td class="email"><a class="email-share" href="http://localhost:8080/advisor/mutual-funds/funds/8-dynamic-asset-allocation-growth-fund/A"><img width="21" height="15" title="email this" alt="email" class="email-share" src="/static/img/advisor/footer/icon-sandbox-email.png"></a></td>
                <td class="delete"><img width="15" height="15" title="delete this item" alt="delete" class="delete" src="/static/img/advisor/footer/icon-sandbox-delete.png" style="margin-left: 0px;"></td>
            </tr>
                       
                       
            <tr id="myputnam-7467" class="even">
                <td class="alert">
                            <a rel="true" class="alert" href="#"><img width="16" height="15" title="set or remove an alert" alt="alert" class="alert" src="/static/img/advisor/footer/icon-sandbox-alert-off.png"></a>
                </td>
                <td class="title"><a href="/advisor/practice-management/">Practice Management</a></td>
                <td class="updated">
                        07/14/2011
                </td>
                <td class="type">
                                                Page
                                </td>
                <td class="email"><a class="email-share" href="http://localhost:8080/advisor/practice-management/"><img width="21" height="15" title="email this" alt="email" class="email-share" src="/static/img/advisor/footer/icon-sandbox-email.png"></a></td>
                <td class="delete"><img width="15" height="15" title="delete this item" alt="delete" class="delete" src="/static/img/advisor/footer/icon-sandbox-delete.png" style="margin-left: 0px;"></td>
            </tr>
                       
                       
            <tr id="myputnam-7464" class="odd">
                <td class="alert">
                            <a rel="true" class="alert" href="#"><img width="16" height="15" title="set or remove an alert" alt="alert" class="alert" src="/static/img/advisor/footer/icon-sandbox-alert-off.png"></a>
                </td>
                <td class="title"><a href="/advisor/529/">Putnam 529 for America</a></td>
                <td class="updated">
                        07/13/2011
                </td>
                <td class="type">
                                                Page
                                </td>
                <td class="email"><a class="email-share" href="http://localhost:8080/advisor/529/"><img width="21" height="15" title="email this" alt="email" class="email-share" src="/static/img/advisor/footer/icon-sandbox-email.png"></a></td>
                <td class="delete"><img width="15" height="15" title="delete this item" alt="delete" class="delete" src="/static/img/advisor/footer/icon-sandbox-delete.png" style="margin-left: 0px;"></td>
            </tr>
                       
                       
            <tr id="myputnam-7459" class="even">
                <td class="alert">
                            <a rel="true" class="alert" href="#"><img width="16" height="15" title="set or remove an alert" alt="alert" class="alert" src="/static/img/advisor/footer/icon-sandbox-alert-off.png"></a>
                </td>
                <td class="title"><a href="/advisor/client-planning/">Client Planning</a></td>
                <td class="updated">
                        01/18/2012
                </td>
                <td class="type">
                                                Page
                                </td>
                <td class="email"><a class="email-share" href="http://localhost:8080/advisor/client-planning/"><img width="21" height="15" title="email this" alt="email" class="email-share" src="/static/img/advisor/footer/icon-sandbox-email.png"></a></td>
                <td class="delete"><img width="15" height="15" title="delete this item" alt="delete" class="delete" src="/static/img/advisor/footer/icon-sandbox-delete.png" style="margin-left: 0px;"></td>
            </tr>
    </tbody>
</table>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
 

Preparation code output

Alert Title Last Updated Type Delete
  Dynamic Asset Allocation Growth Fund (PAEAX) - Class A Page delete
alert Practice Management 07/14/2011 Page delete
alert Putnam 529 for America 07/13/2011 Page delete
alert Client Planning 01/18/2012 Page delete

Test runner

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

Java applet disabled.

Testing in unknown unknown
Test Ops/sec
class selector
var icon = $('td.delete img');
pending…
jQuery .find() selector
var table = document.querySelector('.sandbox tbody');
var icon = $(table).find('.delete img');
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. Here’s a list of current revisions for this page:

0 comments

Add a comment