You are on page 1of 8

NAME : HRISHIKESH MUKUND BANKAPUR

PRN : 23610053

BATCH : IT-2

Q1. Perform arithmetic operations by creating functions and JavaScript operators.


Code:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.main-div{
border: 3px solid ;
padding:50px;
width: 200px;
}
h1 { color:red;}
</style>
</head>
<body>
<div class="main-div">
<h1> <u>ARITHMETIC OPERATIONS</u></h1>
Enter 1<sup>st</sup> Number <input type="number" id="num1" ><br><br>
Enter 2<sup>nd</sup> Number <input type="number" id="num2"><br><br>
Enter operator <input type="text" id="optr"><br><br>
<button onclick=showResult() style="background-color: green;
color: white;
border-style: none;
padding: 10px;
border-radius: 5px;
margin-left: 40px;">Evaluate</button><br>
<p id="p1"></p><br>
</div>
<script>
function showResult(){
var result=0
var num1=parseInt(document.getElementById("num1").value)
var num2=parseInt(document.getElementById("num2").value)
var optr=document.getElementById("optr").value
switch(optr){
case '+':
result=num1+num2
break;
case '-':
result=num1-num2
break;
case '*':
result=num1*num2
break;
case '/':
result=num1/num2
break;
}
document.getElementById("p1").innerHTML="Result is "+ result
}
</script>
</body>
</html>

Output :

Q2. Write a function that accepts n numbers and outputs all numbers in increasing order.

CODE:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=\, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div style="border: 3px black solid ; margin-left: 400px; margin-top: 100px;
padding:
50px; align-content: center; width: 400px;">
<h2>Enter a number:
<input type="number" id="num1"><br><br>
Enter a number:
<input type="number" id="num2"><br><br>
Enter a number:
<input type="number" id="num3"><br><br>
Enter a number:
<input type="number" id="num4"><br><br>
<button id="next" onclick=nextNum() style="padding:18px;color:
white;background-color: green; margin-left: 150px; border-style: none; border-
radius: 5px; cursor:
pointer;">NEXT</button><br>
<p id="text"><br></p>
<p id="sorted"></p><br>
</h2>
</div>
<script>
function nextNum(){
num1=parseInt(document.getElementById("num1").value)
num2=parseInt(document.getElementById("num2").value)
num3=parseInt(document.getElementById("num3").value)
num4=parseInt(document.getElementById("num4").value)
const arr=[num1,num2,num3,num4]
document.getElementById("text").innerHTML="Numbers in sorted order :"
document.getElementById("sorted").innerHTML=arr.sort()
}
</script>
</body>
</html>

OUTPUT:
Q3. Write a JavaScript Program to display using all output types. (Alert, Confirm, Prompt,
write, print).
CODE:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
h2,h3{
margin:20px;
text-align: center;
}
button{
color: white;
background-color: rgb(16, 185, 36);
padding: 15px;
margin:20px;
margin-left: 150px;
border-radius: 3px;
border-style: none;
width: 150px;
}
</style>
</head>
<body>
<div style="width: 800px; margin-left: 350px; margin-top: 30px;">
<h2>JavaScript Program to display using all output types: Alert, Confirm,
Prompt,
write, print.</h2>
<h3 id="hi"></h3>
<button onclick=toAlert() >ALERT</button>
<button onclick=toConfirm() >CONFIRM</button><br>
<button onclick=toPrompt() >PROMPT</button>
<button onclick=toWrite() >WRITE</button><br>
<button onclick=toPrint() style="margin-left: 315px;" >PRINT</button><br>
</div>
<script>
function toAlert(){
alert("This program displays an alert message in javascript!")
}
function toConfirm(){
confirm("This is a confirm message on webpage")
}
function toPrompt(){
name=prompt("Please enter your name","hrishi")
if (name!=null){
document.getElementById("hi").innerHTML="Hello" +name+ "!Nice to meet you" ;
}
}
function toWrite(){
document.write("Hey there I am hrishi , this a written using a write function
in javascript !!"
)
}
function toPrint(){
print()
}
</script>
</body>
</html>

OUTPUT:

ALERT:

CONFIRM:
PROMPT:

WRITE:
PRINT:

Q4. Write a JavaScript code for Simple Interest calculator.


CODE:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div style="align-content: center;margin-left:32%; margin-top: 100px; border:
3px
black dashed; width: 400px; padding: 100px;" >
<h2> SIMPLE INTEREST CALCULATOR</h2>
<pre style="font-family: 'Trebuchet MS', 'Lucida Sans Unicode', 'Lucida
Grande',
'Lucida Sans', Arial, sans-serif;">
PRINCIPLE : <input type="number" id="principle">
RATE : <input type="number" id="rate">
TIME : <input type="number" id="time">
</pre>
<button style="background-color: green; color: white;padding: 15px; border-
radius:
5px; border-style: none; cursor: pointer; margin-left: 150px;"
onclick=calc()>CALCULATE
SI</button>
<p id="SI"></p>
<p id="AMT"></p>
</div>
<script>
function calc(){
p=parseFloat(document.getElementById("principle").value)
r=parseFloat(document.getElementById("rate").value)
t=parseFloat(document.getElementById("time").value)
si=p*r*t/100
amt=p+si
document.getElementById("SI").innerHTML="SI = "+si
document.getElementById("AMT").innerHTML=" TOTAL AMOUNT = "+amt
}
</script>
</body>

OUTPUT:

You might also like