In this lesson we will talk about alert in JavaScript, i.e. window.alert(), used to communicate a message to the user.

Alert () is therefore a method of the window object, which serves to show an alert window. The window object is therefore the main JavaScript object and represents the entire browser window. This object also has many methods and properties that we will gradually see throughout this JavaScript tutorial.

We emphasize that using the JavaScript alert method, the dialogue is one-sided, that is, from the site to the user, we will see later other communications that are not.

alert JavaScript – first example

Let’s make an example of using this method right away.

Click a button to display a dialog box with a message.

So try clicking on the send button you see below:

Banner Pubblicitario

A few lines of code are enough to create the example. First of all, our button where we insert the event when the message is clicked.

<div>
   <input name="invia" type="submit" onclick="messagge()">
</div>

N.B. For simplicity, we add the onclick () event to the button for sending data, where we call up our message function, then we will use other methods for managing the events.

Then we develop our very simple JavaScript function which we call message which will simply contain an alert with a message for the user.



function messagge() { 
     alert("stai per inviare i dati"); 
}

N.B. You can write window.alert () or even alert () indiscriminately.

alert JavaScript – second example

The alert () method can also be included in an element, i.e. in an html tag. Nowadays it is not a very common practice, but let’s study its functioning anyway.

So let’s take another example of using JavaScript alert in a tag.

Banner pubblicitario

Let’s say we want to display a dialog with a welcome message when we load our web page.

Just enter the onload event and a simple alert message in the body.

When we load the page, the dialog box will immediately appear, as shown in the figure:

avviso

alert JavaScript – third example

Let’s take yet another example of using alert in an html tag.

Let’s imagine that you have inserted images on our website and we want to inform the author that they are protected by copyright, when, for example, he clicks on them to save them.

Then just insert the onmouseup event with the related alert inside the img tag.

<figure>
   <img src="images/logo_coding_creativo.png" alt="coding creativo" onmouseup="alert('The images are protected by copyright')"> 
</figure>

alert JavaScript – fourth example

You can also place multiple alerts () one under the other.

So here’s an example that uses multiple JavaScript alerts:



function messaggio() { 
   alert("Welcome on Coding Creativo");
   alert("You learn to make coding funny");
}

In this way, the messages will appear one after the other.

Conclusion

In this lesson we have studied some examples of using JavaScript alert, in the next lesson we will deal with the confirm method.

Some useful links

JavaScript tutorial

JavaScript Calculator

Object in JavaScript

For in loop

Caesar cipher decoder

Slot Machine in JavaScript

Introduction to JavaScript language

Learn JavaScript – basic concepts