Class attribute vs Data attribute selectors (jQuery 1.8) (plus text) (v6)

Revision 6 of this benchmark created by LocalPCGuy on

Preparation HTML

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
</script>
<div class="field-name-body field-type-text edit-field viewmode-full" data-edit-id="node:1:body:und:full">text
</div>
<div class="field-name-plaintext field-type-text edit-field viewmode-full" data-edit-id="node:1:field_plaintext:und:full">text
</div>
</div>

Test runner

Ready to run.

Testing in
TestOps/sec
Class selector
$('.edit-field');
ready
Data- attribute selector
$('[data-edit-id]');
ready
qSA class
document.querySelectorAll('.edit-field');
ready
qSA data-
document.querySelectorAll('[data-edit-id]');
ready
Text
$(":contains('text')");
ready

Revisions

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