How to use JavaScript
For write JavaScript code, all you need is a basic text editor like Notepad in Windows, Gimp in Linux. Some text editors, like Brackets, Atom etc. feature syntax highlighting for JavaScript. These editors will allow you easily identify elements of JavaScript code.
We write JavaScript code between the <script> .... </script> tag and , the <script type="text/javascript"> and </script> tells where the JavaScript starts and ends.
JavaScript files are identified by the .js file extension.
There are 2-ways to use JavaScript code.
The first one involves embedding all the JavaScript code directly into the HTML page.
The second method an external javaScript code file ( .js file extension).
# Now we will see how a JavaScript code is put into Html page :
In HTML, JavaScript code must be inserted between the <script> and </script> tags.
You can also specify the language by adding a type attribute <script type="text/javascript">. However, from HTML5, The type attribute is not required. JavaScript is the default scripting language in html, so this attribute is optional if you are using <script> tag in Html.
In Html page 3-places to put the JavaScript code.
- Between the <body> and </body> tag of html
- Between the <head> and </head> tag of html
- JavaScript in both <head> and <body> tag of html.
1.) JavaScript in <head> tag section : Scripts to be executed when they are called, or when an event is triggered, go in the <head> tag section. When you place a <script> tag in the <head> tag script, you will ensure that the script is loaded before anyone uses it.
➤ Basic Syntax:
<html>
<head>
<script>
// Write your JavaScript code here.......
</script>
</head>
<body>
// Write your HTML code here.......
</body>
</html>
2.) JavaScript in <body> tag section : Scripts tag to be executed when the page loads go in the body section, When you place a script in the body section it generates the content of the page.
➤ Basic Syntax:
<html>
<head>
</head>
<body>
<script>
// Write your JavaScript code here.......
</script>
</body>
</html>
3.) JavaScript in both <head> and <body> tag section : You can place an unlimited number of <script> tags in your document, So you can have <script> tag in both the <head> and <body> tag section.
➤ Basic Syntax:
<html>
<head>
<script>
// Write your JavaScript code here.......
</script>
</head>
<body>
<script>
// Write your JavaScript code here.......
</script>
</body>
</html>
# JavaScript in external file
Sometimes you might want to run the same JavaScript code on several pages, without having to write the same <script> on every page. To simplify this can write a JavaScript in an external file.
JavaScript external files are save with a .js file extension.
First, You create a JavaScript file whose extension is .js and place it in the JavaScript subfolder. Placing the JavaScript file in the JavaScript folder is not required however it is a good practice.
Then, use external scripts file with a full URL or with a path relative to the current web page, So that you can link the JavaScript source code file in the src attribute of the <script> element.
=> Let's Create a JavaScript external file :
➤ External file: myScriptFile.js
document.write("Hello JavaScript!");
=> Let's see, How to use external JavaScript file :
In this example links to a <script> located in the same folder as the current page:
➤ Example
<script src="myScriptFile.js"> </script>
In this example uses a script located in a specified folder on the current web site:
➤ Example
<script src="/JavaScript/myScriptFile.js"> </script>
In this example uses a full URL to link to a script:
➤ Example
<script src="https://tutorials.coderwebsite.com/JavaScript/myScriptFile.js"> </script>
Note:
- In the external script can not contain the <script> tag.
- External JavaScript file can be added into the <body> and <head> tag.
Comments