使用JavaScript怎么编写一个计算器功能 - 行业资讯 - 肥雀云

　　介绍

这篇文章给大家介绍使用JavaScript怎么编写一个计算器功能,内容非常详细,感兴趣的小伙伴们可以参考借鉴,希望对大家能有所帮助。

一、实现功能

(1)利用css样式,JavaScript语言和html语言实现计算器的算法(2)对计算器的页面进行规划以及对界面进行颜色的填涂(3)对界面各个边框边距进行适当的调整

二、展示

<强> 1。代码展示

代码如下:

& lt; ! DOCTYPE html> 　　& lt; html lang=癳n"祝辞　　& lt; head> 　　,& lt; meta charset=癠TF-8"比; 　　,& lt; meta name=皏iewport",内容=翱矶?设备宽度,初始=1.0,比; 　　,& lt; title>计算器& lt;/title> 　　　　,& lt; style> 　　身体,{ 　　,填充:0;保证金:0; 　　background - color,:浓汤; 　　,} 　　计算器,# { 　　,位置:绝对; 　　,宽度:1200 px;高度:620 px; 　　,左:50%,最高:50%; 　　,margin-left: -600 px; 　　,margin-top: -310 px; 　　,} 　　#,# calculator c_title { 　　,保证金:汽车; 　　,宽度:800 px; 　　,身高:80 px; 　　,margin-left: 150 px; 　　,} 　　,# calculator # c_title h3 { 　　,text-align:中心; 　　,字体大小:33 px;字体类型:微软雅黑,颜色:# 666666; 　　,不必:1 px 1 px 1 px 1 px rgba (0, 0, 255,,。2); 　　,} 　　,# calculator 输入{# c_text 　　,padding-right: 20 px; 　　,margin-left: 50 px; 　　,宽度:970 px; 　　,高度:50 px; 　　,字体大小:25 px;字体类型:微软雅黑,颜色:# 666666; 　　,text-align:正确; 　　,边界:double 1 px; 　　,边界:1 px solid 黑色; 　　,} 　　#,# calculator c_value { 　　,寡妇:1080 px; 　　,身高:408 px; 　　,保证金:20 px 汽车; 　　,} 　　,# calculator # c_value ul { 　　,保证金:0 px; 　　,} 　　#,# calculator c_value ul 李{ 　　,保证金:10 px; 　　,list-style:没有; 　　,浮动:左; 　　,宽度:180 px; 　　,身高:80 px; 　　,行高:80 px; 　　,text-align:中心; 　　background - color,:珊瑚; 　　,边界:0 px solid 黑色; 　　,字体大小:30 px; 　　,字体类型:微软雅黑; 　　,颜色:# 666; 　　,不必:12 px 12 px 2 px 1 px rgba (0, 0, 255,,。2); 　　,} 　　#,# calculator c_value ul li 按钮{ 　　,宽度:160 px; 　　40岁,身高:px; 　　,字体大小:20 px; 　　,} 　　,& lt;/style> 　　　　,& lt; script> 　　,function onLoad () { 　　,//加载完毕后光标自动对应到输入框　　,. getelementbyid (“input") .focus (); 　　,} 　　,//读取按钮的值,传给输入框　　,function 事件(e) { 　　,//把val的值改为每个事件的innerHTML值,innerHTML 属性　　,var val=e.innerHTML; 　　,//获取输入标签　　,var xsval=. getelementbyid (“input"); 　　,//标签里的价值连接每个事件的innerHTML值　　,xsval.value +=val; 　　,} 　　,//计算出结果　　,function inputOper () { 　　,var xsval=. getelementbyid (“input");//获取输入标签　　,xsval.value=https://www.yisu.com/zixun/eval (. getelementbyid(“输入”)value);//eval()方法计算　　}//清零　　函数clearNum () { 　　var xsval=. getelementbyid("输入");//获取输入标签　　xsval.value=" "; 　　. getelementbyid(“输入”).focus (); 　　}//退格　　函数backNum () { 　　var arr=. getelementbyid("输入");//获取输入标签　　arr.value=arr.value.substring (0, arr.value.length-1);//substring()提取第一个至倒数第二个字符串　　}> 头　　　　身体<> 　　