Scribd
Upload
68 views32 pages

Web Development WS 2 - Sahul Kumar Parida (20BCS4919)

This document contains 6 questions related to web development and JavaScript programming. For each question, it provides the code for a JavaScript program or HTML page and describes the expected output. It asks the student to write JavaScript programs that: 1) Change the background color of a paragraph 2) Link an external JS file and include functions for alerts and time of day 3) Create a number guessing game 4) Convert between Celsius and Fahrenheit temperatures 5) Check student grades and return true if an A+ is earned 6) Include functions for prime numbers, guessing games, and leap years

Uploaded by

Sahul Kumar Parida
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
68 views32 pages

Web Development WS 2 - Sahul Kumar Parida (20BCS4919)

This document contains 6 questions related to web development and JavaScript programming. For each question, it provides the code for a JavaScript program or HTML page and describes the expected output. It asks the student to write JavaScript programs that: 1) Change the background color of a paragraph 2) Link an external JS file and include functions for alerts and time of day 3) Create a number guessing game 4) Convert between Celsius and Fahrenheit temperatures 5) Check student grades and return true if an A+ is earned 6) Include functions for prime numbers, guessing games, and leap years

Uploaded by

Sahul Kumar Parida
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/ 32

Name – Sahul Kumar Parida

Class – 20ITA 8
UID – 20BCS4919
SUBJECT- Web Development
DATE-04/07/2021

Ques 1: -

Create a webpage which should have JavaScript program to


set the background colour of a paragraph.
Code: -
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

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

<title>Document</title>

<style>

