今天第一天学javascript，做了个简易的四则运算，提供参考，效果图：

html代码：

<!DOCTYPE html>

<html >

<head >

<meta charset="UTF-8">

<link rel="stylesheet" type = "text/css"  href = "css/1.css">

<title>index</title>

</head>

<body id="a1">

<script type="text/javascript" src = "js/3.js">

</script>

<form>

<p >

 <input id = "1" type="text" size="20px" name="a "  onkeyup="this.value=this.value.replace(/[^\d]/ig,'')"/>

 <select id = "c">

        <option id = "jia" value="+">+</option>

        <option id = "jian" value="-">-</option>

        <option id = "cheng" value="*">*</option>

        <option id = "chu" value="/">/</option>

 </select>

 <input id = "2" type="text" size="20px" name="b"  onkeyup="this.value=this.value.replace(/[^\d]/ig,'')"/>

 =

 <input id = "3" type="text" size="20px" name="result "  onkeyup="this.value=this.value.replace(/[^\d]/ig,'')"/>

 <input name = "button" type = "button" value= "点击提交" onclick = "cal()">

 </p>

</form>

</body>

</html>

js代码：

function  cal(){

        var numa,numb,cc,sum;

        numa = Number(document.getElementById("1").value);

        numb = Number(document.getElementById("2").value);

        cc = document.getElementById("c").value;

        if(cc == "+"){

            sum = numa + numb;

        }else if(cc=="-"){

            sum = numa - numb;

        }else if(cc=="*"){

            sum = numa * numb;

        }else{

            sum = numa / numb;

        }

        document.getElementById("3").value= sum;

        //alert("计算结果："+sum);

        //document.write(sum);

    }

使用html+javascriptt实现的简易四则运算（初学JavaScript笔记）的更多相关文章

  1. 1st 结对编程：简易四则运算

    结对编程:简易四则运算 功能:进行简易的四则运算,并根据给出的结果判断正误. 实现:使用java的图形化界面实现. 导入包库 package six; import javax.swing.*; im ...

  2. 初学JavaScript七大注意事项

    知识说明: 初学JavaScript,注意以下七大细节,在实现同样功能的情况下,让我们的代码更易懂.效率更高. 一.简化代码 例如:创建对象 之前是这样的: Var car = new object( ...

  3. 任务02——安装 Intellj IDEA，编写一个简易四则运算小程序，并将代码提交到 GitHub

    github地址:https://github.com/ErhuoHome/First.git 安装jdk与intellij idea没有太大问题,以前安装过eclipse 在程序方面,由于对真分数的 ...

  4. 结对编程——paperOne基于java web的简易四则运算出题网站

    项目成员:张金生     张政 需求分析: 1.要进行四则运算: 2.运算题目随机: 3.进行对错判断: 4.整数运算. 程序概要: 1.用JSP实现: 2.用户可选择题目数量: 3.答题页用表格列出 ...

  5. paperOne基于java web的简易四则运算出题网站

    项目成员:张金生     张政 需求概要 1.运算数均为正整数 2.包含的运算符有+,-,*,/ 3.除法运算结果为整除运算 4.批量生成题目并判题 核心功能分析 1.题目生成——java后端 题目生 ...

  6. 简易四则运算生成程序——添加GUI支持

    项目成员:张金生     张政 工程地址: https://coding.net/u/jx8zjs/p/paperOne/git ssh://git@git.coding.net:jx8zjs/pap ...

  7. 初学Javascript，写一个简易的登陆框

    <!--下面是源代码--> <!DOCTYPE html> <html> <head> <meta charset = "utf-8&q ...

  8. 初学redux笔记，及一个最简单的redux实例

    categories: 笔记 tags: react redux 前端框架 把初学redux的一些笔记写了下来 分享一个入学redux很合适的demo, 用redux实现计数器 这是从阮一峰老师git ...

  9. Code Kata:大整数比较大小&大整数四则运算---加减法 javascript实现

    大整数的四则运算已经是老生常谈的问题了.很多的库也已经包含了各种各样的解决方案. 作为练习,我们从最简单的加减法开始. 加减法的核心思路是用倒序数组来模拟一个大数,然后将两个大数的利用竖式进行运算. ...

随机推荐

  1. 洛谷P3928 SAC E#1 - 一道简单题 Sequence2

    提交地址 题目背景 小强和阿米巴是好朋友. 题目描述 小强喜欢数列.有一天,他心血来潮,写下了三个长度均为n的数列. 阿米巴也很喜欢数列.但是他只喜欢其中一种,波动数列. 阿米巴把他的喜好告诉了小强. ...

  2. 【转】说说Runnable与Callable

    说说Runnable与Callable   Callable接口:   Runnable接口: 相同点: 两者都是接口:(废话) 两者都可用来编写多线程程序: 两者都需要调用Thread.start( ...

  3. 关于ajax中return并不能作为方法的返回值

    接下来关于ajax中的return值最后没有办法是方法的最终返回值问题 login(username,password) { console.log("进入方法"); $.ajax ...

  4. 零基础逆向工程22_PE结构06_导入表

    导入表结构 typedef struct _IMAGE_IMPORT_DESCRIPTOR { union { DWORD Characteristics; DWORD OriginalFirstTh ...

  5. 【js类库AngularJs】学习angularJs的指令（包括常见表单验证，隐藏等功能）

    [js类库AngularJs]学习angularJs的指令(包括常见表单验证,隐藏等功能) AngularJS诞生于2009年,由Misko Hevery 等人创建,后为Google所收购.是一款优秀 ...

  6. Selenium3+webdriver学习笔记3（xpath方式元素定位）

    #!/usr/bin/env python# -*- coding:utf-8 -*- from selenium import webdriver import time,os # about:ad ...

  7. 将一个字符与对应Ascii码互转

    package nicetime.com.practies; /** * Java中将一个字符与对应Ascii码互转 1 byte = 8bit 可以表示 0-127 */public class G ...

  8. Arria II GX FPGA开法套件——初步使用

    1. 从官网下载使用手册和参考手册,以及开发包           下载地址:https://www.altera.com.cn/products/boards_and_kits/dev-kits/a ...

  9. codeforce Gym 100570B ShortestPath Query （最短路SPFA）

    题意:询问单源最短路径,每条边有一个颜色,要求路径上相邻边的颜色不能相同,无重边且边权为正. 题解:因为路径的合法性和边的颜色有关, 所以在做spfa的时候,把边丢到队列中去,松弛的时候注意判断一下颜 ...

  10. Android（java）学习笔记122：BroadcastReceiver之 有序广播和无序广播（BroadcastReceiver优先级）

    之前我们在Android(java)学习笔记178中自定义的广播是无序广播,下面我们要了解一下有序广播: 1. 我们首先了解一下有序广播和无序广播区别和联系? (1)有序广播> 接受者有优先级, ...