Skip to content
Related Articles

Related Articles

How to calculate multiplication and division of two numbers using JavaScript ?
  • Last Updated : 31 Mar, 2021

An arithmetic operation operates on two numbers and numbers are called operands. 

Multiplication The multiplication operator (*) multiplies two or more numbers.

Example:

var a =1 5;
var b = 12;
var c = a × b;

Approach: Create the html form to take input from user to perform multiplication operation. Add javascript code inside html to perform multiplication logic. Document.getElementById(id).value property returns the value of the value attribute of a text field.

Below is the implementation of the above approach:



HTML




<!DOCTYPE html>
<html>
  
<head>
  <style type="text/css">
    body {
      margin: 30px;
    }
  </style>
</head>
  
<body>
  <form>
    1st Number : <input type="text" 
    id="firstNumber" /><br>
    2nd Number: <input type="text" 
    id="secondNumber" /><br>
    <input type="button" onClick="multiplyBy()" 
    Value="Multiply" /><br>
  </form>
  
  <p>The Result is : <br>
   <span id = "result"></span>
  </p>
  
  
  <script>
    function multiplyBy()
    {
      num1 = document.getElementById(
        "firstNumber").value;
      num2 = document.getElementById(
        "secondNumber").value;
      document.getElementById(
        "result").innerHTML = num1 * num2;
    }
  </script>
</body>
  
</html>

Output:

Multiplication of 2 numbers

Division The division operator (/) divides two or more numbers.

Example:

var a = 50;
var b = 20;
var c = a / b;

Approach: Create the html form to take input from user to perform division operation. Add JavaScript code inside html to perform division logic. Document.getElementById(id).value property returns the value of the value attribute of a text field.

Below is the implementation of the above approach:

HTML




<!DOCTYPE html>
<html>
  
<head>
  <style type="text/css">
    body {
      margin: 30px;
    }
  </style>
</head>
  
<body>
  <form>
    1st Number : <input type="text"
    id="firstNumber" /><br>
    2nd Number: <input type="text" 
    id="secondNumber" /><br>
    <input type="button" onClick="divideBy()" 
     Value="Divide" />
  </form>
  
  <p>The Result is : <br>
    <span id = "result"></span>
  </p>
  
  
  <script>
    function divideBy() 
    
      num1 = document.getElementById(
        "firstNumber").value;
      num2 = document.getElementById(
        "secondNumber").value;
      document.getElementById(
        "result").innerHTML = num1 / num2;
    }
  </script>
</body>
  
</html>

Output:

Division of 2 numbers

My Personal Notes arrow_drop_up
Recommended Articles
Page :