What Does javascript:void(0) Mean in JavaScript Links?

By the end of this page, you will understand what javascript:void(0) does, why it has been used inside href attributes, what the void operator returns, and why modern code usually prefers better alternatives such as buttons or event listeners that prevent default link behavior.

javascript:void(0) is an old JavaScript pattern often placed inside an anchor tag's href attribute.

<a href="javascript:void(0)">login</a>

To understand it, break it into two parts:

• javascript: is a special URL scheme that tells the browser to execute JavaScript code instead of navigating to a normal web address.
• void(0) runs the JavaScript expression 0, then forces the result to be undefined.

So this:

href="javascript:void(0)"

means:

• when the link is clicked,
• execute a tiny bit of JavaScript,
• return nothing useful,
• and do not navigate to another page.

Why developers used it

Developers often used it when they wanted an <a> element to look like a link or be clickable, but they did not want it to actually go anywhere. They would then attach a click handler with JavaScript.

Example:

Think of an anchor tag as a door with an address written on it.

• A normal link like /login says: "Go to this place when clicked."
• javascript: says: "Instead of going somewhere, run this instruction."
• void(0) says: "Run it, but produce no meaningful result."

So javascript:void(0) is like putting a fake destination on the door that tells the browser, "Do not travel anywhere; just stay here."

That is why it was often used for clickable UI elements that were not really navigation links.

The basic pattern looks like this:

<a href="javascript:void(0)">Click me</a>

What void does

In JavaScript, void evaluates an expression and always returns undefined.

console.log(void 0);      // undefined
console.log(void(123));   // undefined
console.log(void 'test'); // undefined

0 is not special here because of its value. It is just a simple expression. These all behave similarly:

void 0;
void(0);
void 99;
();

Consider this example:

<a href="javascript:void(0)" id="loginlink">login</a>

<script>
  document.getElementById('loginlink').addEventListener('click', function () {
    console.log('Login clicked');
  });
</script>

Here is what happens step by step when the user clicks the link:

1. The browser detects a click on the <a> element.
2. The click event listener attached with addEventListener runs.
3. console.log('Login clicked') prints the message.
4. The browser also checks the href attribute.
5. Because the href starts with javascript:, the browser treats the rest as JavaScript code.
6. It evaluates void(0).

Although javascript:void(0) is less common in new code, you may still encounter it in real situations.

1. Legacy web applications

Older dashboards and admin panels often used it for menu items, modal triggers, and expandable sections.

<a href="javascript:void(0)" onclick="openMenu()">Menu</a>

2. Placeholder links during development

Sometimes developers used it temporarily before adding a real destination.

<a href="javascript:void(0)">Coming soon</a>

This works, but a plain button or disabled UI is usually better.

3. JavaScript-controlled UI actions

Links were often used to trigger:

• login popups,
• tab switching,
• accordion toggles,
• dropdown menus,
• client-side widgets.

4. Reading older libraries or templates

If you work with old jQuery plugins, CMS themes, or inherited codebases, you may see many anchors using this pattern.

Understanding it helps you safely refactor those parts into more modern code.

In real projects today, developers usually avoid putting JavaScript directly in href. Instead, they separate structure, behavior, and meaning.

Common modern patterns

Use a button for actions

If the click performs an action instead of navigation:

<button id="loginButton">login</button>

document.getElementById('loginButton').addEventListener('click', function () {
  openLoginModal();
});

This is the most semantic pattern.

Use a real link plus preventDefault

If the element is conceptually a link, but JavaScript may intercept it:

<a href="/login" id="loginLink">login</a>

.().(,  () {
  event.();
  ();
});

1. Using a link for something that is not navigation

Broken idea:

<a href="javascript:void(0)" id="saveBtn">Save</a>

Why it is a problem:

• saving is an action, not navigation;
• a <button> is more appropriate.

Better:

<button id="saveBtn">Save</button>

2. Thinking void(0) means “do nothing” everywhere

It does not stop all JavaScript. It only evaluates an expression and returns undefined.

console.log(void 0); // undefined

It does not cancel events by itself.

3. Mixing behavior into HTML

Older style:

Quick reference

Meaning

href="javascript:void(0)"

• javascript: = run JavaScript from the URL
• void(0) = evaluate 0, then return undefined
• result: no useful navigation target

void operator

void 0;      // undefined
void(123);   // undefined
void 'text'; // undefined

Why it was used

• make a link clickable without navigating
• attach behavior with JavaScript
• common in older code

Why it is usually avoided now

• mixes JavaScript into HTML
• weaker semantics
• less maintainable
• accessibility concerns

Better choices

For actions:

<>Open

What does javascript:void(0) do in HTML?

It tells the browser to execute JavaScript instead of following a normal URL. The void(0) expression returns undefined, so the link does not navigate anywhere useful.

Why is void(0) used instead of just 0?

Because void forces the result to be undefined. The goal is to avoid returning a value that might be treated differently by the browser.

Is javascript:void(0) the same as return false?

No. void(0) simply evaluates to undefined. return false is used in certain event-handling contexts to stop default behavior, depending on how the handler is written.

Is javascript:void(0) bad practice?

In modern code, it is usually not the best option. It is mostly a legacy pattern. Prefer buttons for actions and real links for navigation.

Can I use href="#" instead?

You can, but clicking it may jump the page to the top unless you call . It is usually better to use a button for actions.

• Anchor tags (<a>) — Related because javascript:void(0) is commonly used inside an anchor's href.
• Buttons (<button>) — Important because buttons are usually the better semantic choice for actions.
• JavaScript void operator — This is the core language feature behind void(0).
• Event handling — Click behavior is usually controlled with event listeners instead of inline JavaScript.
• event.preventDefault() — Common modern alternative for stopping default link navigation.
• Progressive enhancement — Helps build pages that work as links first, then add JavaScript behavior.
• Semantic HTML — Important for choosing the correct element based on meaning and behavior.
• Accessibility — Relevant because using links for non-navigation actions can confuse keyboard and assistive technology users.