How to enter (input) JavaScript code into HTML
JavaScript is a type of scripting language, which is used in HTML files. To input, or insert JavaScript code into HTML, JavaScript provides 4 alternatives, namely:
1. Using <script> tags (internal JavaScript)
2. Using the <script scr="”> tag (external JavaScript)
3. Using Event Handlers (Inline JavaScript)
4. Using URL (href:="javascript:")
In this javascript tutorial we will cover these 4 methods.
How to Insert JavaScript using <script> tag (internal JavaScript)
The first way to input JavaScript code into an HTML page is to use the <script> tag internally. Internal here means that the JavaScript code is written on the same page as HTML, or in a single HTML file.
This method is the method most often used, if the JavaScript code is not very long, and is only used on 1 page. The JavaScript code to be input is placed between the opening <script> tag and the closing </script> tag as follows:
<script>
//javascript code is placed here
</script>
The <script> tag will tell the web browser that the code between these tags is not HTML, but JavaScript.
In some JavaScript books or tutorials, you may find the use of the <script> tag as follows:
<script type="text/javascript">
//javascript code is placed here
</script>
The use of the type="text/javascript" attribute is used to distinguish javascript from other scripting languages such as VBScript which is written as type="text/vbscript". However, because VBScript is rarely used, almost all modern web browsers make JavaScript the default language, so you don't need to write type="text/javascript". But it's also not wrong if you want to emphasize the use of JavaScript by writing it directly.
On old web pages, sometimes you will also find the use of the language attribute instead of the type attribute as follows:
<script language="text/javascript">
//javascript code is placed here
</script>
The language attribute is deprecated, and it is recommended that it be deprecated.
If you run the program above, then the web browser will display the following results:
As an example of how to input JavaScript with the <script> tag, here is the HTML code:
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 | <!DOCTYPE html><html><meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /><head><title>Belajar JavaScript di Duniailkom</title><script>alert("Hello World!!");</script></head><body><h1>Belajar JavaScript</h1><p>Saya sedang belajar JavaScript di duniailkom.com</p><p>Belajar Web Programming di Duniailkom.</p></body></html> |
In the above example, I put the <script> tag inside the <head> tag of the HTML (on line 7). The <script> tag contains the JavaScript code: alert("Hello World!!");. alert() is a function in JavaScript that will output a message to the web browser. This function is often used in the process of creating JavaScript programs to display simple output. The alert function takes 1 input (argument) of type String. We'll cover how to write JavaScript functions and data types in later tutorials.
