happy cat image

Start Web Coding

Your First step toward web coding,
Start Web Coding

change UI

alert()

This time, let's look at the alert window.

Have you ever seen a small box on the web while surfing the web?

You do not have it?

alert_img

The box shown in the image above is the alert window. It is used as one of ways to tell something

Today, let 's learn how to pop up this alert window.

JavaScript

alert('hi');

If you put the above source into the script tag, the box will appear and the text hi will be printed.

When entering a string, enclose it in quotes.

Let's try source and see how it looks.

JavaScript

<script>
alert('hi');
</script>

Just put the JavaScript source in the script tag as above.

Now, let's type the full source below.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>JavaScript</title>
<script>
alert('hi');
</script>
</head>
<body>
</body>
</html>

As above, an altar window opens and shows hi. ^ - ^

Operation in alert() window

It is also possible to perform arithmetic operations in the alert() window. For example, writing 5 + 3 will show the result, 8.

JavaScript

Example: alert (5 + 3); Computes 5 + 3 because it is recognized as a number.
False: alert ('5 + 3'); '' Because it is recognized as a character string and is not operated.

I write this operations as I wrote below. Do not enclose the quotation marks in a string, as the computer must recognize it as a number.

So let's write the actual source.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>JavaScript</title>
<script>
alert(5+3);
</script>
</head>
<body>
</body>
</html>

If you look at the above results, you can see that the result 8 is displayed in the alert window.

So what should I do to show the phrase 12 * 6 = 72 in the Alert window?

Then I'll write this.

12 * 6 = is enclosed in quotes because it is represented by a string.

72 follows the string "12*6=", and it represents the operation "12*6"

Then '12 * 6 = 'as above, we need to connect this to 12 * 6. For the connection, we need +. Therefore,

alert('12*6='+12*6);

So let's write the actual source.

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<title>Java Script </title>
<script>
alert('12*6='+12*6);
</script>
</head>
<body>
</body>
</html>

You can try typing the source or you can see the results from this source on the web.

You can also print the value of the variable by inserting the variable name. Let's check the result of this in the next lesson, the variable declaration. ^ - ^ Then I will finished the lesson on alert window.

강좌로 돌아가기