# HTML input two numbers to achieve the function of addition, subtraction, multiplication and division

Time：2021-7-14

## 1、 Parsefloat() function

Make a simple calculator in the web page, and input two numbers in the text box to realize the addition, subtraction, multiplication and division of two numbers.
The parsefloat() function parses a string and returns a floating-point number.
This function specifies whether the first character in a string is a number. If so, the
The string is parsed until it reaches the end of the number, and then the number is returned as a number,
Not as a string.
Syntax: parsefloat (string);

## 2、 JavaScript global properties

attribute describe
Infinity A number representing a positive infinity.
NaN Indicates whether a value is a numeric value.
undefined Indicates an undefined value.

## 3、 Complete code

``````<!DOCTYPE html>
<html lang="en">
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>Document</title>
<script type="text/javascript">
function cal(){
var nums = document.getElementsByName("num");
var sz = document.getElementsByName("js");
var result = document.getElementsByName("rs");
var n1 = parseFloat(nums[0].value);
var n2 = parseFloat(nums[1].value);
/*The parsefloat() function parses a string and returns a floating-point number.
This function specifies whether the first character in a string is a number. If so, the
The string is parsed until it reaches the end of the number, and then the number is returned as a number,
Not as a string.
*/
switch(sz[0].value){
result[0].value = n1 + n2 ;
break;
case "min" :
result[0].value = n1 - n2 ;
break;
case "mul" :
result[0].value = n1 * n2 ;
break;
case "div" :
result[0].value = n1/n2;
break;
}
}
</script>
<body>
<div align="center">
<input type="text" name="num" value="" onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*\$/g, '\$1')" />
<select name="js" size="1">
<option value="min">-</option>
<option value="mul">*</option>
<option value="div">/</option>
</select>
<input type="text" name="num" value=""onkeyup="value=value.replace(/^\D*(\d*(?:\.\d{0,2})?).*\$/g, '\$1')" />
=
<input type="text" name="rs" value=""/><br>
< button id = "BTN" onclick = "cal()" > calculation
</div>
</body>
</html>``````

Effect display:

So far, this article about html input two numbers to achieve addition, subtraction, multiplication and division is introduced here. For more related HTML addition, subtraction, multiplication and division content, please search previous articles of developer or continue to browse the following related articles. I hope you can support developer more in the future!