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 相关文章推荐
动态调用css文件——jquery的应用
Feb 20 Javascript
use jscript List Installed Software
Jun 11 Javascript
jQuery 相关控件的事件操作分解
Aug 03 Javascript
关于javascript中的typeof和instanceof介绍
Dec 04 Javascript
用JavaScript获取页面文档内容的实现代码
Jun 10 Javascript
JS多物体实现缓冲运动效果示例
Dec 20 Javascript
JS轮播图中缓动函数的封装
Nov 25 Javascript
js学习总结_轮播图之渐隐渐现版(实例讲解)
Jul 17 Javascript
React中嵌套组件与被嵌套组件的通信过程
Jul 11 Javascript
JS中appendChild追加子节点无效的解决方法
Oct 14 Javascript
详解ESLint在Vue中的使用小结
Oct 15 Javascript
vue实现广告栏上下滚动效果
Nov 26 Vue.js
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数组中包含中文的排序方法
2014/06/03 PHP
Laravel 5框架学习之Eloquent 关系
2015/04/09 PHP
PHP并发查询MySQL的实例代码
2017/08/09 PHP
thinkPHP5项目中实现QQ第三方登录功能
2017/10/20 PHP
js 与或运算符 || &amp;&amp; 妙用
2009/12/09 Javascript
同域jQuery(跨)iframe操作DOM(实例讲解)
2013/12/19 Javascript
javascript实现的弹出层背景置灰-模拟(easyui dialog)
2013/12/27 Javascript
浏览器窗口大小变化时使用resize事件对框架不起作用的解决方法
2014/05/11 Javascript
使用jQuery不判断浏览器高度解决iframe自适应高度问题
2014/12/16 Javascript
javascript删除元素节点removeChild()用法实例
2015/05/26 Javascript
js判断手机端(Android手机还是iPhone手机)
2015/07/22 Javascript
javascript实现表单验证
2016/01/29 Javascript
jquery attr()设置和获取属性值实例教程
2016/09/25 Javascript
angular4 JavaScript内存溢出问题
2018/03/06 Javascript
vue 组件开发原理与实现方法详解
2019/11/29 Javascript
vue2.x 对象劫持的原理实现
2020/04/19 Javascript
vue+iview分页组件的封装
2020/11/17 Vue.js
python中文编码问题小结
2014/09/28 Python
Python入门教程之运算符与控制流
2016/08/17 Python
python的random模块及加权随机算法的python实现方法
2017/01/04 Python
你眼中的Python大牛 应该都有这份书单
2017/10/31 Python
python print出共轭复数的方法详解
2019/06/25 Python
Pycharm 文件更改目录后,执行路径未更新的解决方法
2019/07/19 Python
python3.7环境下安装Anaconda的教程图解
2019/09/10 Python
DJANGO-URL反向解析REVERSE实例讲解
2019/10/25 Python
canvas实现圆绘制的示例代码
2019/09/11 HTML / CSS
世界第一冲浪品牌:O’Neill
2016/08/30 全球购物
毕业生求职简历的自我评价
2013/10/23 职场文书
女儿十岁生日答谢词
2014/01/27 职场文书
服务员岗位责任制
2014/02/11 职场文书
市场总经理岗位职责
2014/04/11 职场文书
党员个人整改措施
2014/10/24 职场文书
2014年教师教学工作总结
2014/11/08 职场文书
酒店采购员岗位职责
2015/04/03 职场文书
运动会口号霸气押韵
2015/12/24 职场文书
pycharm安装深度学习pytorch的d2l包失败问题解决
2022/03/25 Python