如何使用HTML和JS实现简单的计算器

发布时间:2022-03-01 10:28:28 作者:小新
来源:亿速云 阅读:106

这篇文章主要介绍了如何使用HTML和JS实现简单的计算器,具有一定借鉴价值,感兴趣的朋友可以参考下,希望大家阅读完这篇文章之后大有收获,下面让小编带着大家一起了解一下。

  <!doctypehtml>

  <html>

  <head>

  <metacharset="utf-8">

  <title>无标题文档</title>

  <linkrel="stylesheet"type="text/css"href="untitled.css">

  </head>

  <scripttype="text/javascript">

  varresult="";

  functionjisuan(num){

  if(num=="="){

  document.form1.text.value=eval(result);

  }else{

  result=result+num;

  document.form1.text.value=result;

  }

  }

  </script>

  <body>

  <pclass="box">

  <formaction=""class="form1"name="form1">

  <pclass="header">

  <inputtype="text"id="text"name="text"class="text"/>

  </p>

  <pclass="nav">

  <tableclass="table">

  <tr>

  <td><inputid="1"style="height:55px;width:55px;"type="button"value="1"onClick="jisuan(this.id)"/></td>

  <td><inputid="2"style="height:55px;width:55px;"type="button"value="2"onClick="jisuan(this.id)"/></td>

  <td><inputid="3"style="height:55px;width:55px;"type="button"value="3"onClick="jisuan(this.id)"/></td>

  <td><inputid="+"style="height:55px;width:55px;"type="button"value="+"onClick="jisuan(this.id)"/></td>

  </tr>

  <tr>

  <td><inputid="4"style="height:55px;width:55px;"type="button"value="4"onClick="jisuan(this.id)"/></td>

  <td><inputid="5"style="height:55px;width:55px;"type="button"value="5"onClick="jisuan(this.id)"/></td>

  <td><inputid="6"style="height:55px;width:55px;"type="button"value="6"onClick="jisuan(this.id)"/></td>

  <td><inputid="-"style="height:55px;width:55px;"type="button"value="-"onClick="jisuan(this.id)"/></td>

  </tr>

  <tr>

  <td><inputid="7"style="height:55px;width:55px;"type="button"value="7"onClick="jisuan(this.id)"/></td>

  <td><inputid="8"style="height:55px;width:55px;"type="button"value="8"onClick="jisuan(this.id)"/></td>

  <td><inputid="9"style="height:55px;width:55px;"type="button"value="9"onClick="jisuan(this.id)"/></td>

  <td><inputid="*"style="height:55px;width:55px;"type="button"value="*"onClick="jisuan(this.id)"/></td>

  </tr>

  <tr>

  <td><inputid="/"style="height:55px;width:55px;"type="button"value="/"onClick="jisuan(this.id)"/></td>

  <td><inputid="0"style="height:55px;width:55px;"type="button"value="0"onClick="jisuan(this.id)"/></td>

  <td><inputid="."style="height:55px;width:55px;"type="button"value="."onClick="jisuan(this.id)"/></td>

  <td><inputid="="style="height:55px;width:55px;"type="button"value="="onClick="jisuan(this.id)"/></td>

  </tr>

  </table>

  </p>

  </form>

  </p>

  </body>

  </html>

感谢你能够认真阅读完这篇文章,希望小编分享的“如何使用HTML和JS实现简单的计算器”这篇文章对大家有帮助,同时也希望大家多多支持亿速云,关注亿速云行业资讯频道,更多相关知识等着你来学习!

推荐阅读:
  1. JS实现一个简单的计算器
  2. HTML和JS如何实现计算器

免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:is@yisu.com进行举报,并提供相关证据,一经查实,将立刻删除涉嫌侵权内容。

html js

上一篇:如何使用原生js实现倒计时功能

下一篇:如何解决iframe标签嵌套问题

相关阅读

您好,登录后才能下订单哦!

密码登录
登录注册
其他方式登录
点击 登录注册 即表示同意《亿速云用户服务条款》