JS Alert Box : Popup Box



JavaScript Popup Box : Alert Box

  1. Alert box is used as POPUP box in JavaScript.
  2. Alert box pops-up with message and ‘OK’ button.
  3. Alert box have string displayed on it .
  4. When an alert box pops up, the user will have to click “OK” to proceed.

Syntax :

alert("Sample Text");
  • Sample Text” will be displayed when alert box pops up.

Sample Image of Alert Box

JavaScript Popup Box : Alert Box

JavaScript Popup Box : Alert Box

Live Example

<html>
<head>
<script type="text/javascript">
function show_alert_box()
{
alert("Hello! This is sample alert box!");
}
</script>
</head>
<body>

<input
  type="button"
  onclick="show_alert_box()"
  value="Show alert box"/>

</body>
</html>

Output


Different Varieties of Alert Box in JavaScript

Verity 1 : Alert box Pops-up when page gets completely loaded

<html>
<body>

<script type="text/javascript">
alert("Hello world")
</script>

</body>
</html>

Verity 2 : Using Concatenation of Strings and Variable in Alert Box

<html>
<body>

<script type="text/javascript">
var name = "Pritesh"
alert("My name is: " + name)
</script>

</body>
</html>
  1. “+” is used as concatenation operator.
  2. “+” Can join two string and variables.

Rule : How to concatenate ?

String + String = String
Number + String = String
String + Number = String
Number + Number = Number

Sample 1 : Number + Number

<script type="text/javascript">
alert(1 + 1)
</script>

Output :

2

Sample 2 : String + Number

<script type="text/javascript">
alert("1" + 1)
</script>

Output :

11

Verity 3 : Javascript alert box that pops-up when a link is clicked

<html>
<body>
<a href='javascript:onClick = alert("Alert")'>Click Me</a>
</body>
</html>
  • When User Clicks on Link , Alert message will be displayed to the user.

Output :

Click Me
Download Live Example : Click Here