javascript怎么实现简易的计算器功能

javascript怎么实现简易的计算器功能

本篇内容介绍了“javascript怎么实现简易的计算器功能”的有关知识,在实际案例的操作过程中,不少人都会遇到这样的困境,接下来就让小编带领大家学习一下如何处理这些情况吧!希望大家仔细阅读,能够学有所成!

javascript实现简易计算器,只有两个input输入框,简单实现加减乘除:

简易计算器

简易计算器

+-*/

functioncal(){varnum1=document.getElementById("num1").value;varnum2=document.getElementById("num2").value;varc=document.getElementById("select").value;num1=parseFloat(num1);num2=parseFloat(num2);switch(c){case"+":document.getElementById("result").value=parseInt(num1)+parseInt(num2);break;case"-":document.getElementById("result").value=parseInt(num1)-parseInt(num2);break;case"*":document.getElementById("result").value=parseInt(num1)-parseInt(num2);break;case"/":document.getElementById("result").value=parseInt(num1)/parseInt(num2);break;}}

效果截图:

JavaScript eval() 函数实现计算器:只有一个input输入框:

简易计算器

简易计算器

计算结果:

functioncal(){varnum1=document.getElementById("num1").value;varresult=document.getElementById("result");try{//有值就计算varres=eval("("+num1+")");result.innerHTML=res;}catch(e){console.log(e);result.innerHTML="表达式异常";}}

实现效果:

body里面的背景图片设置:

background-repeat: no-repeat;图片原大小
background-size:100%; 图片全铺满

“javascript怎么实现简易的计算器功能”的内容就介绍到这里了,感谢大家的阅读。如果想了解更多行业相关的知识可以关注恰卡编程网网站,小编将为大家输出更多高质量的实用文章!

发布于 2022-03-29 22:33:32
分享
海报
41
上一篇:基于element-ui动态换肤的方法 下一篇:Netty分布式FastThreadLocal的set方法怎么用
目录

    忘记密码?

    图形验证码