Friends, today I will tell you through this article. That how you can calculate division two numbers by javascript using html form with demo. So let’s try to understand.
Friends, you can create division calculator in very easy way by javascript. You have to first create a function in javascript. You can name that function in your own way. Then you have to take two variables in the same function in which you can get the value through id. Then you have to divide both those variables by taking another variable. And then you will get your answer.
create division calculator by javascript, create division two number calculator using javascript with html, css
Overview
Step 1:- Create html file for division calculator.
Step 2:- Add JavaScript Code in this file.
Let me explain to you by doing practical.
First you create a form of division. Then Add button divide in it.
Step 1:- Create html file for division calculator.
division-calculate.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Division of Two Numbers Using JavaScript Or Jquery</title>
<style>
body {margin: 30px;}
</style>
</head>
<body>
<h1>Division of Two Numbers Using JavaScript Or Jquery</h1>
<form>
1st Number : <input type="text" id="firstNumber" /><br>
2nd Number: <input type="text" id="secondNumber" /><br>
<input type="button" onClick="divide()" Value="Divide" />
</form>
<b>The Result is : <br>
<span id="answer"></span>
</b>
</body>
</html>
Step 2:- Add JavaScript Code in this file.
Then add the division code of javascript in this form.
<script>
function divide()
{
number1 = document.getElementById("firstNumber").value;
number2 = document.getElementById("secondNumber").value;
document.getElementById("answer").innerHTML = number1 / number2;
}
</script>
Now you have been given the complete code below to manage it correctly. Also along with the link to the demo, you can copy and paste this code in your file and run it on your server.
division-calculate.html
<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>Division of Two Numbers Using JavaScript Or Jquery</title>
<style>
body {margin: 30px;}
</style>
</head>
<body>
<h1>Division of Two Numbers Using JavaScript Or Jquery</h1>
<form>
1st Number : <input type="text" id="firstNumber" /><br>
2nd Number: <input type="text" id="secondNumber" /><br>
<input type="button" onClick="divide()" Value="Divide" />
</form>
<b>The Result is : <br>
<span id="answer"></span>
</b>
<script>
function divide()
{
number1 = document.getElementById("firstNumber").value;
number2 = document.getElementById("secondNumber").value;
document.getElementById("answer").innerHTML = number1 / number2;
}
</script>
</body>
</html>