htmlcssjs实现一个简单的计算器（超简单）
Posted 364.99°
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了htmlcssjs实现一个简单的计算器（超简单）相关的知识，希望对你有一定的参考价值。
1.效果
2.代码
<head>
<!--强制浏览器编码设为简体中文(GB2312)-->
<meta http-equiv="Content-Type" content="text/html; charset=GB2312">
</head>
<style>
input{
width:50px;
}
</style>
<script>
function calc(){
var num1= document.getElementById("num1").value;
var num2= document.getElementById("num2").value;
var operation = document.getElementById("operation").value;
num1 = parseFloat(num1);
num2 = parseFloat(num2);
//使用if判断句
if(operation == "+"){
var result = num1+num2;
}
else if(operation == "-"){
var result = num1-num2;
}
else if(operation == "*"){
var result = num1*num2;
}
else if(operation == "/"){
var result = num1/num2;
}
//通过ID来设置/返回HTML标签的属性及调用其事件与方法
//使用条件:给每个标签分配一个ID号
document.getElementById("result").value=result;
}
</script>
<input type="text" id="num1" placeholder="输数字">
<input type="text" id="operation" placeholder="运算符">
<input type="text" id="num2" placeholder="输数字">
=
<input type="text" id="result" placeholder="结果">
<input type="button" value="运算" onclick="calc()">
以上是关于htmlcssjs实现一个简单的计算器（超简单）的主要内容，如果未能解决你的问题，请参考以下文章