本篇文章给大家分享的内容是如何用JS来生成一个简单计算机，有着一定的参考价值，有需要的朋友可以参考一下
第一步：html写好结构
用到p元素、table元素、input元素、button元素
nbsp;html>js简单计算器
登录后复制
第二步：css添加样式 使用外部样式链接 counter.css
*{ margin: 0; padding: 0;}p{ width: 290px; height: 338px; margin: 20px auto; border: 1px solid black;}#input,#reset,.click{ text-align: center; font-size: 16px; font-weight: 700;}#input{ width: 282px; height: 50px; text-align: right;}#reset{ width: 142px; height: 50px;}#reset1{ width: 142px; height: 50px;}.click{ display: inline-block; width: 70px; height: 55px;}
登录后复制
第三步：添加js事件对计算机进行操作
思路：
用到的知识点：
indexOf()方法返回某个指定字符串值在字符串中首次出现的位置；
语法 stringObject.indexOf(substring,startpos)
join() 方法用于把数组中的所有元素放入一个字符串。
eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码；
语法：eval(string)
substr()方法从字符串中提取从startPos位置开始的指定数目的字符串；
语法：stringObject.substr(startPos,length)
代码：
/*获取操作对象*/var key=false;var res=[];var text=document.getElementById("input");var btn=document.getElementsByClassName("click");for(var i=0;i0) { res[res.length-1]=txt; return; } } key=true; res[res.length]=text.value; res[res.length]=txt; text.value=0; } else if(txt=='C') { res=[]; text.value=0; } else if(txt=='D') { text.value=text.value.substr(0,text.value.length-1); } else if(txt=='=') { res[res.length]=text.value; //text.value=eval(res.split(" ",res.length-1)); console.log(res);//输出分割后的数组 text.value=eval(res.join(""));//join("")字符串用空格分割，eval()字符串转化为数值，用数值运算赋给文本框 res=[]; } }}
登录后复制
以上就是如何用JS来生成一个简单计算机的详细内容，更多请关注【创想鸟】其它相关文章！
版权声明：本文内容由互联网用户自发贡献，该文观点仅代表作者本人。本站仅提供信息存储空间服务，不拥有所有权，不承担相关法律责任。如发现本站有涉嫌抄袭侵权/违法违规的内容， 请发送邮件至253000106@qq.com举报，一经查实，本站将立刻删除。
发布者：PHP中文网，转转请注明出处：https://www.chuangxiangniao.com/p/2772820.html
