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

Question

If you want an event or a link to an empty javascript call, there are several ways 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 brevity?

Answer 1

JQuery solution.

 $('a.preventDefault').click(function(){ return false }); <a href="#" class="preventDefault">Method 1</a> 

Answer 2

Do not use links unless they are ... well, a link to something.

Instead, use 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 suggestion in comments */ } 

Answer 3

How about a button ? I never use anchors unless they are kept anywhere.

Answer 4

Using unobtrusive Javascript .

Also, if the link does nothing without Javascript, then a user without Javascript will not even be able to see the link. Add the link in Javascript.