jQuery hasClass VS jQuery data VS data- attribute (v2)

Revision 2 of this benchmark created by Miloš Rašić on

Preparation HTML

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

<div id="foo" data-foo="bar" class="foobar"></div>
 
<script>
  var $elem = $('#foo').data('foo', 'bar');
  var elem = $elem[0];
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
hasClass
$elem.hasClass('foobar')
ready
$.data
$.data(elem, 'foo');
ready
data attribute
$elem.attr('data-foo');
ready
dataset property (where supported)
elem.dataset.foo;
ready
.data
$elem.data('foo');
ready
.data()
$elem.data().foo;
ready

Revisions

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

  • Revision 1: published by Alexis Deveria on
  • Revision 2: published by Miloš Rašić on