Which "href" value should I use for JavaScript links, "#" or "javascript:void(0)"?

href, html, javascript, optimization, performance

Solution

I use `javascript:void(0)`.

Three reasons. Encouraging the use of `#` amongst a team of developers inevitably leads to some using the return value of the function called like this:

function doSomething() {
    //Some code
    return false;
}

But then they forget to use `return doSomething()` in the onclick and just use `doSomething()`.

A second reason for avoiding `#` is that the final `return false;` will not execute if the called function throws an error. Hence the developers have to also remember to handle any error appropriately in the called function.

A third reason is that there are cases where the `onclick` event property is assigned dynamically. I prefer to be able to call a function or assign it dynamically without having to code the function specifically for one method of attachment or another. Hence my `onclick` (or on anything) in HTML markup look like this:

onclick="someFunc.call(this)"

OR

onclick="someFunc.apply(this, arguments)"

Using `javascript:void(0)` avoids all of the above headaches, and I haven't found any examples of a downside.

So if you're a lone developer then you can clearly make your own choice, but if you work as a team you have to either state:

Use `href="#"`, make sure `onclick` always contains `return false;` at the end, that any called function does not throw an error and if you attach a function dynamically to the `onclick` property make sure that as well as not throwing an error it returns `false`.

OR

Use `href="javascript:void(0)"`

The second is clearly much easier to communicate.

Problem

The following are two methods of building a link that has the sole purpose of running JavaScript code. Which is better, in terms of functionality, page load speed, validation purposes, etc.? ``` function myJsFunc() { alert("myJsFunc"); } ``` ``` <a href="#" onclick="myJsFunc();">Run JavaScript Code</a> ``` or ``` function myJsFunc() { alert("myJsFunc"); } ``` ``` <a href="javascript:void(0)" onclick="myJsFunc();">Run JavaScript Code</a> ```

Original source

Related problems