jquery text() method vs native innerHTML property - set speed (v3)

Revision 3 of this benchmark created on


Preparation HTML

<nav>
  <a>menu item 1</a>
  <a>menu item 2</a>
  <a>menu item 3</a>
  <a>menu item 4</a>
  <a>menu item 5</a>
</nav>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js">
</script>
<script>
  var $nav_items = $('nav>a');
var x;
</script>

Test runner

Ready to run.

Testing in
TestOps/sec
jquery text method
$nav_items.each(function() {
  $(this).text('new text');
});
ready
native innerHTML method
$nav_items.each(function() {
  this.innerHTML = 'new text';
});
ready
getter
$nav_items.each(function() {
  x = $(this).text();
});
 
ready
getter2
$nav_items.each(function() {
  x = this.innerHTML;
});
 
ready

Revisions

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