Document vs jquery child

Benchmark created by John on

Preparation HTML

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

<div id="test">
<a href="#" class="sub"/>
</div>

<script>
var localVar = document.getElementById('test');
var $localVar = $('#test');
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
Document
var node = document.getElementById('test');

$(node).find('a');
ready
jQuery inline
$('#test a');
ready
jQuery Find
$('#test').find('a')
ready
native find tag
document.getElementById('test').getElementsByTagName('a')
ready
jquery class with native
var node = document.getElementById('test');

$(node).find('.sub');
ready
native find class
document.getElementById('test').getElementsByClassName('sub')
ready
local var class
localVar.getElementsByClassName('sub')
ready
jquery local var class
$localVar.find('.sub')
ready

Revisions

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