So far we have learnt about HTML and CSS. In this tutorial we will move a step ahead i.e. we will discuss about JavaScript.


Motivation

As we already know,

HTML gives structure to web pages.

CSS specifies layout and styles the web pages.

So, JavaScript controls the dynamic activity and maintains behavior in web pages. To learn JS, one must have basic knowledge of HTML


What is JavaScript?


JavaScript is a client side scripting language. 

It is used to make web pages alive and dynamic in nature.

JavaScript is important to connect the data to server-side.

It is executed not only in the browser but also on the server i.e. it can be used as both front-end and back-end.

It is very secured. Outsiders cannot reach to the data.

It also allows to create games, mobile applications, etc.

Codes written in JS are known as scripts.


Real World Scenario


Consider a car as a web page. HTML is related to web pages as the structure is given to the car. CSS is responsible like designing, coloring, styling in the car. So, the car is ready by its look and structure. Now, to make it work and ready to drive, engines are provided. Similarly, to make the web pages alive, JavaScript is required. JavaScript is related to web pages as the engines to the car. 

DOM- A brief overview

DOM stands for document object model. JS can't understand HTML document but can understand objects. DOM is a form of representation of the HTML documents where each elements and tags are represented as objects. It is a hierarchical representation of the HTML document. JS interact with HTML document by DOM. JS looks at DOM in terms of nodes.

We will study about DOM in detail in later section.


                                                             



Syntax for JavaScript:

JS code is placed within <script> tags i.e. in between <script> and </script> of the HTML document.


JavaScript in <head>

<!DOCTYPE html>
<html>
<head>
<script>

  document.write("Hello coders")

</script>
</head>
<body>
<h2>JavaScript in Head</h2>
</body>
</html>


JavaScript in <body>

<!DOCTYPE html>

<html>
<body>
<h2>JavaScript in Body</h2>

<script>
document.write("JavaScript in body")
</script>

</body>
</html>