设计一个计算器，实现0-9数字间的加减乘除运算

最新推荐文章于 2022-11-04 13:21:03 发布

匿名用户小易

最新推荐文章于 2022-11-04 13:21:03 发布

阅读量2.4k

点赞数 1

文章标签：计算器加减乘除 html

本文链接：https://blog.csdn.net/qq_43571150/article/details/103413571

版权

本文介绍了如何设计一个计算器，使用JavaScript来实现0-9数字之间的加、减、乘、除运算。通过获取DOM元素并操作，或者利用jQuery库进行交互处理。

摘要由CSDN通过智能技术生成

设计一个计算器，实现0-9数字间的加减乘除运算

提示：
（1）采用JavaScript定义加减乘除方法；
（2）通过document.getElementById()获得DOM中的元素并进行操作，也可以自学jQuery相关方法并应用于此处。

在这里插入图片描述

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org" >
  <head>
    <meta charset="utf-8">
    <meta name="Generator" content="">
    <meta name="Keywords" content="">
    <meta name="author" content="">
    <title>计算器</title>
    <link th:href="@{/static/css/calculator/calculator.css}" rel="stylesheet">
  </head>
  <style>
  @charset 'utf-8';

body{
   
    font-size:12px;
    font-family:"Times New Roman",Times,  serif:color:#555;
    text-align:center;
    background:#e2e2e2;
}
h6{
   
    margin:0;
    font-size:12px;
}
#calculator{
   
    width:94%;
    height:auto;
    overflow:hidden;
    margin:10px auto;
    border:#fff 1px solid;
    padding-bottom:10px;
    background-color:#f2f2f2;
}
#calculator div{
   
    clear:both;
}
#calculator ul{
   
    padding:0;
    margin:5px 14px;
    border:#fff 1px solid;
    height:auto;
    overflow:hidden;
}
#calculator li{
   
    list-style:none;
    float:left;
    width:14.43%;
    margin:0.5%;
    display:inline;
    line-height:32px;
    font-size:32px;
    background