JavaScript

javascript:void(0)

Hello. In this tutorial, we will create a simple HTML page and understand the use of the javascript:void(0).

You can also check this tutorial in the following video:

JavaScript Tutorial for Beginners – Video

1. Introduction

1.1 What is a Javascript

It is lightweight object-oriented programming used for scripting HTML pages. It helps users to build modern applications by directly modifying the HTML and CSS to enhance the user interface with a DOM API.

1.2 What is javascript:void(0)

The void operator will evaluate the expression and returns an undefined. The javascript:void(0) is used when a developer does not want the page to be refreshed or load a new page in the browser by clicking on a hyperlink. It is represented by the below syntax.

Syntax

javascript:void(0);

2. javascript:void(0)

To set up the application, we will need to navigate to a path where our project will reside and I will be using Visual Studio Code as my preferred IDE. Let a take a quick peek at the project structure.

2.1 Setting up HTML page

In the below HTML file we are defining a clickable link where we are using the void(0); keyword. When a user clicks on this link it will do nothing.

jsvoidzero.html

<html>
  <head>
    <title>Index</title>
    <style>
      .dec-non {
        text-decoration: none;
      }
    </style>
  </head>
  <body>
    <h2>Good morning world!</h2>
    <h3>Example of <i>javascript:void(0);</i></h3>
    <a id="nullid" href="javascript:void(0);" class="dec-non">
      <span>It will do nothing</span>
    </a>
  </body>
</html>

3. Demo

Double click on the html file and it will open the page in the browser. Now when the user clicks on the link it will do nothing because of javascript:void(0) keyword.

Fig. 1: Application output page

That is all for this tutorial and I hope the article served you with whatever you were looking for. Happy Learning and do not forget to share!

4. Summary

In this tutorial, we learned about javascript:void(0) keyword and created a simple HTML application. You can download the source code from the Downloads section.

5. Download the Project

This was a tutorial to understand the javascript:void(0) keyword.

Download
You can download the full source code of this example here:

Want to know how to develop your skillset to become a Java Rockstar?

Join our newsletter to start rocking!

To get you started we give you our best selling eBooks for FREE!

 

1. JPA Mini Book

2. JVM Troubleshooting Guide

3. JUnit Tutorial for Unit Testing

4. Java Annotations Tutorial

5. Java Interview Questions

6. Spring Interview Questions

7. Android UI Design

 

and many more ....

 

Receive Java & Developer job alerts in your Area

I have read and agree to the terms & conditions

 

Yatin

An experience full-stack engineer well versed with Core Java, Spring/Springboot, MVC, Security, AOP, Frontend (Angular & React), and cloud technologies (such as AWS, GCP, Jenkins, Docker, K8).
Subscribe
Notify of
guest

This site uses Akismet to reduce spam. Learn how your comment data is processed.

0 Comments
Inline Feedbacks
View all comments
Back to top button