几行代码制作一个简易计算机

html+css+js

代码：几行就可以搞定所有加减乘除功能噢。

<!DOCTYPE html>
<html><head><meta charset="utf-8"><title>计算器</title><style type="text/css">* {margin: 0;padding: 0;border: none;background-color: #F4F7FE;}.box {width: 300px;height: 480px;background-color: #ADD8E6;text-align: center;margin: 20px auto;border-radius: 10px  ;}input {/* background-color: #008CBA; */border: 0.2rem #1b91b5 solid;width:250px ;height: 100px;margin-top: 10px;margin-bottom: 20px;font-size: 26px;//字体大小}button {color: #4C4C4C;width: 60px;//按钮格子宽高height: 70px;font-weight: bold;font-family:"微软雅黑","宋体";border: 0.1875rem #888888 outset;text-align: center;/* text-decoration: none; */display: inline-block;font-size: 26px;//按钮中字体大小margin: 10px 15px;/* cursor: pointer; */border-radius: 12px;}button:focus,button:hover{color:#1B91B5;}</style></head><body><div class="box"><br /> <br /><p>计算器</p><br />  <input type="text" id="inp" disabled="disabled" /><br /><button onclick="addStr('+')">+</button> <button onclick="addStr('-')">-</button><button onclick="addStr('*')">×</button> <button onclick="addStr('/')">÷</button><br /><br /><button onclick="addStr(1)">1</button> <button onclick="addStr(2)">2</button> <buttononclick="addStr(3)">3</button> <button onclick="cls()">C</button> <br /><br /><button onclick="addStr(4)">4</button> <button onclick="addStr(5)">5</button> <buttononclick="addStr(6)">6</button> <button onclick="back1()">←</button><br /><br /><button onclick="addStr(7)">7</button> <button onclick="addStr(8)">8</button> <buttononclick="addStr(9)">9</button> <button onclick="calc()">=</button><br /></div><script>//添加字符function addStr(s) {var inp = document.getElementById("inp");inp.value = inp.value + s;}//计算结果function calc() {var inp = document.getElementById("inp");val = eval(inp.value);inp.value = val;}//清除function cls() {var inp = document.getElementById("inp");inp.value = "";}//返回function back1() {var inp = document.getElementById("inp");var str = inp.value.substr(0, inp.value.length - 1);inp.value = str;}</script></body>
</html>

几行代码制作一个简易计算机相关推荐

python 2048游戏的设计_Python练习：100行代码实现一个简易的2048游戏
一.任务目标 1.一个在命令行下的2048游戏 2.主要实现功能:判断游戏是否结束:在随机空白位置生成新的数字:上下左右四个方向上进行平移数字并将能合并的数字进行合并:接收键盘输入:将数字阵列显示到命 ...
7行代码制作一个超声波测距仪
文章目录一.前言二.制作材料三.完整代码四.制作过程 & 结果展示五.结语一.前言 shineblink core 开发板(简称Core)的库函数支持US-015超声波测距传感器, ...
20行代码做一个简易微信群发工具需要哪些单词
群发工具是一些销售.中介.网课助手等都爱喜欢用的小工具.在微信还支持网页版登录时候,我们可以用wxpy做群发工具,这样更专业更高效.但随着微信关闭了网页版登录后,这个库彻底不能用了.好在我们可以用原始 ...
200行代码写一个简易的dva
在美团实习的时候,第一次接触到dva这样的react框架,回学校的时候,就想有机会自己实现一下这样的框架,虽然自己水平有限,但是可以试一试哈. 目标是实现dva model的同步和异步 dispatc ...
python爬虫入门——13行代码制作英语翻译器教程，小白入门一点通
有些同学一想到爬虫,就觉得很厉害,然后也认为是一个很难学,确实,会爬虫的确是个狠人,爬虫这个东西可以抓取很多东西,但是也并不是那么的难学,入门其实也很简单,爬虫都是一些套路步骤,那么接下来让我们用13 ...
python9行代码_如何用9行Python代码编写一个简易神经网络
原标题:如何用9行Python代码编写一个简易神经网络 Python部落(python.freelycode.com)组织翻译,禁止转载,欢迎转发. 学习人工智能时,我给自己定了一个目标--用Pyth ...
用Python制作一个简易的计时器
前言今天又带来个小玩意 - 用Python制作一个简易的计时器这个其实也能自定义一些东西的就比如名字颜色啥的自己看着改就行有想法的朋友也能自己再写写改改出其他的小功能效果展示实现代码 ...
制作一个简易的计算器
这里写自定义目录标题欢迎使用Markdown编辑器新的改变功能快捷键合理的创建标题,有助于目录的生成如何改变文本的样式插入链接与图片如何插入一段漂亮的代码片生成一个适合你的列表创建一 ...
使用python制作一个简易的远控终端
使用python制作一个简易的远控终端远控终端的本质 1.服务端(攻击者)传输消息 ----> socket连接 ----> 客户端(被攻击者)接收消息 2.客户端执行消息内容(即执行服 ...

几行代码制作一个简易计算机

几行代码制作一个简易计算机相关推荐

最新文章

热门文章