body {

margin: 70px;

background-color: white;

</style>
</head>

<body>

<button onclick="myFunction()">Try it</button>

<div id="demo">

<p><b>After clicking on the above button, the background colour of the


paragraph will be changed.</b></p>

</div>

<script>

function myFunction() {

document.getElementById("demo").style.backgroundColor = "red";

</script>

</body>

</html>
Output: -
BEFORE CLICKING THE BUTTON:

AFTER CLICKING THE BUTTON:


Ques 2: -
Link a JS file into a HTML file, put an alert, calculate average
number of weeks in human lifetime, create variables to store a
string, program that tells time of the day (morning, afternoon,
night), etc.

Code: -
<!DOCTYPE html>

<html>

<head>

<meta charset=utf-8 />

<title>QUESTION 2</title>

</head>

<body style="background-color:lavender", align="left">

<button type="button" onclick="myfunction()">TAP HERE!</button>

<p id="demo"></p>

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

<button type="button" onclick="distime()">TAP HERE!</button>

<p id="demo1"></p>

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

</body>

</html>
JAVASCRIPT CODE:
var daysInYear = 365;

var daysInWeek = 7;

var yearsInLifetime = 80;

var avgweek;

var greet;

function myfunction() {

avgweek = (daysInYear * yearsInLifetime) / daysInWeek;

document.getElementById("demo").innerHTML = avgweek;

function distime() {

greet = new Date().getHours();

if (greet > 19)

document.getElementById("demo1").innerHTML = greet + " \'Good Night\'";

else if(greet > 7 && greet < 12)

document.getElementById("demo1").innerHTML = greet + " \'Good


Morning\'";

else

document.getElementById("demo1").innerHTML = greet + " \'Good


Afternoon\'";

}
}

Output: -
Ques 3: -
Write a JavaScript program where the program takes a random
integer between 1 to 10, the user is then prompted to input a guess
number. If the user input matches with guess number, the program
will display a message "Good Work" otherwise display a message
"Not matched".
Code: -
<!DOCTYPE html>

<html>

<head>

<meta charset=utf-8 />

<title>QUESTION 3</title>

</head>

<body style="background-color:white(121, 220, 233, 0.925)", align="center">

<p>program to play the game called-:"guess the number"</p>

<button type="button" onclick="game()">click on the button to start


playing</button>

<p id="demo"></p>

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

JAVASCRIPT CODE:
function game(){

alert("!!!Guess The Number!!!")

let a;

while ( a != 0){

let n = prompt("Enter Any Number: ");


if ( n < 0 ){

alert("NOT MATCHED!!!");

else if (n > 0 && n <=9){

alert("NOT MATCHED!!!");

else if( n == 10){

alert("Good work");

break;

a++;

let b = prompt("Want to Play Again (Y/N)??");

if (b == "Y" || b == "y"){

game();

else if(b == "N" || b == "N"){

alert("As Your Wish...Thanks For Playing...");

}
Output: -
Ques 4: -
Write a JavaScript program to convert temperatures to and from
Celsius, Fahrenheit.

Example: [ Formula: c/5 = (f-32)/9 [ where c = temperature in


Celsius and f = temperature in Fahrenheit]

Expected Output :60°C is 140 °F

45°F is 7.222222222222222°C
Code: -
<!DOCTYPE html>

<html lang="en">

<head>

<meta charset="UTF-8">

<meta http-equiv="X-UA-Compatible" content="IE=edge">

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

<title>TEMPERATURE CONVERSION</title>

<style>

body{

background-color:white;

text-align: center;

font-size: 30px;

h2{

text-align: center;

</style>
</head>

<body>

<h2>TEMPERATURE CONVERSION</h2>

<h4>>>CONVERSION OF FAHRENHEIT TO CELSIUS</h4>

<p id="demo1"></p>

<script>

document.getElementById("demo1").innerHTML =

"-- 45 degree Fahrenheit is " + tocelsius(45) + " degree Celsius.";

function tocelsius(fahrenheit){

return(5/9) * (fahrenheit-32);

</script>

<br>

<h4>>>CONVERSION OF CELSIUS TO FAHRENHEIT</h4>

<p id="demo2"></p>

<script>

document.getElementById("demo2").innerHTML =

"-- 60 degree Celsius is " + tofahrenheit(60) + " degree Fahrenheit.";

function tofahrenheit(celsius){

return(celsius*9/5)+32;

</script>

</body>

</html>
Output: -
Ques 5: -
Write a JavaScript program to check the total marks of a student in
various examinations. The student will get A+ grade if the total marks
are in the range 89 to 100 inclusive, if the examination is "Final-exam."
the student will get A+ grade and total marks must be greater than or
equal to 90. Return true if the student gets A+ grade or false otherwise.
Code: -
<!DOCTYPE html>

<html>

<head>

<meta charset=utf-8 />

<title>QUESTION 5</title>

</head>

<body style="background-color:white(121, 233, 196, 0.925)", align="center">

<p>JavaScript program to check the total marks of a student in various


examinations.</p>

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

</body>

</html>

JAVASCRIPT CODE:
var examination = prompt(

"Grades for exam which we need to calculate ?? \n1.) Half Yearly Exams \n2.)
Final Exams \nEnter 1 for Half Yearly Exams or 2 for Final Exams:"

);

var marks = prompt("Total Marks in Selected Exam is: ");

function grade1(num) {

let grade;
if (examination == "1" || examination == 1) {

if (num >= 89 && num <= 100) {

grade = "A+";

if (grade == "A+") {

return true;

} else {

return false;

} else if (examination == "2" || examination == 2) {

if (num >= 90) {

grade = "A+";

if (grade == "A+") {

return true;

} else {

return false;

document.write(grade1(marks));
Output: -
Ques 6: -
Write function in js that prints prime numbers, guess secret number and
print next 20 leap years.
Code: -
<!DOCTYPE html>

<html>

<head>

<meta charset="utf-8">

<meta name="viewport" content="width=device-width">

<title>Program to print prime numbers, guess secret number and print next 20
leap years.</title>

</head>

<body>

<p>Program to play the game-:"Guess the Secret Number"</p>

<button type="button" onclick="game()">Click on this button to start


playing</button>

<p id="demo"></p>

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

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

<script type="text/Javascript">

function calcPrimeNumber()
{

var beginNum = parseInt(document.numbers.firstNum.value);

var endNum = parseInt(document.numbers.secondNum.value);

var primeNumbs = new Array();

var ctr = beginNum;

while(ctr<=endNum)

if(isPrime(ctr)==true)

primeNumbs[primeNumbs.length] = ctr;

ctr = ctr+1;

if (primeNumbs.length == 0)

document.getElementById('output_content').innerHTML = "There were no


prime no within the range.";

else

outputPrimeNums(primeNumbs);

function isPrime(num)

var flag = true;

for(var i=2; i<=Math.ceil(num/2); i++)


{

if((num%i)==0)

flag = false;

break;

return flag;

function outputPrimeNums(primes)

var html = "<h2>Prime Numbers</h2>";

for (i=0;i<primes.length;i++){

html += primes[i] + "<br/>";

document.getElementById('output_content').innerHTML = html;

</script>

</head>

<body>

<form name="numbers">

Beginning Number: <input type="text" name="firstNum" />

End Number: <input type="text" name="secondNum" />

<input type="button" value="Find Prime Numbers"


onclick="calcPrimeNumber()" />

</form>

<div id="output_content">
</div></body>

</body>

</html>

JAVASCRIPT CODE 1:
function game() {

alert("!!!Guess The Secret Number!!!")

let a;

while (a!= 0) {

let n = prompt("Enter Any Number: ");

if (n < 0) {

alert("Not Matched");

else if (n > 0 && n <=9) {

alert("NOT MATCHED");

else if(n == 10) {

alert("Good work");

break;

a++;

let b = prompt("Want to Play Again (Y/N)??");

if (b == "Y" || b == "y") {

game();

else if(b == "N" || b == "N"){


alert("Thanks For Playing...");

JAVASCRIPT CODE 2:
var year = prompt("please input a year to find out the next 20 leap years");

var counter = 20;

function leapyear(years, num) {

//convert years to integer

years = parseInt(years);

var origNum = num;

//add 1 to years just in case current year is leap year

years++;

//this string will hold all of the leap years

var leapYears = '';

//while num is above 0

while (num > 0) {

if (years % 4 === 0 && (years % 100 !== 0 || ( years % 100 === 0 && years %
400 === 0))) {

//if at the last year

if (num === 1) {

//add a period to end

leapYears += years + ".";


}

else {

//otherwise, add a comma and space for other years

leapYears += years + ", ";

//increase years

years++;

//decrease num

num--;

else {

//if not a multiple of 4, just add to years

years++;

//returns sentence after while loop is done

return "The next " + origNum + " leap years are " + leapYears;

//write to document the result of running leapyear

document.write(leapyear(year, counter));

Output: -
Printing next 20 leap years

Guessing the secret number


Printing the Prime Numbers
Ques 7: -
What will be the Output of the following XML Code.
 
 
<students>
 <student>
   <name>Rick Grimes</name>
   <age>35</age>
   <subject>Maths</subject>
   <gender>Male</gender>
 </student>
 <student>
   <name>Daryl Dixon </name>
   <age>33</age>
   <subject>Science</subject>
   <gender>Male</gender>
 </student>
 <student>
   <name>Maggie</name>
   <age>36</age>
   <subject>Arts</subject>
   <gender>Female</gender>
 </student>
</students>
 
OUTPUT:

TABLE STUDENT

NAME AGE SUBJECT GENDER


RICK GRIMES 35 MATHS MALE
DARYL DIXON 33 SCIENCE MALE
MAGGIE 36 ARTS FEMALE
Ques 8: -
Write the code in XML to print the following Output.
 
Title Author Publisher ISBN

The Moon Is a Harsh R. A. Heinlein Orb 0312863551


Mistress

Fahrenheit 451 R. Bradbury Del Rey 0345342968

The Silmarillion J.R.R. Tolkien G Allen & Unwin 0048231398

1984 G. Orwell Signet 0451524934

Frankenstein M. Shelley Bedford 031219126X

Code: -
<books>

<book>

<title>The Moon is a Harsh Mistress</title>

<Author>R.A. Heinlein</Author>

<Publisher>Orb</Publisher>

<ISBN>0312863551</ISBN>

</book>

<book>

<title>Fahrenheit 451</title>

<Author> R.Bradbury</Author>

<Publisher>DEL RAY</Publisher>

<ISBN>0345342968</ISBN>

</book>

<book>
<title>The Silmarillion</title>

<Author>J.R.R. Tolkien</Author>

<Publisher>G Allen & Unwin</Publisher>

<ISBN>0048231398</ISBN>

</book>

<book>

<title>1984</title>

<Author>G. Orwell</Author>

<Publisher>Signet</Publisher>

<ISBN>0451524934</ISBN>

</book>

<book>

<title>Frankenstein</title>

<Author>M. Shelley</Author>

<Publisher>Bedford</Publisher>

<ISBN>031219126X</ISBN>

</book>

</books>

You might also like

pFad - Phonifier reborn

Pfad - The Proxy pFad of © 2024 Garber Painting. All rights reserved.

Note: This service is not intended for secure transactions such as banking, social media, email, or purchasing. Use at your own risk. We assume no liability whatsoever for broken pages.


Alternative Proxies:

Alternative Proxy

pFad Proxy

pFad v3 Proxy

pFad v4 Proxy