0% found this document useful (0 votes)
23 views22 pages

Awdt Aditya

java script programs

Uploaded by

Aditya Chugh
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
0% found this document useful (0 votes)
23 views22 pages

Awdt Aditya

java script programs

Uploaded by

Aditya Chugh
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/ 22

INDEX

Sr. Experiment Date Signature


No
AMITY UNIVERSITY HARYANA

Advanced Web Designing Technologies Lab

Submitted by: Aditya Chugh


Enrolment number:
A50105222016
Course: Btech-CSE
Batch: 2022-2026
Semester:
5th Section:
A
Submitted To: Ms . Deepti
Experiment:
PAGE 1

WAP in JavaScript to print hello world.

let message = "Hello, World!";


console.log(message);

Output:
Experiment:
PAGE 1

WAP in JavaScript to add two numbers.

let num1 = 30;


let num2 = 12;
let sum = num1 + num2;
console.log(sum);

Output:
Experiment:
PAGE 1

WAP in JavaScript to swap two variables.

let a = 45;
let b = 10;

a = a + b;
b = a - b;
a = a - b;

console.log(a + " " + b);

Output:
Experiment:
PAGE 1

WAP in JavaScript to build simple calculator.

let result;
let op = prompt('Enter operation: ');

let n1 = parseFloat(prompt("First number: "));


let n2 = parseFloat(prompt("Second number: "));

switch (op) {
case '+':
console.log(result = n1 + n2);
break;

case '-':
console.log(result = n1 - n2);
break;

case '*':
console.log(result = n1 * n2);
break;

case '/':
console.log(result = n1 / n2);
break;

default:
console.log('Invalid operation');
break;
}

Output:
Experiment:
PAGE 1

WAP in JavaScript to implement Math function.

let a = 4.6;

console.log("Round: " + Math.round(a));


console.log("Ceil: " + Math.ceil(a));
console.log("Floor: " + Math.floor(a));
console.log("Trunc: " + Math.trunc(a));
console.log("Sign: " + Math.sign(a));
console.log("Square root: " + Math.sqrt(a));

let x = 3;
let y = 3;

console.log("Power: " + Math.pow(x, y));

Output:
Experiment:
PAGE 1

WAP in JavaScript to study about regular expression.


1. Searching

let text = "Hello world!";


let searchResult = text.search(/world/);
console.log(searchResult);

Output:

2. Replacing

let text = "Hello, world!";


let replacedText = text.replace(/world/, “India");
console.log(replacedText);

Output:

3. Searching digit

let digitText = "You have Rs.99!”;


let digitSearchResult = digitText.search(/\d/);
console.log(digitSearchResult);

Output:
4. Searching pattern

let patternText = "This is what life is all abouyt!";


let patternResult = /is/;
console.log(patternResult.test(txt));

Output:
Experiment:
PAGE 7

WAP in JavaScript to convert temperature to and from Celsius, Fahrenheit.

let celsius = prompt("Enter Celsius temperature: ");


let fahren = (celsius * 9 / 5) + 32;
console.log("Temperature in Fahrenheit: " + fahren);

let fahrenh = prompt("Enter Fahrenheit temperature: ");


let cel = ((fahrenh - 32) * 5 / 9);
console.log("Temperature in Celsius: " + cel);

Output:
EXPERIMENT - 8

WAP in JavaScript to reverse a number with and without using function.


Without function:

let a = prompt("Enter a number: ");


let rev = 0;

while (a > 0) {
let b = a % 10;
rev = rev * 10 + b;
a = parseInt(a / 10);
}

console.log("Reversed number: " + rev);

Output:

With function:
function reverse() {
let a = prompt("Enter a number: ");
let sum = 0;

while (a > 0) { OUTPUT:


let b = a % 10;
sum = sum * 10 + b;
a = parseInt(a / 10);
}

return sum;
}

const c = reverse();
console.log("Reversed number: " + c);
EXPERIMENT -9

WAP in JavaScript to implement various types of event handler.

<!DOCTYPE html>
<html>
<head>
<title>Event Handlers Example</title>
</head>
<body>
<h1>Event Handlers Example</h1>

<button id="clickButton">Click Me</button> <!-- Button for Click Event -->


<br><br>

<input type="text" id="inputField" placeholder="Type something..."> <!-- Input Event -->


<br><br>

<div id="mouseoverDiv"
style="width: 200px; height: 100px; background-color: lightblue;">
</div> <!-- Mouseover -->

<script>
// Click Event
document.getElementById("clickButton").addEventListener("click", function() {
alert("Button clicked!");
});

// Input Event
document.getElementById("inputField").addEventListener("input", function() {
const inputText = document.getElementById("inputField").value;
console.log("Input changed: " + inputText);
});

// Mouseover Event
document.getElementById("mouseoverDiv").addEventListener("mouseover", function() {
this.style.backgroundColor = "lightgreen";
});
document.getElementById("mouseoverDiv").addEventListener("mouseout", function() {
// Mouseout Event
this.style.backgroundColor = "lightblue";
});
</script>
</body>
</html>
EXPERIMENT -9

Output:
xperiment: 10

WAP in JavaScript to change the background color of paragraph.


<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Change Background Color</title>
<style>
#myText {
background-color: green;
padding: 10px;
color: white;
}

