【JS学习】慕课网6-11编程联系 简单计算器
使用JS完成一个简单的计算器功能。实现2个输入框中输入整数后,点击第三个输入框能给出2个整数的加减乘除。
提示:获取元素的值设置和获取方法为:例:赋值:document.getElementById(“id”).value = 1; 取值:var 啊= document.getElementById(“id”).value;
注意标签值的获取一定别忘了 value
代码如下
<!DOCTYPE html>
<html>
<head>
<title> 事件</title>
<script type="text/javascript">
function count(){ //获取第一个输入框的值
var x=parseInt(document.getElementById("txt1").value);
//获取第二个输入框的值
var y=parseInt(document.getElementById("txt2").value);
//获取选择框的值
var m=document.getElementById("select").value;
//获取通过下拉框来选择的值来改变加减乘除的运算法则
switch(m)
{
case'+':
result=x+y;
break;
case'-':
result=x-y;
break;
case'*':
result=x*y;
break;
case'/':
result=x/y;
break;
}
//设置结果输入框的值
document.getElementById("fruit").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>
</select>
<input type='text' id='txt2' />
<input type='button' value=' = ' onClick="count()"/> <!--通过 = 按钮来调用创建的函数,得到结果-->
<input type='text' id='fruit' />
</body>
</html>
【JS学习】慕课网6-11编程联系 简单计算器的更多相关文章
- 教你一步一步用 Node.js 制作慕课网视频爬虫
转自:http://www.jianshu.com/p/d7631fc695af 开始 这个教程十分适合初学 Node.js 的初学者看(因为我也是一只初学的菜鸟~) 在这里,我就默认大家都已经在自己 ...
- JS入门-慕课网
javascript是一种弱类型的数据交互语言, ch 1 数据类型 js中有六种数据类型:nunmber.string.boolean.null.undenfined.object原始类型:numb ...
- 慕课网 javascript深入浅出编程练习
任务 请在index.html文件中,编写arraysSimilar函数,实现判断传入的两个数组是否相似.具体需求: 1. 数组中的成员类型相同,顺序可以不同.例如[1, true] 与 [false ...
- Node.js学习笔记(1)--一个最简单的服务器请求
说明(2017-5-2 10:27:03): 1. 需要安装node,http://nodejs.cn/download/ 2. 安装完后,在cmd里输入node -v可以查看版本. 3. 代码foo ...
- JS 学习笔记(二)Ajax的简单使用
使用Ajax访问本地TXT文件 ajax.js // 创建请求对象 var ajax = new XMLHttpRequest(); // 建立连接 ajax.open('get', 'test.tx ...
- Lex与Yacc学习(六)之lex & yacc (简单计算器程序) 运行
词法分析程序ch3-01.l %{ #include "ch3-01.tab.h" extern int yylval; %} %% [0-9]+ { yylval = atoi( ...
- Vue学习之路第十篇:简单计算器的实现
前面九篇讲解了vue的一些基础知识,正所谓:学以致用,今天我们将用前九篇的基础知识,来模拟实现计算器的简单功能,项目价值不高,纯粹是为了加深掌握所学知识. 学前准备: 需要掌握JavaScript的e ...
- 【JS学习】慕课网8-17编程练习 网页的返回与跳转
编程练习 制作一个跳转提示页面: 要求: 1. 如果打开该页面后,如果不做任何操作则5秒后自动跳转到一个新的地址,如慕课网主页. 2. 如果点击“返回”按钮则返回前一个页面. 代码如下: 需要注意的是 ...
- JavaScript入门--慕课网学习笔记
JAVASCRIPT—(慕课网)入门篇 我们来看看如何写入JS代码?你只需一步操作,使用<script>标签在HTML网页中插入JavaScript代码.注意, <script&g ...
随机推荐
- Python之 set的特点
set的内部结构和dict很像,唯一区别是不存储value,因此,判断一个元素是否在set中速度很快. set存储的元素和dict的key类似,必须是不变对象,因此,任何可变对象是不能放入set中的. ...
- 使用canvas时, 如何用相对单位(rem, rpx)来适配不同机型
使用canvas的api时, 使用的都是绝对数值, 如: 方法传参是坐标位置,不带单位,如ctx.translate(10,10); 那么此时, 我就需要将rem或rpx 转换成 px; 首先, 获取 ...
- jQuery 菜单 水平菜单的实现
html <!DOCTYPE html> <html> <head> <meta charset="utf-8" /> <ti ...
- Python--前端基础之JavaScript(JS的引入方式,JS的变量、常量和标识符,JS的数据类型,运算符,流程控制,JavaScript的对象)
JavaScript介绍 JavaScript是运行在浏览器端的脚步语言,JavaScript主要解决的是前端与用户交互的问题,包括使用交互与数据交互. JavaScript是浏览器解释执行的,前端脚 ...
- 使用Ueditor点击上传图片时显示延迟的问题
最近在做一个项目,需要用到Ueditor,但是在点击上传图片的时候,总是隔了4-5秒才显示文件框 查了一些资料,最后发现,只需在 修改:(1) dialog/images/image.js 把imag ...
- delphi 以系统权限运行程序的代码
program sysrun; uses Windows, SysUtils, tlhelp32, AccCtrl, AclAPI; function findprocess(TheProcName: ...
- 让vue用于小程序setData方法
setData:function(obj){ let that = this; let keys = []; let val,data; Object.keys(obj).forEach(functi ...
- Ubuntu安装可视化电脑配置视图工具neofetch
安装步骤: sudo apt-get install software-properties-common python-software-propertiessudo add-apt-reposit ...
- 无法在要求对象展开的函数中使用 __try
解决方案: 单独把try里面的代码封装成一个函数,然后再在try里面调用
- 82、TensorFlow教你如何构造卷积层
''' Created on 2017年4月22日 @author: weizhen ''' import tensorflow as tf #通过tf.get_variable的方式创建过滤器的权重 ...