JavaScript and JQuery Essentials Trainin... (56 Blogs) Become a Certified Professional
AWS Global Infrastructure

Front End Web Development

Topics Covered
  • AngularJS (29 Blogs)
  • jQuery UI Development (2 Blogs)
  • The Complete WebDeveloper (38 Blogs)
  • ReactJS (7 Blogs)
SEE MORE

MI-new-launch

myMock Interview Service for Real Tech Jobs

myMock-widget-banner-bg

How to Create an Alert in JavaScript?

Last updated on Oct 29,2019 51 Views
16 / 29 Blog from JavaScript

MI-new-launch

myMock Interview Service for Real Tech Jobs

myMock-mobile-banner-bg

myMock Interview Service for Real Tech Jobs

  • Mock interview in latest tech domains i.e JAVA, AI, DEVOPS,etc
  • Get interviewed by leading tech experts
  • Real time assessment report and video recording

When you open any website, you might see alert pop-ups at times. These JavaScript alert boxes are useful for alerting users to something important. When a JavaScript alert box is triggered, a small box pops up and displays the text that you specify in your JavaScript code. In this article, we will see how the alert in JavaScript works, in the following sequence:

Let’s begin.

Pop-up Boxes in JavaScript

In JavaScript, you can find three kinds of popup boxes:

  • Alert box- An alert box is mostly used to make sure information comes through to the user. When an alert box pops up, you need to click “OK” to proceed.

  • Confirm box- A confirm box is mostly used to verify or accept something for the user. When a confirm box pops up, the user needs to click either “OK” or “Cancel” to proceed. If the user clicks “OK”, the box returns true. If the user clicks “Cancel”, the box returns false.

  • Prompt box- A prompt box is used by the user to input a value before entering a page. When a prompt box pops up, the user needs to click either “OK” or “Cancel” to proceed after entering an input value. If the user clicks “OK” the box returns the input value. If the user clicks “Cancel” the box returns null.

These were the different types of popup boxes. So, let’s get into the depth of the alert box and see how you can create an alert box in JavaScript.

Alert in JavaScript

The alert() method in JavaScript displays an alert box with a specified message and an OK button. It is often used to make sure that information comes through to the user.

The alert box takes the focus away from the current window and forces the browser to read the message. So, you should avoid overusing this method, as it prevents the user from accessing other parts of the page until the box is closed.

 

Syntax:

alert(message)

Here, the message is a string type that specifies the text to display in the alert box, or an object converted into a string and displayed. It is optional.

Example:

<script>
function myFunction() {
alert("This is an Alert!");
}
</script>

Output:

Alert box - alert in javascript - edureka

How to Create an Alert in JavaScript?

The alert() method in JavaScript displays an alert box. It displays a specified message along with an OK button and is generally used to make sure that the user gets the information. It returns a string which represents the text to display in the alert box. Let’s take an example and see how to create an alert in JavaScript:

<!DOCTYPE html>
<html>

<head>
<title>
Alert() Method in JavaScript
</title>
<style>
h1 {
color: Blue;
}

h2 {
font-family: Impact;
}

body {
text-align: center;
}
</style>
</head>

<body>

<h1>Welcome to Edureka</h1>
<h2>Alert in JavaScript</h2>

<p>
To Display the alert message,
click on the "Show Alert Message" button:
</p>

<button ondblclick="myalert()">
Show Alert Message
</button>

<script>
function myalert() {
alert("This is the Alert Message!");
}
</script>

</body>

</html>

Output:

 

After you double click the button, you will get the following output:

Output 2- Alert in JavaScript - edureka

 

With this, we have come to the end of our article. I hope you understood what is an alert in JavaScript and how you can create an alert box.

Check out our Full Stack Web Developer Masters Program which comes with instructor-led live training and real-life project experience. This training makes you proficient in skills to work with back-end and front-end web technologies. It includes training on Web Development, jQuery, Angular, NodeJS, ExpressJS, and MongoDB.

Got a question for us? Please mention it in the comments section of “Alert in JavaScript” blog and we will get back to you.

Comments
0 Comments

Browse Categories

webinar REGISTER FOR FREE WEBINAR
REGISTER NOW
webinar_success Thank you for registering Join Edureka Meetup community for 100+ Free Webinars each month JOIN MEETUP GROUP

Subscribe to our Newsletter, and get personalized recommendations.