JavaScript (JS)
JavaScript(JS) is the programming language of HTML and the Web.
JavaScript is one of the 3 languages all web developers must learn:
- HyperText Markup Language(HTML) to define the content of web pages
- Cascading Style Sheets(CSS) to specify the layout of web pages
- JavaScript(JS) to program the behavior of web pages
The < script > Tag:
In HTML, JavaScript code is inserted between <script> and </script> tags.
<!DOCTYPE html>
<html>
<body>
<h2>JavaScript in Body</h2>
<p id="demo"></p>
<script>
document.getElementById("demo").innerHTML = "Hello World";
</script>
</body>
</html>
Scripts can be placed in the <body>, or in the <head> section of an HTML page, or in both.
JavaScript in <head> section
<!DOCTYPE html>
<html>
<head>
<script>
function tcwFunction() {
document.getElementById("demo").innerHTML = "The Paragraph changed.";
}
</script>
</head>
<body>
<h1>A Web Page</h1>
<p id="demo">Sample Paragraph</p>
<button type="button" onclick="tcwFunction()">Click Me</button>
</body>
</html>
JavaScript in <body> section
<!DOCTYPE html>
<html>
<head>
<title>Telugu Computer World - JavaScript DEMO</title>
</head>
<body>
<h1>A Web Page</h1>
<p id="demo">Sample Paragraph</p>
<button type="button" onclick="tcwFunction()">Click Me</button>
<script>
function tcwFunction() {
document.getElementById("demo").innerHTML = "The Paragraph changed.";
}
</script>
</body>
</html>
Scripts can also be placed in external files:
External file: tcwScript.js
function tcwFunction() {
document.getElementById("demo").innerHTML = "Paragraph changed.";
}
<!DOCTYPE html>
<html>
<body>
<h2>External JavaScript</h2>
<p id="demo">A Paragraph.</p>
<button type="button" onclick="tcwFunction()">Try it</button>
<p>(myFunction is stored in an external file called "tcwScript.js")</p>
<script src="tcwScript.js"></script>
</body>
</html>
To Understand JavaScript(JS) step by step, watch the above tutorial video.
