How to Enter JavaScript Using the <script src=" "> tag (external JavaScript)
The second way or method to input JavaScript code into an HTML page is to move the JavaScript code into a separate file, then 'call' it from the HTML. This method is highly recommended because it will provide many advantages and flexibility in creating JavaScript programs.
A JavaScript file is saved in a .js extension, such as: Kode.js, register.js, or Kodeku.js. From the HTML page, we call it using the <script> tag with the src attribute. The src attribute contains the address of the javascript file, as follows:
<script src="code_javascript.js"></script>
Note that the <script> tag remains closed with a closing tag </script>, or you can make it a self closing tag like this:
<script src="code_javascript.js" />
Naming JavaScript files with the .js suffix is simply a consensus among programmers. You can make any suffix or extension, such as: Kode_javascript.aku, or Kode_javascript.duniailkom, as long as the <script> tag matches the file name, such as <script src="kode_javascript.duniailkom"></script>
However, to be more comfortable and not confusing, you should still follow the agreement by using the .js suffix.
As an example program, I will display the alert “Hello World!!” like the previous program code, but this time I will separate it into a separate file. The JavaScript code will be moved to the code_javascript.js file with the following file contents:
alert("Hello World!!")
Yes, just that 1 line, and save it in the same folder where the HTML code will be executed with the file name Kode_javascript.js. Then in the HTML program code, we will run the javascript file as follows:
1 2 3 4 5 6 7 8 9 10 11 12 13 | <! DOCTYPE html> < html > < meta http-equiv = "Content-Type" content = "text/html; charset=UTF-8" /> < head > < title >Belajar JavaScript di Duniailkom</ title > < script src = "kode_javascript.js" ></ 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 > |
Note that in the code_javascript.js file I immediately wrote the alert command, and it was called by the <script> tag on the 7th line of the example HTML file above.
- Using <script> tags (internal JavaScript)
- Using the <script scr="”> tag (external JavaScript)
- Using Event Handlers (Inline JavaScript)
- Using URL (href:="javascript:")