hide and show

Benchmark created on

Preparation HTML

<div class="intro">
  <span>hehehehee</span>
</div>

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

Test runner

Ready to run.

Testing in
TestOps/sec
jQuery Hide
var intro = $('div.intro');
intro.hide(0);
ready
jQuery Show
var intro = $('div.intro');
intro.show(0);
ready
jQuery CSS Hide
var intro = $('div.intro');
intro.css('display', 'none');
ready
jQuery CSS Show
var intro = $('div.intro');
intro.css('display', 'block');
ready
jQuery Attribute Hide
var intro = $('div.intro');
intro.attr('style', 'display: none;');
ready
jQuery Attribute Show
var intro = $('div.intro');
intro.attr('style', 'display: block;');
ready
jQuery addClass Hidden
var intro = $('div.intro');
intro.addClass('hidden');
ready
jQuery removeClass Hidden
var intro = $('div.intro');
intro.removeClass('hidden');
ready
jQuery toggleClass Hidden
var intro = $('div.intro');
intro.toggleClass('hidden');
ready

Revisions

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