Scribd
Upload
24 views5 pages

Introduction To Javascript

Pdf

Uploaded by

shozigaming
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
24 views5 pages

Introduction To Javascript

Pdf

Uploaded by

shozigaming
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
You are on page 1/ 5

1.

Introduction to JavaScript

JavaScript is a programming language used to make web pages


interactive. It runs in the browser and allows you to add features like form
validation, animations, and dynamic content.

2. Variables

Variables are containers for storing data values. You can declare them
using let, const, or var.

Syntax:

javascript

let name = "John"; // Using let

const age = 25; // Using const

var city = "New York"; // Using var (older method)

Explanation:

 let is used for variables that can change.

 const is for variables that shouldn’t change.

 var is outdated but still works.

3. Functions

Functions are blocks of reusable code that perform a specific task.

Syntax:

javascript

function greet() {

alert("Hello, Students!");

Explanation:

 function is the keyword to define a function.

 greet is the function's name.

 Inside the {}, we write the code to execute.


4. Conditions

Conditions allow you to execute different code based on certain


conditions.

Syntax:

javascript

let score = 85;

if (score > 50) {

alert("You passed!");

} else {

alert("You failed!");

Explanation:

 if checks the condition.

 else runs when the if condition is false.

5. Loops

Loops are used to repeat actions.

Syntax:

javascript

for (let i = 0; i < 5; i++) {

console.log("Number: " + i);

Explanation:

 for initializes, checks the condition, and updates the variable.

 console.log() outputs text to the browser console.

6. Example: Interactive HTML and JavaScript


Here’s how you can integrate JavaScript into HTML:

Step 1: Write the HTML

html

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-


scale=1.0">

<title>JavaScript Basics</title>

</head>

<body>

<h1>Welcome to JavaScript Class</h1>

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

<p id="message"></p>

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

</body>

</html>

Step 2: Write the JavaScript (script.js)

javascript

// Display a greeting when the button is clicked

function sayHello() {

document.getElementById("message").innerText = "Hello, welcome to


JavaScript!";

Explanation:
 The onclick attribute in the <button> runs the sayHello() function
when clicked.

 document.getElementById("message") selects the <p> element


with ID message and updates its text.

<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta name="viewport" content="width=device-width, initial-


scale=1.0">

<title>Display Variables and Loops</title>

</head>

<body>

<h1>JavaScript Demo</h1>

<p id="variable-result"></p>

<p id="loop-result"></p>

<script>

// Declare a variable and display it

let name = "John";

document.getElementById("variable-result").innerText = "The value of the


variable is: " + name;

// Use a loop to display results in the HTML

let loopResult = "Loop results:<br>";

for (let i = 1; i <= 5; i++) {

loopResult += "Number: " + i + "<br>";

}
// Update the HTML element with the loop results

document.getElementById("loop-result").innerHTML = loopResult;

</script>

</body>

</html>

You might also like