coding180 icon
Coding180
JavaScript-Alert (alert message dialog)

JavaScript-Alert (alert message dialog)

Home > Tutorials > JavaScript > Common Interaction Methods


When we visit a website, sometimes a small window pops up suddenly, with a text of prompt information written on it. 

If you don't click "OK", you can't do any operations on the webpage. This small window is implemented using alert function

Alert Syntax:

alert(string or variable);  

Look at the code below:

<script type="text/javascript">
   var mynum = 30;
   alert("hello!");
   alert(mynum);
</script>

Note: alert pops up a message dialog (with an OK button).

Result: message boxes pop up in order

javascript alert dialog box

js alert box exampple

Notice:

  • Before clicking the "OK" button in the dialog box, no other operations can be performed.
  • Message dialogs are often useful for debugging programs.
  • Alert output content, which can be a string or a variable, similar to document.write.

 

Task - Exercise 11

Supply the code on line 9, use alert to output the content of the variable mychar through the message box, and the dialog box will pop up after clicking the button.

Exercise Code

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>alert</title>
  <script type="text/javascript">
  function rec(){
    var mychar="I love JavaScript";

  }
  </script>
</head>
<body>
    <input name="button" type="button" onClick="rec()" value="Click to popup" />
</body>
</html>

 


user

Robort Gabriel

Lagos, Nigeria

Freelance Web Developer, Native Android Developer, and Coding Tutor.

Skills
  • UI / UX
  • JavaScript
  • Python
  • PHP
  • Kotlin
  • Java
  • Bootrap
  • Android
  • Laravel