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

Question

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.

The anchor tag method you speak of is just the old way I guess. — BoltClock
– BoltClock, Commented Sep 6, 2011 at 22:06

Johnny Oshika · Accepted Answer · 2011-09-06 22:14:48Z

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.

Ulrich Dangel · Accepted Answer · 2011-09-06 22:11:41Z

Depends on what you need/want. Using links have the benefit they will be displayed as links (other color, different mouse cursor, possibility to search only for links, maybe accessibility issues, etc.)

Using spans does not do this but has other benefits like no different color if you activated or visited the link already.

That being said there is IMHO no real benefit for choosing either method probably depends if the text should be displayed/behave like a link or not.

The text isn't intentioned as a link, but something a user should feel like clickable. keeping track of whether it got displayed isn't required in this case.

grisevg · Accepted Answer · 2011-09-06 22:18:35Z

For span look like an anchor you have to setup colors (standard and hover. And there'is no way to set Visited for it), underline and cursor:pointer. Still think it's cleaner?

Collectives™ on Stack Overflow

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

3 Answers 3

Comments

1 Comment

Comments

Hot Network Questions

Collectives™ on Stack Overflow

3 Answers 3

Comments

1 Comment

Comments

Related