Search code examples
htmljqueryevent-handlinganchorjquery-events

Any advantage of <a href="javascript:void(0);"> over <span> link text </span>

I have some HTML DOM elements for which I need to capture click events, like a drop-down menu widget, etc. I guess we can implement in 2 ways:

<a href="javascript:void(0);" id="option1">My text</a>

or another way is:

<span id="option2">My text 2</span>

In the second option, of course I can add CSS property cursor:pointer.

All I need is to capture the click event, for which I can have the same click handler function for both the cases.

Do you think there is any reason why we would use anchor tag method?

The second option looks more clean. Also, the IE has a default behavior for anchor tag click events, which can have unwanted consequences, etc.

Solution

  • Some benefits of the anchor tag:

    • you can provide a default behavior for users who don't have JavaScript enabled (if you care about that).
    • tabbing on the keyboard will set focus on anchor tags by default.
    • you get default styles that may be desirable on anchor tags.