Thursday, January 07, 2016

ARITHMETIC OPERATION PROGRAM USING JAVASCRIPT AND HTML

ARITHMETIC OPERATIONS (+, -, /, *)

JavaScript Program

<!DOCTYPE html>

<html>
<head>
 <title>Arithmatic Operation +,-,*,/</title>
 <style type="text/css">
 #demo,#demo1,#demo2,#demo3{
  color: red;
 }
 </style>
 <script type="text/javascript">
  function myValue(){
  var a=document.getElementById('val').value;
  var b=document.getElementById('val1').value;
  var c=a * b;
  var d=a - b;
  var e= a / b;
  var f= parseInt(a) + parseInt(b);
 

  document.getElementById('demo').innerHTML=c;
  document.getElementById('demo1').innerHTML=d;
  document.getElementById('demo2').innerHTML=e;
  document.getElementById('demo3').innerHTML=f;
   
  }
  
 </script>
</head>
<body style="text-align: center;">
 <h1>Arithmatic Operation</h1>
 <h2>Enter The Values</h2>
 <input type="text" value="1st Number" id="val">
 <input type="text" value="2nd Number" id="val1">
 <input type="submit" onclick="myValue()">
 <h1>Multiplication = <span id="demo"></span></h1>
 <h1>Subtraction = <span id="demo1"></span></h1>
 <h1>Division = <span id="demo2"></span></h1>
 <h1>Addition = <span id="demo3"></span></h1>
</body>
</html>

NOTE: While Addition(+) parseInt function is used to make the value a real integer, otherwise it will concatenate the two strings. Because the value taken by document.getElementById('demo2').value always considers it as a string and not numbers.

OUTPUT:

No comments:

Post a Comment