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 相关文章推荐
JavaScript实现Sleep函数的代码
Mar 04 Javascript
javascript实现面向对象类的功能书写技巧
Mar 07 Javascript
通过DOM脚本去设置样式信息
Sep 19 Javascript
2014最热门的JavaScript代码高亮插件推荐
Nov 25 Javascript
深入理解jQuery之防止冒泡事件
May 24 Javascript
BootStrap Datepicker 插件修改为默认中文的实现方法
Feb 10 Javascript
jquery实现下拉框左右选择功能
Feb 21 Javascript
jquery中each循环的简单回滚操作
May 05 jQuery
深入理解基于vue-cli的vuex配置
Jul 24 Javascript
将Sublime Text 3 添加到右键中的简单方法
Dec 12 Javascript
JavaScript观察者模式原理与用法实例详解
Mar 10 Javascript
解决Vue + Echarts 使用markLine标线(precision精度问题)
Jul 20 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和mysql的简单的dao类实现crud操作功能
2014/01/27 PHP
YII模块实现绑定二级域名的方法
2014/07/09 PHP
一段实用的php验证码函数
2016/05/19 PHP
php实现等比例不失真缩放上传图片的方法
2016/11/14 PHP
ThinkPHP3.2框架自带分页功能实现方法示例
2019/05/13 PHP
JavaScript 异步调用框架 (Part 6 - 实例 &amp; 模式)
2009/08/04 Javascript
jquery 插件开发方法小结
2009/10/23 Javascript
createElement与createDocumentFragment的点点区别小结
2011/12/19 Javascript
javascript变量作用域使用中常见错误总结
2013/03/26 Javascript
编写高效jQuery代码的4个原则和5个技巧
2014/04/24 Javascript
深入理解node exports和module.exports区别
2016/06/01 Javascript
Nodejs实现短信验证码功能
2017/02/09 NodeJs
在vue项目中引用Iview的方法
2018/09/14 Javascript
vue实现的双向数据绑定操作示例
2018/12/04 Javascript
详解vue移动端项目代码拆分记录
2019/03/15 Javascript
js设置鼠标悬停改变背景色实现详解
2019/06/26 Javascript
用Python和MD5实现网站挂马检测程序
2014/03/13 Python
Python实现的简单发送邮件脚本分享
2014/11/07 Python
Python中使用glob和rmtree删除目录子目录及所有文件的例子
2014/11/21 Python
python过滤字符串中不属于指定集合中字符的类实例
2015/06/30 Python
Python表达式的优先级详解
2020/02/18 Python
Python安装OpenCV的示例代码
2020/03/05 Python
翻转数列python实现,求前n项和,并能输出整个数列的案例
2020/05/03 Python
python根据用户需求输入想爬取的内容及页数爬取图片方法详解
2020/08/03 Python
python3将变量输入的简单实例
2020/08/19 Python
Python通过Schema实现数据验证方式
2020/11/12 Python
WebSphere面试题:在WebSphere里面如何部署一个应用
2015/08/02 面试题
结婚邀请函范文
2014/01/14 职场文书
护理助产毕业生的求职信
2014/03/02 职场文书
学校对教师的评语
2014/04/28 职场文书
大专生找工作自荐书
2014/06/10 职场文书
新党章心得体会
2014/09/04 职场文书
2015新年联欢晚会开场白
2014/12/14 职场文书
团结主题班会
2015/08/13 职场文书
2020年元旦晚会策划书模板
2019/12/30 职场文书
Innodb存储引擎中的后台线程详解
2022/04/03 MySQL