0% found this document useful (0 votes)
2 views6 pages

Assignment2 2

The document contains four HTML files, each implementing different functionalities: a wave sort algorithm, a sum of multiples calculator, a number reversal tool, and a BMI calculator. Each file includes JavaScript for handling user input and displaying results. The designs are simple and focus on user interaction through buttons and input fields.

Uploaded by

love020weii
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)
2 views6 pages

Assignment2 2

The document contains four HTML files, each implementing different functionalities: a wave sort algorithm, a sum of multiples calculator, a number reversal tool, and a BMI calculator. Each file includes JavaScript for handling user input and displaying results. The designs are simple and focus on user interaction through buttons and input fields.

Uploaded by

love020weii
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/ 6

ASSIGNMENT 2.

2
1.Wavesort.html
<!DOCTYPE html>
<html>
<head>
<title>Wave Sort</title>
</head>
<body>

<script>

function waveSort(arr) {
arr.sort((a, b) => a - b);

for (let i = 0; i < arr.length - 1; i += 2) {


let temp = arr[i];
arr[i] = arr[i + 1];
arr[i + 1] = temp;
}

return arr;
}

let arr = [10, 5, 6, 3, 2, 20, 100, 80];


let sortedArr = waveSort(arr);
console.log(sortedArr);

</script>

</body>
</html>
2.Multiples.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Sum of Multiples</title>
<style>
body{
background-color: cadetblue;
padding-left: 0ch;
text-align: justify;
border-radius: 130;
}
button{
color: rgb(28, 40, 36);
border-bottom: 5cm;
text-align: justify;
text-decoration: solid;
}
</style>
</head>
<body>
<label for="limit">Enter limit:</label>
<input type="number" id="limit">
<button onclick="calculateSum()">Calculate Sum</button>
<p id="result"></p>

<script>
function calculateSum() {
const limit = parseInt(document.getElementById('limit').value);
let sum = 0;

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


if (i % 5 === 0 || i % 7 === 0) {
sum += i;
}
}

document.getElementById('result').textContent = 'Sum of multiples


of 5 and 7 up to ' + limit + ': ' + sum;
}
</script>
</body>
</html>
3.reversal.html
<!DOCTYPE html>
<html>
<head>
<title>Reverse Number</title>
<script>
function reverseNumber(num) {
const reversed =
parseInt(num.toString().split('').reverse().join(''));
return reversed;
}

function reverseAndDisplay() {
const originalNumber =
document.getElementById('numberInput').value;
const reversedNumber = reverseNumber(originalNumber);
document.getElementById('result').innerHTML = "Reversed
Number: " + reversedNumber;
}
</script>
</head>
<body>
<h2>Reverse a Number</h2>
<label for="numberInput">Enter a Number:</label>
<input type="text" id="numberInput">
<button onclick="reverseAndDisplay()">Reverse</button>
<p id="result"></p>
</body>
</html>
4.bmi.html
<!DOCTYPE html>
<html>
<head>
<title>BMI Calculator</title>
<style>
body {
font-family: Arial, sans-serif;
margin: 0;
padding: 0;
box-sizing: border-box;
display: flex;
justify-content: center;
align-items: center;
background-color: #c6b8b8;
}
#container {
background-color: #847c7c;
padding: 20px;
border-radius: 5px;
box-shadow: 0 0 10px rgba(61, 8, 8, 0.1);
}
input[type="text"] {
width: 100%;
padding: 10px;
margin-bottom: 10px;
border: 1px solid #ccc;
border-radius: 5px;
box-sizing: border-box;
}
button {
width: 100%;
padding: 10px;
background-color: #59626c;
color: #fff;
border: none;
border-radius: 5px;
cursor: pointer;
}
button:hover {
background-color: #536170;
}
#result {
font-weight: bold;
margin-top: 10px;
}
</style>
</head>
<body>
<div id="container">
<h2>BMI Calculator</h2>
<p id="loadingMessage">Welcome</p>
<label for="weight">Weight (kg):</label>
<input type="text" id="weight">
<label for="height">Height (m):</label>
<input type="text" id="height">
<button onclick="calculateBMI()">Calculate BMI</button>
<p id="result"></p>
</div>

<script>
function calculateBMI() {
var weight =
parseFloat(document.getElementById('weight').value);
var height =
parseFloat(document.getElementById('height').value);

if (isNaN(weight) || isNaN(height) || weight <= 0 || height


<= 0) {
document.getElementById('result').innerText = "Please
enter valid weight and height.";
return;
}

var bmi = weight / (height * height);


bmi = bmi.toFixed(2);

var interpretation;
if (bmi < 18.5) {
interpretation = "Underweight";
} else if (bmi >= 18.5 && bmi < 25) {
interpretation = "Normal weight";
} else if (bmi >= 25 && bmi < 30) {
interpretation = "Overweight";
} else {
interpretation = "Obese";
}
document.getElementById('result').innerText = "Your BMI is
" + bmi + ". You are " + interpretation + ".";
}
</script>
</body>
</html>

You might also like