hash vs href

Benchmark created on March 29, 2011

Description

Preparation HTML

<a href="http://www.link1.com/">Ext Link 1</a>
<a href="http://www.link2.co.uk">Ext Link 2</a>
<a href="#link1">Anchor 1</a>
<a href="#link2">Anchor 2</a>
<a href="#link3">Anchor 3</a>
<a href="#link4">Anchor 4</a>
<a href="#link5">Anchor 5</a>
<a href="#link6">Anchor 6</a>
<a href="#link7">Anchor 7</a>
<a href="#link8">Anchor 8</a>
<a href="#link9">Anchor 9</a>
<a href="#link10">Anchor 10</a>
<a href="http://www.link3.com/#top">Ext Link 3</a>
<a href="http://www.link4.org">Ext Link 4</a>
<div id="#link1">1</div><div id="#link2">2</div><div id="#link3">3</div><div id="#link4">4</div><div id="#link5">5</div><div id="#link6">6</div><div id="#link7">7</div><div id="#link8">8</div><div id="#link9">9</div><div id="#link10">10</div>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>

Test runner

$('a[href^="#"]').click(function() {
 var dest = $($(this).attr('href')).offset().top;
 return false;
});

$('a[href^="#"]').click(function() {
 var $target = $(this.hash).offset().top;
 return false;
});

$('a[href^="#"]').click(function() {
 var link = $(this).attr('href');
 var dest = link.offset().top;
 return false;
});

Revisions

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

• Revision 1: published on March 29, 2011