六、Js实现一个简单计算机

最新推荐文章于 2024-08-03 18:28:24 发布

蕙惠子

最新推荐文章于 2024-08-03 18:28:24 发布

阅读量2.5k

点赞数 2

分类专栏：前端

本文链接：https://blog.csdn.net/weixin_40976555/article/details/79927447

版权

本文介绍了如何使用JavaScript来创建一个简单的计算机。首先，通过HTML构建计算的基础结构，然后引入外部CSS样式counter.css以美化界面。接着，通过JavaScript添加事件监听，实现计算功能。主要涉及的JavaScript知识点包括indexOf()用于查找字符串位置，join()用于连接数组成字符串，eval()用于执行JavaScript代码，以及substr()用于提取字符串的子串。

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

第一步：html写好结构

用到div元素、table元素、input元素、button元素

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>js简单计算器</title>
    <link rel="stylesheet" href="counter.css">
</head>
<body>
<div>
        <table>
            <tr>
                <td colspan="4"><input type="text" id="input" value="0"></td>
            </tr>
            <tr>
                <td colspan="2"><button class="click" id="reset">C</button></td>
                <td colspan="2"><button class="click" id="reset1">D</button></td>
            </tr>
            <tr>
                <td><button class="click">7</button></td>
                <td><button class="click">8</button></td>
                <td><button class="click">9</button></td>
                <td><button class="click">+</button></td>
            </tr>
            <tr>
                <td><button class="click">4</button></td>
                <td><button class="click">5</button></td>
                <td><button class="click">6</button></td>
                <td><button class="click">-</button></td>
            </tr>
            <tr>
                <td><button class&#