Data

Benchmark created on


Description

Testing between jQuery's data method and javascript get attribute for HTML5 data attributes

Preparation HTML

<div id="truck" data-brand="toyota">
  <div id="link">Toyota</div>
</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script>
  var brand;
  var $truck = $('#truck');
  var truck = document.getElementById('truck');
  var $link = $('#link');
  var link = document.getElementById('link');
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery
brand = $truck.data('brand');
ready
JS Get Attribute
brand = truck.getAttribute('data-brand');
ready
JS dataset
brand = truck.dataset.brand;
ready
jQuery Parent data
brand = $link.parent().data('brand');
ready

Revisions

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