JavaScript Tutorials in Telugu - Lesson 2

image



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:

  1. HyperText Markup Language(HTML) to define the content of web pages
  2. Cascading Style Sheets(CSS) to specify the layout of web pages
  3. 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.