javascript简单计算器的实现

最新推荐文章于 2022-07-02 23:58:02 发布
最新推荐文章于 2022-07-02 23:58:02 发布
阅读量320 收藏
点赞数
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq416761940/article/details/40322849
版权
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>计算器</title>
<style type="text/css">
.main{
width: 200px;
height: 200px;
margin: auto;
border: solid;
}
#div1{
margin-left: 20px;
margin-top: 20px;
background-color: #34B4C6;
border: solid 0px;
}
#div2{
margin-left: 20px;
margin-top: 20px;
background-color: #34B4C6;
border: solid 0px;


}
#div3{
width: 40px;
height: 40px;
font-size: 30px;
font-weight: bolder;
background-color: #FF6287;
margin-left: 30px;
margin-top: 20px;
}
#div4{
width: 40px;
height: 40px;
font-size: 30px;
font-weight: bolder;
background-color: #FF6287;
margin-left: 30px;
}
#div5{
width: 40px;
height: 40px;
font-size: 30px;
font-weight: bolder;
background-color: #FF6287;
margin-left: 30px;
margin-top: 20px;
}
#div6{
width: 40px;
height: 40px;
font-size: 30px;
font-weight: bolder;
background-color: #FF6287;
margin-left: 30px;
}
</style>
<script type="text/javascript">
function jia () {
var a1,a2,a3;
a1=document.getElementById("div1").value;
            a2=document.getElementById("div2").value;
            a1=Number(a1);
            a2=Number(a2);
            a3=a1+a2;
            alert(a3);
}
function cheng(){
var a1,a2,a3;
a1=document.getElementById("div1").value;
            a2=document.getElementById("div2").value;
            a1=Number(a1);
            a2=Number(a2);
            a3=a1*a2;
            alert(a3);
}
function jian(){
var a1,a2,a3;
a1=document.getElementById("div1").value;
            a2=document.getElementById("div2").value;
            a1=Number(a1);
            a2=Number(a2);
            a3=a1-a2;
            alert(a3);
}
function chu(){
var a1,a2,a3;
a1=document.getElementById("div1").value;
            a2=document.getElementById("div2").value;
            a1=Number(a1);
            a2=Number(a2);
            a3=a1/a2;
            alert(a3);
}
</script>
</head>
<body>
<div class="main">
<input id="div1" type="text" value="请输入一个数">
<input id="div2" type="text" value="请输入一个数">
<input id="div3" type="button" value="+" οnclick="jia()">
<input id="div4" type="button" value="*" οnclick="cheng()">
<input id="div5" type="button" value="-" οnclick="jian()">
<input id="div6" type="button" value="/" οnclick="chu()">
</div>
</body>
</html>
qq416761940
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
JavaScript简易计算器实现
传播有益的技术文章，力求精准、专业、专心、专享
06-04 404
javascript实现一个简易计算器
JavaScript——简易计算器实现及代码
weixin_52714017的博客
07-26 1218
h1 onclick="changetext(this)">点击文本!获取输入框的值 定义var num=document.getElementById('num') 然后 num.value。输入框的值=输入框的值+获取输入的值 （+作为字符串拼接）replace（替换前的值，替换后的值）
实现简易计算器 html javascript
04-12
该计算器能实现都功能： 回退：“<-”具有回退功能 基本的加减乘除及求余运算 换号：实现符号的转变。 求倒数运算： 求幂运算：
js实现简单的计算器
Spring_East的博客
07-19 920
js实现一个简单的计算器，有加减乘除的基本功能。 首先使用HTML写一个界面，需要三个文本框，包括两个输入框，一个输出框，输出框不能被操作，还需要一个选择框，用来选择运算方式，最后还需要两个按钮，等于按钮以及清零按钮。 选择框使用标签select 输出按钮不能被操作则应使用属性disabled="true" 清零功能则使用reset,可以清零整个表单，不
JavaScript运算符
冷湮的博客
04-27 117
JavaScript运算符 开发工具与关键技术：Adobe Dreamweaver JavaScript 作者：代富强 撰写时间：2020年4月21日 JavaScript运算符有：算数运算符、关系运算符、逻辑运算符、赋值运算符、条件运算符这五种。 下面先介绍算数运算符： 1.+ 加 可以对两个值进行加法运算，如果是两个字符串则进行字符串拼接 任何值和字符串做加法运算，都会先转为字符串，然后再和...
flv f4v mp4 视频播放器代码
xllily11的袅袅
09-11 1481
flv f4v mp4 视频播放器代码   ckplayer是一款在网页上播放视频的免费的播放器，功能强大，体积小巧，跨平台，使用起来随心所欲。 播放器主要以adobe的flash（所使用的版本是CS5）平台开发，所以在支持flash插件的平台和浏览器上都可以使用，而无需下载其它插件，如果你需要修改完整版里提供的相关的flash源文件，请使用adobe的flash cs5以上版本打开源文...
JavaScript实现简单计算器
weixin_47261870的博客
07-02 3万+
JavaScript和HTML实现简单计算器功能
javascript实现简易计算器的代码
10-22
在本文中，我们将深入探讨如何使用JavaScript实现一个简易计算器。这个计算器可以进行基本的加、减、乘、除运算，并具备清零、退格和等于功能。以下是对代码的详细解释： 首先，我们需要一个HTML结构来展示计算器的...
javascript实现简易计算器功能
10-14
在本教程中，我们将探讨如何使用JavaScript实现一个简易计算器，涵盖基本的四则运算、小数点、回退、清零等核心功能。这个项目旨在帮助开发者熟练掌握JavaScript编程技巧，包括事件处理、异常处理以及页面元素交互。...
JavaScript实现简易计算器小功能
01-21
本文实例为大家分享了JavaScript实现简易计算器的具体代码，供大家参考，具体内容如下 <!DOCTYPE html> <html lang=en> <head> <meta charset=UTF-8> <title>计算器</title> &...
JavaScript简易计算器制作
12-28
本文实例为大家分享了JavaScript实现简易计算器的具体代码，供大家参考，具体内容如下 成品图 这个简易的计算器只能实现 + – * /的运算 在动手之前，我们要先理清思路，看图，若想实现这样一个简易的计算器，我们...
JavaScript实现简单计算器功能
11-27
在本实例中，我们讨论如何使用JavaScript来实现一个简单的计算器功能。这个计算器的基本操作包括数字输入、运算符选择以及计算结果的显示。以下是对代码的详细解析： 首先，HTML部分创建了一个基本的用户界面，包括...
JavaScript 简单实现加减乘除运算
热门推荐
ye_nianfeng的专栏
04-25 3万+
JavaScript 简单实现加减乘除运算 新手学习，不足之处，多多指正。 要求输入两个数字，点击按钮在文本框中返回值。 上代码： 加减乘除运算 加减乘除运算 数值A： 数值B： 结果： function
HTML+CSS+Javascript 实现简单计算器
AC_greener的博客
11-22 928
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title>简单计算器</title> <style> *{ box-sizing: border-box; } .mycalculator{ border: 2px sol
视频播放代码
daisy
09-11 1579
html代码如下：                                                 css样式： /*视频播放*/ .box6 {width:368px; height: 550px; position:relative;} .box6 .playBtn { position:absolute;width: 370px; hei
chromedriver-mac-arm64_126.0.6474.0.zip
07-31
chromedriver-mac-arm64_126.0.6474.0.zip
chromedriver-mac-arm64_128.0.6548.0.zip
最新发布
07-31
chromedriver-mac-arm64_128.0.6548.0.zip
MySQL查询加速器：利用Query Cache提升效率
07-31
MySQL是一个流行的开源关系型数据库管理系统（RDBMS），广泛用于Web应用程序的后端数据存储。它基于结构化查询语言（SQL）来管理数据，并且是LAMP（Linux, Apache, MySQL, PHP/Python/Perl）技术栈的一部分，这个技术栈常用于构建动态网站和Web应用程序。 MySQL的特点包括： - **开放源代码**：MySQL的源代码是公开的，任何人都可以自由使用和修改。 - **跨平台**：MySQL可以在多种操作系统上运行，包括Linux、Windows、macOS等。 - **高性能**：MySQL以其快速的查询处理和良好的性能而闻名。 - **可靠性**：MySQL提供了多种机制来确保数据的完整性和可靠性，包括事务支持、备份和恢复功能。 - **易于使用**：MySQL提供了简单直观的界面和丰富的文档，便于用户学习和使用。 - **可扩展性**：MySQL支持从小型应用到大型企业级应用的扩展。 - **社区支持**：由于其广泛的使用，MySQL拥有一个活跃的开发者社区，提供大量的资源和支持。 MySQL被广泛应用于各种场景，包括在线事务处理（OL
javascript实现简易计算器
05-14
以下是一个简单的 JavaScript 计算器： ```html <!DOCTYPE html> 简易计算器 <script type="text/javascript"> function calculate() { var num1 = document.getElementById('num1').value; var num2 =...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值