Best practice for empty javascript event (e.g. onclick="javascript:;") [duplicate]

Question

If you want an event or a link to an empty javascript call, there are several ways, of which I can think of:

<a href="#">Method 1</a>                    <- Ugh... changes URL in browser
<a href="javascript:;">Method 1</a>         <- My currently preferred method
<a href="javascript:void(0);">Method 1</a>  <- Another approach?

What is the best way in terms of cross-browser compatibility and shortness?

Answer 1

Don't use links if they don't... well, link to anything.

Instead, use a span somewhat like this:

<span class="spanlink" onclick=something>This is some text</span>

And in your CSS:

.spanlink {
    text-decoration: underline;
    color: blue;
    cursor: pointer; /* Ragnagord's suggestion in comments */
}