HTML CSS JAVASCRIPT PYTHON JAVA

JavaScript Introduction

JavaScript is a powerful programming language used to create dynamic and interactive web pages. It allows developers to add functionality such as animations, form validation, events, and much more.

What is JavaScript?

JavaScript is a scripting language that runs in the browser. It works together with HTML and CSS to build modern web applications.

Why Learn JavaScript?

JavaScript Example

In the following example, a button is connected to a JavaScript function. When the button is clicked, the function executes and displays a message using an alert box. This demonstrates how JavaScript can handle user events and add interactivity to a web page.

Example
<!DOCTYPE html>
<html>
<body>

<button onclick="showMessage()">Click Me</button>

<script>
function showMessage() {
  alert("Hello, JavaScript!");
}
</script>

</body>
</html>
Try this code

JavaScript in HTML

JavaScript code can be written inside HTML using the <script> tag. It can be placed in the <head> or <body> section. 

<script>
console.log("Hello World");
</script>

External JavaScript

JavaScript can also be written in a separate file and linked to an HTML document. This helps keep code organized and reusable. 

<script src="script.js"></script>

JavaScript Output

JavaScript can display output in different ways:

JavaScript Can Change HTML Content

JavaScript can be used to dynamically change the content of HTML elements. In the example below, when the user clicks the button, JavaScript selects the paragraph using its id and updates its text using the innerHTML property. This allows web pages to respond instantly to user actions.

Example
<!DOCTYPE html>
<html>
<body>

<p id="demo">Javascript can change html content</p>

<button type="button"
onclick='document.getElementById("demo").innerHTML = "Hello 
JavaScript!"'>Click Me</button>

</body>
</html>
Try this code

JavaScript Can Change CSS

JavaScript can also be used to change the style of HTML elements dynamically. In the example below, when the user clicks the button, JavaScript selects the paragraph and changes its text color using the style property. This allows developers to modify the appearance of elements in real time.

Example
<!DOCTYPE html>
<html>
<body>

<p id="text">Styled Text</p>

<button type="button"
onclick='document.getElementById("text").style.color = "red"'
>Click Me</button>

</body>
</html>
Try this code

JavaScript Use Cases

Why JavaScript is Important