#myBtn {
margin-top: 10px;
}
</style>
</head>
<body>
<div id="myText">
This is some text with a green background. And it will change into a blue background.
</div>
<button id="myBtn" onclick="changeColor()">Change Color</button>

<script>
function changeColor() {
var text = document.getElementById("myText");
text.style.backgroundColor = "blue";
}
</script>
</body>
</html>

Output:
E
xperiment: 11

WAP in JavaScript for line breakup pop up message and to display timer.

<!DOCTYPE html>
<html>
<body>
<h2>JavaScript Timing Sample</h2>
<p>Click on "Try it". Wait 5 seconds, and the page will alert "Hello How are you!!".</p>
<button onclick="setTimeout(myFunction, 5000);">Try it</button>

<script>
function myFunction() {
alert('Hello\n How are you!!');
}
</script>
</body>
</html>

Output:
xperiment: 12-13

WAP in JavaScript to generate random number.

const a = Math.random();
console.log(a);

const b = Math.floor(Math.random() * 10);


console.log(b);

Output:

WAP in JavaScript to trim a string.


let c = " Aditya Chugh ";
console.log(c.trim());

Output:
EXPERIMENT -14
Create your profile page in html or JavaScript.

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Profile Page</title>
<style>
body {
background-color: lightblue;
font-family: Arial, sans-serif;
}
.container {
text-align: center;
margin: 0 auto;
width: 50%;
background-color: red;
padding: 20px;
border-radius: 8px;
}
.profile-pic {
width: 100px;
height: 100px;
border-radius: 50%;
margin-bottom: 10px;
}
table, th, td {
border: 1px solid blue;
border-collapse: collapse;
margin: 10px auto;
}
th, td {
padding: 8px;
}
</style>
</head>
<body>
<div class="container">
<img src="https://cdn1.iconfinder.com/data/icons/avatars-1-5/136/60-512.png" alt="Profile Picture"
class="profile-pic">
<h3>Aditya Chugh</h3>
<p>@lol</p>
<button>Follow</button>
<p>Hello, I am Aditya Chugh. I am pursuing a B.Tech in CSE from Amity University and focusing on
Software Development.</p>
<h4>Educational Qualifications:</h4>
<p>School: Vivekanand Sr. Sec. School</p>
<table>
<tr>
<th>Standard</th>
<th>Percentage</th>
</tr>
<tr>
<td>10th</td>
<td>95.8%</td>
</tr>
<tr>
<td>12th</td>
<td>93.4%</td>
</tr>
</table>
<p>University: Amity University, Gurgaon</p>
<h4>Hobbies:</h4>
<ul>
<li>Listening to Music</li>
<li>Reading Books</li>
<li>Gaming</li>
</ul>
<h4>Achievements:</h4>
<ul>
<li>Completed a Web Development Course</li>
<li>Created a Portfolio Website</li>
<li>Scored 93.4% in 12th grade</li>
</ul>
</div>
</body>
</html>

Output:
Experiment: 15
WAP to implement JavaScript array methods.

const fruits = ['apple', 'banana', 'cherry'];

fruits.push('date');
fruits.unshift('apricot');

const removedFruit = fruits.pop();


const removedFirstFruit = fruits.shift();

const moreFruits = ['grape', 'kiwi'];


const allFruits = fruits.concat(moreFruits);

const slicedFruits = allFruits.slice(1, 4);


slicedFruits.splice(1, 1, 'orange');

allFruits.forEach((fruit) => console.log(fruit));

console.log(allFruits);

Output:

You might also like