JavaScript_03 超简计算器
版本一:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>计算器</title><script type="text/javascript">function add(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}let num3 = parseInt(num1) + parseInt(num2);document.getElementById("result").value = num3;}function minus(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}let num3 = parseInt(num1) - parseInt(num2);document.getElementById("result").value = num3;}function multiplication(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}let num3 = parseInt(num1) * parseInt(num2);document.getElementById("result").value = num3;}function divide(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}if (num2 == 0){alert("被除数不能为0")return;}let num3 = parseInt(num1) / parseInt(num2);document.getElementById("result").value = num3;}function remainder(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return;}if (isNaN(num1)){alert("数字1输入错误");return;}if(num2 == ""){alert("数字2不能为空");return;}if (isNaN(num2)){alert("数字2输入错误");return;}let num3 = parseInt(num1) % parseInt(num2);document.getElementById("result").value = num3;}</script>
</head>
<body>
数字1:<input type="text" id="number1"><br>
数字2:<input type="text" id="number2"><br>
<input type="button" value="加" id="add" onclick="add()">
<input type="button" value="减" id="minus" onclick="minus()">
<input type="button" value="乘" id="multiplication" onclick="multiplication()">
<input type="button" value="除" id="divide" onclick="divide()">
<input type="button" value="取余" id="remainder" onclick="remainder()"><br>
结果:<input type="text" id = "result"></body>
</html>结果演示:
版本二:
<!DOCTYPE html>
<html lang="en">
<head><meta charset="UTF-8"><title>计算器</title><script type="text/javascript">function checkData(){let num1 = document.getElementById("number1").value;let num2 = document.getElementById("number2").value;if(num1 == ""){alert("数字1不能为空");return false;}if (isNaN(num1)){alert("数字1输入错误");return false;}if(num2 == ""){alert("数字2不能为空");return false;}if (isNaN(num2)){alert("数字2输入错误");return false;}return true;}function run(choose){if (!checkData()){return;}let num1 = parseInt(document.getElementById("number1").value);let num2 = parseInt(document.getElementById("number2").value);let num3;switch (choose){case '加':num3 = num1 + num2;break;case '减':num3 = num1 - num2;break;case '乘':num3 = num1 * num2;break;case '除':if (num2 == 0){alert("被除数不能为0")return;}num3 = num1 / num2;break;case '取余':num3 = num1 % num2;break;}document.getElementById("result").value = num3;}</script>
</head>
<body>
数字1:<input type="text" id="number1"><br>
数字2:<input type="text" id="number2"><br>
<input type="button" value="加" id="add" onclick="run('加')">
<input type="button" value="减" id="minus" onclick="run('减')">
<input type="button" value="乘" id="multiplication" onclick="run('乘')">
<input type="button" value="除" id="divide" onclick="run('除')">
<input type="button" value="取余" id="remainder" onclick="run('取余')"><br>
结果:<input type="text" id = "result">
</body>
</html>效果同上
相关文章：
JavaScript_03 超简计算器
版本一: <!DOCTYPE html> <html lang"en"> <head><meta charset"UTF-8"><title>计算器</title><script type"text/javascript">function add(){let num1 document.getElementById("number1&qu…...
【重生之我在学习C语言指针详解】
目录 编辑 --------------------------------------begin---------------------------------------- 引言 一、指针基础 1.1 内存地址 1.2 指针变量 1.3 指针声明 1.4 取地址运算符 & 1.5 解引用运算符 *** 二、指针运算 2.1 指针加减运算 2.2 指针关系运算 三…...
深度学习每周学习总结R5（LSTM-实现糖尿病探索与预测-模型优化）
🍨 本文为🔗365天深度学习训练营 中的学习记录博客R7中的内容，为了便于自己整理总结起名为R5🍖 原作者：K同学啊 | 接辅导、项目定制 目录 0. 总结优化细节（目前只采用了1、2两种方式）1. L2 正则…...
单元测试在复杂业务逻辑开发中的重要性与实践
背景 以前编写程序时，我并没有养成大量撰写单元测试的习惯，尤其是在写偏向业务代码的情况下，写的单元测试很少，只有在封装一些公共方法的时候才会写一些测试用例。 然而，最近我在开发的一个业务时，深刻地…...
Kubernetes 环境中的自动化运维实战指南
Kubernetes 作为容器编排领域的领导者，已经成为云原生应用的核心基础设施。然而，随着集群规模的扩大和应用的复杂化，手动运维 Kubernetes 集群变得愈发困难。自动化运维成为提升效率、保障系统稳定性的关键。本文将详细介绍如何在 Kubernetes 环境中实施自动化运维，涵盖工具…...
Linux 如何使用fdisk进行磁盘相关的操作
简介 fdisk 命令是 Linux 中用于管理磁盘分区的强大文本实用程序。它可以创建、删除、调整大小和修改硬盘上的分区。 基本语法 fdisk [options] <device> <device>：要管理的磁盘，例如 /dev/sda、/dev/nvme0n1 或 /dev/vda 示例用法 列…...
嵌入式Linux：如何监视子进程
目录 1、wait()函数 2、waitpid()函数 3、SIGCHLD信号 在嵌入式Linux系统中，父进程通常需要创建子进程来执行特定任务，例如处理网络请求、执行计算任务等。监视子进程的状态不仅可以确保资源的合理利用，还能防止僵尸进程的产生，…...
【信息系统项目管理师-选择真题】2010上半年综合知识答案和详解
更多内容请见： 备考信息系统项目管理师-专栏介绍和目录 文章目录 【第1~2题】【第3题】【第4题】【第5题】【第6题】【第7题】【第8题】【第9题】【第10题】【第11题】【第12题】【第13题】【第14题】【第15题】【第16题】【第17题】【第18题】【第19题】【第20题】【第21题】…...
工作总结：压测篇
前言 压测是测试需要会的一项技能，作为开发，有点时候也要会一点压测。也是被逼着现学现卖的。 一、压测是什么，以及压测工具的选择 压测，即压力测试，是一种性能测试手段，通过模拟大量用户同时访问系统&am…...
doris：STRUCT
STRUCT<field_name:field_type [COMMENT comment_string], ... > 表示由多个 Field 组成的结构体，也可被理解为多个列的集合。 不能作为 Key 使用，目前 STRUCT 仅支持在 Duplicate 模型的表中使用。一个 Struct 中的 Field 的名字和数量固定&…...
二叉树介绍
一.树的概念 树的图： 1.结点的度：一个结点含有子树的个数称为该结点的度； 如上图：A的度为6 2.树的度：一棵树中，所有结点度的最大值称为树的度； 如上图：树的度为6 3.叶子结点或终…...
通过Ngrok实现内网穿透助力远程开发
在现代软件开发和网络应用的环境下，开发人员常常需要在本地搭建服务器进行调试、测试或演示。然而，传统的端口映射（如使用 NAT 或 SSH 隧道）配置繁琐，且并非所有环境都允许直接暴露本地服务。ngrok 作为一款强大的隧道…...
DeepSeek-R1：通过强化学习激励大型语言模型（LLMs）的推理能力
摘要 我们推出了第一代推理模型：DeepSeek-R1-Zero和DeepSeek-R1。DeepSeek-R1-Zero是一个未经监督微调（SFT）作为初步步骤，而是通过大规模强化学习（RL）训练的模型，展现出卓越的推理能力。通过强…...
Node.js基础
浏览器知识 浏览器 个浏览器都内置了DOM、BOM等API函数，供浏览器中的Javascript调用。 每个浏览器都有对应的JavaScript解析引擎。 浏览器中的JavaScript环境 V8引擎负责解析和执行JavaScript代码 内置API是由运行环境提供的特殊接口，只能在所属的运…...
DeepSeek R1：中国AI黑马的崛起与挑战
在人工智能（AI）领域，大型语言模型（LLMs）正以迅猛之势重塑世界，其发展速度和影响力令人瞩目。近期，中国DeepSeek公司发布的DeepSeek R1模型，宛如一颗璀璨新星，凭借卓越的推…...
【JavaEE】_MVC架构与三层架构
目录 1. MVC架构 2. 三层架构 3. MVC架构与三层架构的对比 3.1 MVC与三层架构的对比 3.2 MVC与三层架构的共性 1. MVC架构 在前文已介绍关于SpringMAC的设计模式，详见下文： 【JavaEE】_Spring Web MVC简介-CSDN博客文章浏览阅读967次，点…...
对比DeepSeek、ChatGPT和Kimi的学术写作摘要能力
摘要 摘要是文章的精华，通常在200-250词左右。要包括研究的目的、方法、结果和结论。让AI工具作为某领域内资深的研究专家，编写摘要需要言简意赅，直接概括论文的核心，为读者提供快速了解的窗口。 下面我们使用DeepSeek、ChatGPT…...
ts 进阶
吴悠讲编程 : 20分钟TypeScript进阶！无废话快速提升水平 前端速看 https://www.bilibili.com/video/BV1q64y1j7aH...
Kubernetes（一）
Kubernetes（简称K8s）是一个开源的容器编排平台，已经成为现代云原生应用的核心技术，主要应用于对容器化应用程序的自动化部署、扩展以及管理。k8s配备了一组核心组件以及一系列功能，这些组件能够实现容器的调度、负载均…...
Python里的小整数问题挺有意思的
简单来说，Python为了优化性能，会把一些常用的整数（通常是-5到256）提前创建好，放到一个“缓存池”里。这样，当你用到这些小整数时，Python就不用每次都重新创建对象了，直接从缓存池里拿…...
基于 Jenkins 的测试报告获取与处理并写入 Jira Wiki 的技术总结
title: 基于 Jenkins 的测试报告获取与处理并写入 Jira Wiki 的技术总结 tags: - jenkins - python categories: - jenkins在软件开发的持续集成与持续交付（CI/CD）流程里，及时、准确地获取并分析测试报告对保障软件质量至关重要。本文将详细…...
java.util.Random类（详细案例拆解）（已完结）
前言： 小编打算近期更俩三期类的专栏，一些常用的专集类，给大家分好类别总结和详细的代码举例解释。 今天是除夕，小编先祝贺大家除夕快乐啦！！ 今天是第六个 java.lang.Math 包中的 java.util.Random类 我…...
)
CMake常用命令指南(CMakeList.txt)
CMakeList从入门到精通的文章有很多不再赘述（ 此处附带一篇优秀的博文链接：一个简单例子，完全入门CMake语法与CMakeList编写 ）。 本文主要列举 CMake 中常用命令的详细说明、优缺点分析以及推荐做法，以更好地理解和灵…...
Mybatis是如何进行分页的？
大家好，我是锋哥。今天分享关于【Mybatis是如何进行分页的？】面试题。希望对大家有帮助； Mybatis是如何进行分页的？ 1000道 互联网大厂Java工程师 精选面试题-Java资源分享网 MyBatis 实现分页的方式有很多种，最常见…...
推动知识共享的在线知识库实施与优化指南
内容概要 在当今迅速发展的数字化时代，在线知识库的实施显得尤为重要。它不仅为企业提供了高效的信息存储与共享平台，还能够有效促进团队成员之间的协作与知识传递。通过集中管理企业内的各类知识资源，在线知识库帮助员工快速查找所需信息&a…...
【最后203篇系列】007 使用APS搭建本地定时任务
说明 最大的好处是方便。 其实所有任务的源头，应该都是通过定时的方式，在每个时隙发起轮询。当然在任务的后续传递中，可以通过CallBack或者WebHook的方式，以事件的形态进行。这样可以避免长任务执行的过程中进行等待和轮询。 总结…...
为AI聊天工具添加一个知识系统 之78 详细设计之19 正则表达式 之6
本文要点 要点 本项目设计的正则表达式 是一个 动态正则匹配框架。它是一个谓词系统：谓词 是运动，主语是“维度”，表语是 语言处理。主语的一个 双动结构。 Reg三大功能 语法验证、语义检查和 语用检验，三者 ：语义约…...
三天急速通关JavaWeb基础知识：Day 1 后端基础知识
三天急速通关JavaWeb基础知识：Day 1 后端基础知识 0 文章说明1 Http1.1 介绍1.2 通信过程1.3 报文 Message1.3.1 请求报文 Request Message1.3.2 响应报文 Response Message 2 XML2.1 介绍2.2 利用Java解析XML 3 Tomcat3.1 介绍3.2 Tomcat的安装与配置3.3 Tomcat的项…...
代理模式 -- 学习笔记
代理模式学习笔记 什么是代理？ 代理是一种设计模式，用户可以通过代理操作，而真正去进行处理的是我们的目标对象，代理可以在方法增强（如：记录日志，添加事务，监控等） 拿一…...
前端-Rollup
Rollup 是一个用于 JavaScript 的模块打包工具，它将小的代码片段编译成更大、更复杂的代码，例如库或应用程序。它使用 JavaScript 的 ES6 版本中包含的新标准化代码模块格式，而不是以前的 CommonJS 和 AMD 等特殊解决方案。ES 模块允许你自由…...
EtherCAT主站IGH-- 21 -- IGH之fsm_reboot.h/c文件解析
EtherCAT主站IGH-- 21 -- IGH之fsm_reboot.h/c文件解析 0 预览一 该文件功能`fsm_reboot.c` 文件功能函数预览二 函数功能介绍`fsm_reboot.c` 中主要函数的作用1. `ec_fsm_reboot_init`2. `ec_fsm_reboot_clear`3. `ec_fsm_reboot_single`4. `ec_fsm_reboot_all`5. `ec_fsm_reb…...
【NLP251】NLP ＲＮＮ 系列网络
NLP251 系列主要记录从NLP基础网络结构到知识图谱的学习 １.原理及网络结构 １.１ＲＮＮ 在Yoshua Bengio论文中( http://proceedings.mlr.press/v28/pascanu13.pdf )证明了梯度求导的一部分环节是一个指数模型…...
)
数据分析系列--④RapidMiner进行关联分析(案例)
一、核心概念 1.1项集（Itemset） 1.2规则（Rule） 1.3支持度（Support） 1.3.1 支持度的定义 1.3.2 支持度的意义 1.3.3 支持度的应用 1.3.4 支持度的示例 1.3.5 支持度的调整 1.3.6 支持度与其他指标的…...
深度学习：基于MindNLP的RAG应用开发
什么是RAG？ RAG（Retrieval-Augmented Generation，检索增强生成） 是一种结合检索（Retrieval）和生成（Generation）的技术，旨在提升大语言模型（LLM）生…...
Hive安装教程
Hive安装教程 文章目录 Hive安装教程写在前面安装下载安装部署安装Hive启动并使用Hive MySQL安装检查当前系统是否安装过MySQL安装初始化数据库 Hive元数据配置到MySQL拷贝驱动配置Metastore到MySQL再次启动Hive 写在前面 Linux版本：CentOS7.5Hive版本：…...
安卓逆向之脱壳-认识一下动态加载 双亲委派（二）
一：动态加载与双亲委派模型 在 Java 和 Android 中，ClassLoader 是一个非常重要的组件，负责将 .class 文件或 .dex 文件的字节码加载到内存中，供程序使用。在这其中，有两种关键的概念需要深入理解：动态加载…...
全程Kali linux---CTFshow misc入门（14-24）
第十四题： dd命令：dd是一个用于复制和转换数据的命令，它可以对文件、设备等进行操作，在数据备份、转换格式等场景经常使用。 ifmisc14.jpg：if表示 “input file”（输入文件），这里指…...
学习数据结构（3）顺序表
1.动态顺序表的实现 （1）初始化 （2）扩容 （3）头部插入 （4）尾部插入 （5）头部删除 （这里注意要保证有效数据个数不为0） （6&a…...
知识体系、知识管理角度的赚钱思考
从知识管理和知识体系的角度出发，赚钱的问题思考清单可以帮助你系统地梳理和优化自己在财富创造方面的策略。 以下是一个详细的清单，涵盖从知识获取、技能提升到实际应用的各个环节，帮助你在赚钱的道路上更加高效和有条理。 一、赚钱的目标与…...
 ABI 相关知识补充：内核线程切换、用户线程切换、用户内核切换需要保存哪些寄存器？)
(done) ABI 相关知识补充：内核线程切换、用户线程切换、用户内核切换需要保存哪些寄存器？
由于操作系统和编译器约定了 ABI，如下： 编译器在对 C 语言编译时，会自动 caller 标注的寄存器进行保存恢复。保存的步骤通常发生在进入函数的时候，恢复的步骤通常发生在从函数返回的时候。 内核线程切换需要保存的寄存器&#…...
QT6 + CMAKE编译OPENCV3.9
参考文档 [1] https://blog.csdn.net/rjkf_css/article/details/135676077 前提条件 配置好相关运行环境：QT6、OPENCV3.9的sources文件 OPENCV下载网页：https://opencv.org/releases/ QT6下载教程：https://blog.csdn.net/caoshangpa/article…...
Linux 常用命令——系统设置篇（保姆级说明）
系统设置类 显示当前运行的进程（ps） ps [options] [--help]# 查找指定进程格式： ps -ef | grep 进程关键字# 显示进程信息 ps -A 参数： -A 列出所有的进程 -w 显示加宽可以显示较多的资讯 -au 显示较详细的资讯 -aux 显示所有包…...
完美世界前端面试题及参考答案
如何设置事件捕获和事件冒泡？ 在 JavaScript 中，可以通过addEventListener方法来设置事件捕获和事件冒泡。该方法接收三个参数，第一个参数是事件类型，如click、mousedown等；第二个参数是事件处理函数；第三个参数是一个布尔值，用于指定是否使用事件捕获机制。当这个布尔值…...
Vue3笔记——（三）hooks、路由
015 hooks 作用：使得代码更加模块化和可维护 Person.vue <template><div><h2>当前求和{{ sum }}</h2><button click"addFn">点我sum1</button></div> </template> <script setup lang"ts"…...
网络安全大模型和人工智能场景及应用理解
本文通过通俗易懂的方式的进行阐述，大家读完觉得有帮助记得及时关注和点赞！！！ 一、网络安全大模型的概述 网络安全大模型是一种用于识别和应对各种网络安全威胁的模型。它通过分析网络数据包、网络行为等信息，识别潜在…...
python-leetcode-从中序与后序遍历序列构造二叉树
106. 从中序与后序遍历序列构造二叉树 - 力扣（LeetCode） # Definition for a binary tree node. # class TreeNode: # def __init__(self, val0, leftNone, rightNone): # self.val val # self.left left # self.right r…...
NLP模型大对比：Transformer ＞ RNN ＞ n-gram
结论 Transformer 大于 RNN 大于 传统的n-gram n-gram VS Transformer 我们可以用一个 图书馆查询 的类比来解释它们的差异： 一、核心差异对比 维度n-gram 模型Transformer工作方式固定窗口的"近视观察员"全局关联的"侦探"依赖距离只能看前…...
MySQL查询优化（三）：深度解读 MySQL客户端和服务端协议
如果需要从 MySQL 服务端获得很高的性能，最佳的方式就是花时间研究 MySQL 优化和执行查询的机制。一旦理解了这些，大部分的查询优化是有据可循的，从而使得整个查询优化的过程更有逻辑性。下图展示了 MySQL 执行查询的过程： 客户端…...
[STM32 - 野火] - - - 固件库学习笔记 - - -十三.高级定时器
一、高级定时器简介 高级定时器的简介在前面一章已经介绍过，可以点击下面链接了解，在这里进行一些补充。 [STM32 - 野火] - - - 固件库学习笔记 - - -十二.基本定时器 1.1 功能简介 1、高级定时器可以向上/向下/两边计数，还独有一个重复计…...
Antd React Form使用Radio嵌套多个Select和Input的处理
使用Antd React Form使用Radio会遇到嵌套多个Select和Input的处理，需要多层嵌套和处理默认事件和冒泡，具体实现过程直接上代码。 实现效果布局如下图 代码 <Formname"basic"form{form}labelWrap{...formItemLayoutSpan(5, 19)}onFinish{on…...