JavaScript--编程练习1
使用JS完成一个简单的计算器功能。实现2个输入框中输入整数后，点击第三个输入框能给出2个整数的加减乘除。
提示：获取元素的值设置和获取方法为：例：赋值：document.getElementById(“id”）.value = 1； 取值：var = document.getElementById(“id”）.value；
==============练习题=================================
第一步： 创建构建运算函数count()。
第二步： 获取两个输入框中的值和获取选择框的值。
提示：document.getElementById( id名 ).value 获取或设置 id名的值。
第三步： 获取通过下拉框来选择的值来改变加减乘除的运算法则。
提示：使用switch判断运算法则。
第四步： 通过 = 按钮来调用创建的函数，得到结果。
注意: 使用parseInt()函数可解析一个字符串,并返回一个整数。
==========================================代码如下=============================
<!DOCTYPE html>
<html>
<head>
<title> 事件</title>
<script type="text/javascript">
function count(){
//获取第一个输入框的值
var num1=parseInt(document.getElementById("txt1").value);
//获取第二个输入框的值
var num2=parseInt(document.getElementById("txt2").value);
//获取选择框的值
var fuhao=document.getElementById("select").value;
//获取通过下拉框来选择的值来改变加减乘除的运算法则
var result;
switch(fuhao){
case "+":
result=num1+num2;
break;
case "-":
result=num1-num2;
break;
case "*":
result=num1*num2;
break;
case "/":
result=num1/num2;
}
//设置结果输入框的值
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>
==========================界面=========
JavaScript--编程练习1的更多相关文章
- Javascript编程风格
Douglas Crockford是Javascript权威,Json格式就是他的发明. 去年11月他有一个演讲(Youtube),谈到了好的Javascript编程风格是什么.我非常推荐这个演讲,它 ...
- javascript编程： JSON， Mapping, 回调
使用 Javascript 编程, 组合使用 JSON 数据格式,Mapping 和回调技术, 可以产生很强的表达效果. 在实际工作中, 总会有数据汇总的需求. 比如说, 取得了多个 device ...
- javascript编程的最佳实践推荐
推荐的javascript编程的最佳实践,摘要记录在这里: 可维护的代码保证代码的性能部署代码 1 可维护的代码1.1什么是维护的代码:可理解性——其他人可以接手代码并理解它的意图和一般途径,而无需原 ...
- Javascript编程模式（JavaScript Programming Patterns）Part 1.（初级篇）
JavaScript 为网站添加状态,这些状态可能是校验或者更复杂的行为像拖拽终止功能或者是异步的请求webserver (aka Ajax). 在过去的那些年里, JavaScript librar ...
- 实践javascript美术馆的小案例，学习到的东西还是蛮多的，包括javascript编程中的预留退路、分离javascript、以及实现向后兼容等
javascript美术馆(改进2) 一.javascript编程过程中的好习惯 1.实现预留退路 js被禁掉,图片也可以显示出来,href属性带有图片路径 <script src=" ...
- 【HANA系列】SAP HANA XS使用JavaScript编程详解
公众号:SAP Technical 本文作者:matinal 原文出处:http://www.cnblogs.com/SAPmatinal/ 原文链接:[HANA系列]SAP HANA XS使用Jav ...
- 学习现代 JavaScript 编程的最佳教程
天天编码 , 版权所有丨本文标题:0.0 学习现代 JavaScript 编程的最佳教程 转载请保留页面地址:http://www.tiantianbianma.com/the-modern-java ...
- javascript编程思想
javascript编程开发修炼之道 提要文摘附注: 本文的核心内容是围绕javascript前端开发的编程技术要素,来深入地探讨编写高质量的javascript代码的方法.技巧.规范和最佳实践, ...
- 《JavaScript编程实战》
<JavaScript编程实战> 基本信息 原书名:JavaScript programming: pushing the limits 作者: (美)Jon Raasch 译者: 吴海星 ...
- Dojo Javascript 编程规范(转)
前言 相当不错的 Javascript 编程风格规范,建议大家采用此规范编写 Javascript.原文链接: http://dojotoolkit.org/developer/StyleGuide ...
随机推荐
- odoo domain详解
参考的以下文档: luohuayong:Odoo domain写法及运用 baimo:odoo domain表达式 1.domain 表达式规则 最简单的格式:[('字段名','操作符',值)] 例: ...
- 洛谷 3398 仓鼠找sugar 【模板】判断树上两链有交
[题解] 题意就是判断树上两条链是否有交.口诀是“判有交,此链有彼祖”.即其中一条链的端点的Lca在另一条链上. 我们设两条链的端点的Lca中深度较大的为L2,对L2与另一条链的两个端点分别求Lca, ...
- 戏说云计算之PaaS，IaaS，SaaS
最近我们聊到"CRM系统PAAS化",有些可能就不了解,到底什么是PAAS.云计算还有IaaS,SaaS概念,这三者之间有什么区别?今天智云通CRM系统小编用通俗易懂的例子跟大家分 ...
- nyoj 8 一种排序（用vector，sort，不用set）
一种排序 时间限制:3000 ms | 内存限制:65535 KB 难度:3 描述 现在有很多长方形,每一个长方形都有一个编号,这个编号可以重复:还知道这个长方形的宽和长,编号.长.宽都是整数 ...
- BZOJ1452 count （树状数组）
一道比较水的二维树状数组,开100个即可,只有100种颜色还是比较EZ的. Program BZOJ1452; ; maxc=; ..maxn,..maxn,..maxc] of longint; f ...
- HashMap源码分析2：扩容
本文源码基于JDK1.8.0_45. final Node<K,V>[] resize() { Node<K,V>[] oldTab = table; int oldCap = ...
- - > 动规讲解基础讲解四——矩阵取数
给定一个m行n列的矩阵,矩阵每个元素是一个正整数,你现在在左上角(第一行第一列),你需要走到右下角(第m行,第n列),每次只能朝右或者下走到相邻的位置,不能走出矩阵.走过的数的总和作为你的得分,求最大 ...
- 安装Ubuntu 16.04时出现：没有定义根文件系统，请到分区菜单修改
在安装Ubuntu 16.04时,尤其是选项空闲硬盘新建分区安装时,容易出现这种情况,这个是由于没有配置挂载点导致的,解决方法如下: 在挂在点输入“/”. 原理: Linux和Windows的文件系统 ...
- SQL Server 2012内部原理及故障排除
http://blog.csdn.net/burgess_liu/article/details/37900027
- 第3章 ES文档和故障处理
第3章 ES文档和故障处理 一.ES网络配置表 ES网络配置表是ES的硬件和软件组成的列表.ES网络配置常包括以下项目: 分级 项目 杂项信息 系统名.系统厂商/型号.CPU速率.RAM.存储器.系统 ...