jQuery document on vs ready (v6)

Revision 6 of this benchmark created on


Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>

<table data-foo="True">
<tr>
  <th>Hello</th><td>World</td>
</tr>
</table>

<table data-bar="True">
<tr>
  <th>Hello</th><td>World</td>
</tr>
</table>

<table data-hax="True">
<tr>
  <th>Hello</th><td>World</td>
</tr>
</table>

<table data-fax="True">
<tr>
  <th>Hello</th><td>World</td>
</tr>
</table>

Test runner

Ready to run.

Testing in
TestOps/sec
on(ready)
$(document).on('ready',function () {
  $('[data-foo] td').css('background','red');
});
ready
ready
$(document).ready(function () {
  $('[data-bar]').find('td').css('background','yellow')
});
ready
on(), object in context
$(document).on('ready','[data-hax]', function () {
  $(this).find('td').css('background','green');
  $(this).find('td').html($(this).html());
});
ready
$(document).on('load','[data-fax]', function () {
  $(this).find('td').css('background','green');
  $(this).find('td').html($(this).html());
});
ready

Revisions

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