Where does a href="#" pointing (at|to)??

Question

Can someone tell me, what the href with the "#" means?

<a id="logoutLink" href="#">Logout</a>

Answer 1

It is the shortest way to say "go nowhere" :)

Often something else is bound to that link, a javascript event handler in most cases. But if an <a> doesn't have a href, most browsers don't render it with the same styling...so you need a short something to put there.

If it had something following the hash, like <a href="#topics">Go to Topics</a> it is a scroll to link, it goes to where the element with id="topics" is at the top of the page. A common example is <a href="#top">Go to Top</a>, and you stick a <div id="top"></div> at the very top of the page.

Answer 2

As others have pointed out, hash anchors (those beginning with the # sign) typically lead to a named anchor on the page. A table of contents on a page might be a good example of where you'd see this:

<ul>
  <li><a href="#history">Company History</a></li>
  <li><a href="#goals">Our Goals</a></li>
  <li><a href="#products">Products We Offer</a></li>
  <li><a href="#services">Services We Offer</a></li>
</ul>

<h2><a name="history">History</a></h2>
<p>The #history anchor tag will lead to the named anchor above.</p>

<h2><a name="goals">Our Goals</a></h2>
<p>The #goals anchor tag will lead to the named anchor above.</p>

<h2><a name="products">Products We Offer</a></h2>
<p>The #products anchor tag will lead to the named anchor above.</p>

<h2><a name="services">Services We Offer</a></h2>
<p>The #services anchor tag will lead to the named anchor above.</p>

One thing to note is that when you have a blank hash as the anchor href (i.e.: <a href="#">Blah</a>), some browsers make that jump to the top of the page, which is not the desired effect. To work around this and prevent the page from scrolling all the way to the top, a JavaScript implementation is often included to prevent the anchor tag from acting as it normally would by returning false.

<a href="#" onclick="return false;">Blah</a>