javascript实现简易计算器


Posted in Javascript onFebruary 01, 2017

前言

hello,大家好,学习一段时间了,学习了框架和后台的内容,为了防止前端的js和jq的熟练度不够,忘记很多算法和基础用法,会陆陆续续更新一些小的功能效果code,用于记录和积累,不足之处很多,封装性和代码冗余暂且不严格要求,尽力完善,保持更新..

简易加减乘除计算器,利用表单的value值取值,用原生js实现.可直接复制到编辑器,打开即可运行.

<!DOCTYPE html>
<html>
 <head>
 <meta charset="UTF-8">
 <title>加减乘除计算器</title> 
 <script type="text/javascript">
 function count(){ 
 var a = parseInt(document.getElementById("txt1").value);
 var b = parseInt(document.getElementById("txt2").value) ;
 var sign = document.getElementById("select").value;
 var result = 0;
  switch(sign){
   case "+": result = a+b;
   break;
   case "-": result = a-b;
   break;
   case "*": result = a*b;
   break;
   case "/": result = a/b;
   break;
   case "%": result = a%b;
   break;
   }
 document.getElementById("answer").value = result;
 }
 </script> 
 </head> 
 <body>
 <input type='text' id='txt1' /> 
 <select id='select'>
  <option value='+'>+</option>
  <option value="-">-</option>
  <option value="*">*</option>
  <option value="/">/</option>
  <option value="%">%</option>
 </select>
 <input type='text' id='txt2' /> 
  <input type='button' value=' = ' onclick="count()"/> 
  <!--通过 = 按钮来调用创建的函数,得到结果--> 
 <input type='text' id='answer' /> 
 </body>
</html>

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
lib.utf.js
Aug 21 Javascript
Pro JavaScript Techniques学习笔记
Dec 28 Javascript
js中生成map对象的方法
Jan 09 Javascript
JS实现带圆弧背景渐变效果的导航菜单代码
Oct 13 Javascript
AngularJS辅助库browserTrigger用法示例
Nov 03 Javascript
Vue封装Swiper实现图片轮播效果
Feb 06 Javascript
React 组件中的 bind(this)示例代码
Sep 16 Javascript
three.js实现炫酷的全景3D重力感应
Dec 30 Javascript
判断文字超过2行添加展开按钮,未超过则不显示,溢出部分显示省略号
Apr 28 Javascript
在微信小程序中使用vant的方法
Jun 07 Javascript
详解element-ui 表单校验 Rules 配置 常用黑科技
Jul 11 Javascript
谈谈JavaScript中的垃圾回收机制
Sep 17 Javascript
javascript实现右下角广告框效果
Feb 01 #Javascript
基于javascript实现最简单选项卡切换
Feb 01 #Javascript
快速实现jQuery多级菜单效果
Feb 01 #Javascript
angular实现商品筛选功能
Feb 01 #Javascript
Bootstarp基本模版学习教程
Feb 01 #Javascript
angular实现表单验证及提交功能
Feb 01 #Javascript
Javascript基础回顾之(三) js面向对象
Jan 31 #Javascript
You might like
PHP下10件你也许并不了解的事情
2008/09/11 PHP
php中将网址转换为超链接的函数
2011/09/02 PHP
yii通过小物件生成view的方法
2016/10/08 PHP
在Yii2特定页面如何禁用调试工具栏Debug Toolbar详解
2017/08/07 PHP
Javascript与flash交互通信基础教程
2008/08/07 Javascript
使用jquery插件实现图片延迟加载技术详细说明
2011/03/12 Javascript
十个迅速提升JQuery性能让你的JQuery跑得更快
2012/12/10 Javascript
jtable列中自定义button示例代码
2013/11/21 Javascript
js报$ is not a function 的问题的解决方法
2014/01/20 Javascript
JS版的date函数(和PHP的date函数一样)
2014/05/12 Javascript
JavaScript中的闭包(Closure)详细介绍
2014/12/30 Javascript
推荐4个原生javascript常用的函数
2015/01/12 Javascript
JavaScript事件委托技术实例分析
2015/02/06 Javascript
javascript超过容器后显示省略号效果的方法(兼容一行或者多行)
2016/07/14 Javascript
JS实现根据文件字节数返回文件大小的方法
2016/08/02 Javascript
canvas学习之API整理笔记(二)
2016/12/29 Javascript
JavaScript+HTML5实现的日期比较功能示例
2017/07/12 Javascript
基于vue-cli vue-router搭建底部导航栏移动前端项目
2018/02/28 Javascript
JavaScript中this函数使用实例解析
2020/02/21 Javascript
vue项目配置使用flow类型检查的步骤
2020/03/18 Javascript
Vue时间轴 vue-light-timeline的用法说明
2020/10/29 Javascript
vue实现简易计算器功能
2021/01/20 Vue.js
python实现的DES加密算法和3DES加密算法实例
2015/06/03 Python
利用python画一颗心的方法示例
2017/01/31 Python
Python 多进程和数据传递的理解
2017/10/09 Python
python中使用 xlwt 操作excel的常见方法与问题
2019/01/13 Python
Python中按键来获取指定的值
2019/03/02 Python
教你如何编写、保存与运行Python程序的方法
2019/07/12 Python
python字符串格式化方式解析
2019/10/19 Python
Python for循环通过序列索引迭代过程解析
2020/02/07 Python
浅谈django 模型类使用save()方法的好处与注意事项
2020/03/28 Python
pip安装tensorflow的坑的解决
2020/04/19 Python
初中家长意见
2015/06/03 职场文书
python使用pywinauto驱动微信客户端实现公众号爬虫
2021/05/19 Python
Spring Boot 启动、停止、重启、状态脚本
2021/06/26 Java/Android
Python中的tkinter库简单案例详解
2022/01/22 Python