Href attribute for links: “javascript:void(0)” or “#”?

include script tags in HTML

“javascript:void(0)” or “#”, these are two type by which we can call a JavaScript code. But, what do you prefer to do most?

These are for a building a link that has the sole purpose of running JavaScript code. But, in terms of functionality, page loading speed, validation purposes, etc. It may come to our mind that which is better.

For example, look at these below code:

<a href="#" onclick="myFunction();">Click Here</a>
<a href="javascript:void(0)" onclick="myFunction();">Click Here</a>
<a href="javascript:myFunction();">Click Here</a>

As, it does not cause problems but it’s a like the same as PreventDefault. While you are using “#” then, you will jump to the top of the page and the URL will append the anchor # as well.
To avoid this, you can simply return false; or use javascript:void(0);

And, <a onclick=”myFunction();”> Does not appear as a link, because there’s no href</a>. The only thing you can do is put a style {text-decoration:underline;} and you will have “link look-like”.

The void operator is often used to obtain the undefined primitive value i.e. usually using “void(0)”. The reason you’d want to do this with the href of your link is that normally, a javascript: URL which will redirect to the browser to a plain text version of the result of evaluating that JavaScript.
But, if a result is undefined, then the browser stays on the same page as it was. void(0) is only the smallest script that is possible to evaluates as undefined.

But, note to remember that all that code was good back few years ago, though now it can be a bad practices now. Now, there are easier, better and more maintainable and scalable ways of accomplishing your desired result.

Leave a Reply

Your email address will not be published. Required fields are marked *