Is there any good reason to keep using href = '#' for javascript links?

Question

As you all know, it is very common to have this code:

<a href='#' class='edit'>Edit</a> 

Then it connects to the event handler (using jQuery or any other hip these days)

or even with built-in js handlers

 <a href='#' onclick='editThis()'>Edit</a> 

I know this is a lazy way to show a pointer / pointer to a link to a link, but this can be easily fixed only with this css:

  a { cursor:pointer; } 

(This takes less time to write once in the stylesheet than writing href = '#' to each link)

The presence of href='#' also causes an annoying inconvenience, prompting the browser to go to the top of the page if, for some reason, the handler was not able to attach itself to the element (the mouse starts a happy user, an impatient type, ...)

My question is, is there any good reason to keep using href='#' ?

Will this remove the violation of browser behavior in several specific contexts?

EDIT . I get a really random answer to this question, maybe I should clarify.

Question: if I set the manual cursor (and underline and color - thanks Borealid) via css, can I completely get rid of the href attribute

This question is NOT about what is the best href or how to attach event handlers

Answer 1

I don’t use tags for js calls at all, they are messy and gives the answer you are talking about. If I make an anchor, I use it completely, but if you do not just use the class as your selector, the rest is in css.

Answer 2

Optimally, you would link to a page that can be used if the user has disabled Javascript or wants to open the editing screen in a new tab:

 <a href="/edit-profile/" class="edit-profile-link">Edit Profile</a> 

Thus, if something goes wrong, functionality will not be lost.

Of course, creating an AJAX editing screen and a standard editing screen is a lot of work. If you don’t want to do all this and you don’t care about Javascript users, you can use this:

 <a href="javascript:;" class="edit-profile-link">Edit Profile</a> 

Answer 3

Using CSS is better. No, removing # will not violate browser behavior. However, the CSS that you have is not adequate enough: you will also need to change the text color and underline style, as well as perform hover processing and possibly differentiate the subsequent links.

Answer 4

Setting href = "#" in this case basically wants to stop the default event. I really answered a similar question to this one here .

Answer 5

From a purist point of view, I would say that you are breaking the network, not including the href attribute. If the browser does not support javascript, your link will not work for them. The fact that the point of view of purists is simply href pointing to "#" is irrelevant in any case.

In the past, you used an anchor without href to indicate a place on the page, but it seems that using the anchor tag without href is deprecated in HTML5:

http://www.html-5.com/changes/deprecated/a-name-tag.html

So, the point of view of a purist is that you are breaking the Internet.

The realistic prospect is that you need to re-establish any behavior that the browser gives you for free in CSS due to your HTML - this will mean that the browser is not satisfied with something in your HTML. And given that anchors without href are out of date. Common sense tells me to continue to use href = "#" to avoid the moment of the front palm when you are dealing with a strange browser-based error that results from this minor DOM violation.