前端学习(2244):计算器显示问题

<!DOCTYPE html>
<html><head><meta charset="utf-8" /><title>奥里给!</title><style type="text/css">.a {height: 100px;width: 450px;border: 3px solid black;background-color: beige;font-size: 50px;}#b {height: 570px;width: 450px;border: 2px solid black;background-color: pink;font-family: 隶书;font-size: 20px;}.c {height: 90px;width: 100px;border: 1px solid black;background-color: aquamarine;float: left;font-size: 60px;color: brown;margin: 8px;border-radius: 30px;}.d {height: 90px;width: 75px;border: 1px solid black;margin: 8px;float: left;background: sandybrown;font-size: 50px;color: brown;border-radius: 30px;}.e {height: 90px;width: 100px;border: 1px solid black;background-color: sandybrown;float: left;font-size: 45px;color: brown;margin: 8px;border-radius: 30px;}.e:hover {background: skyblue;color: white;transform: scale(1.08, 1.08);}.d:hover {background: skyblue;color: white;transform: scale(1.08, 1.08);}.c:hover {background: plum;color: aliceblue;transform: scale(1.08, 1.08);}</style>
</head><body><center><div class="a" id="resultInput"></div><div id="b"><button class="c" onclick="printResultInput(this)" value="1">1</button><button class="c" onclick="printResultInput(this)" value="2">2</button><button class="c" onclick="printResultInput(this)" value="3">3</button><button class="d" onclick="printResultInput(this)" value="+">+</button><button class="c" onclick="printResultInput(this)" value="4">4</button><button class="c" onclick="printResultInput(this)" value="5">5</button><button class="c" onclick="printResultInput(this)" value="6">6</button><button class="d" onclick="printResultInput(this)" value="-">-</button><button class="c" onclick="printResultInput(this)" value="7">7</button><button class="c" onclick="printResultInput(this)" value="8">8</button><button class="c" onclick="printResultInput(this)" value="9">9</button><button class="d" onclick="printResultInput(this)" value="*">*</button><button class="e" onclick="printResultInput(this)" value=".">.</button><button class="c" onclick="printResultInput(this)" value="0">0</button><button class="e" onclick="count()">=</button><button class="d" onclick="printResultInput(this)" value="/">/</button><button class="e" onclick="tuige()">👈</button><button class="e" onclick="tuige()">👈</button><button class="e" onclick="tuige()">👈 </button><button class="d" onclick="clearNum()">AC</button> 比努力更可怕的是坚持!</div></center><script type="text/javascript">/*printResultInput(this),this可以理解为这个函数在这个按钮的功能 value是赋值*//*将点击的按钮值显示在resultInput上*/function printResultInput(l) { /*??????????????????????????????????????????????????*/document.getElementById("resultInput").innerHTML += l.value;}/* 四则运算方法 */function count() {var countText = document.getElementById("resultInput").innerHTML;var operator, result;if (countText.indexOf("+") !== -1)/*indexOf() 可以显示()里的元素的位置,显示的的是数字。indexOf() 方法对大小写敏感!注释:如果要检索的字符串值没有出现,则该方法返回 -1。。。。。。。在这里用indexof搜索,如果找到了indexof就会是
一个正数如果没有早到的话就是-1,countText.indexOf代表的是cunttext的indexof意思实在这里寻找,给indexof
定义一个区域,如果不是-1的话operator就保存了一个加号*/{operator = "+";} else if (countText.indexOf("-") !== -1) {operator = "-";} else if (countText.indexOf("*") !== -1) {operator = "*";} else if (countText.indexOf("/") !== -1) {operator = "/";}var num1 = countText.substring(0, countText.indexOf(operator));/*substring() 方法用于提取字符串中介于两个指定下标之间的字符。countText.substring表示在counttext中寻找,0是第一个字符,countText.indexOf(operator)应该是从0字符到加号前面的那个字符,,,,这么写的应该是counttext里indexof里的参数operator,不然直接找oper找不到,因为oper是个字符串屏幕上没有,屏幕上只有=-*那代表的是保存在oper的的数我感觉应该就是参数,想要找到他要找到他的父元素也就是定义它的函数也就是indexof*/var num2 = countText.substring(countText.indexOf(operator) + 1);if (operator == "+") {result = parseFloat(num1) + parseFloat(num2);} else if (operator == "-") {result = parseFloat(num1) - parseFloat(num2);} else if (operator == "*") {result = parseFloat(num1) * parseFloat(num2);} else if (operator == "/") {result = parseFloat(num1) / parseFloat(num2);}document.getElementById("resultInput").innerHTML = result;}function tuige() {var t = counttext.substring(0, countText.parseFloat(num2) - 1);document.getElementById("resultInput").innerHTML = t;}/*清零*/function clearNum() {document.getElementById("resultInput").innerHTML = '';}//退位function tui() {}//把按纽上的数字显示到上面的盒子中//获取屏幕中的元素//1判断屏幕上的是+-*/哪一个然后把他保存到一个变量中用到了indexOf()函数没有()里的字符串时显示-1//2获取=-*/前面和后面额元素然后分别把他们保存在两个变量中//把2中的两个元素字符串类型变成浮点型/1最后利用这三个变量(2中的两个变量1中的一个变量)进行计算,把结果保存在一个变量中//把计算结果的变量显示在屏幕中</script></body></html>

运行结果

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/417406.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL索引原理及慢查询优化

MySQL凭借着出色的性能、低廉的成本、丰富的资源&#xff0c;已经成为绝大多数互联网公司的首选关系型数据库。虽然性能出色&#xff0c;但所谓“好马配好鞍”&#xff0c;如何能够更好的使用它&#xff0c;已经成为开发工程师的必修课&#xff0c;我们经常会从职位描述上看到诸…

C语言沉浸式刷题【C语言必刷题】

1.猜凶手 某地发生了一起谋杀案&#xff0c;警察通过排查确定杀人凶手必为四个嫌疑犯的一个&#xff0c;以下是4个嫌犯的供词。已知&#xff08;请编写代码找出凶手&#xff09; A说&#xff1a;不是我。 B说&#xff1a;是C。C说&#xff1a;是D。D说&#xff1a;C再胡说。 程…

C#操作IIS6创建网站应用程序无效

创建网站root目录时执行AppCreate即可DirectoryEntry vdEntry newSiteEntry.Children.Add("root", "IIsWebVirtualDir");vdEntry.Invoke("AppCreate", true);vdEntry.CommitChanges();

python 代码排布_python实现经典排序算法的示例代码

以下排序算法最终结果都默认为升序排列&#xff0c;实现简单&#xff0c;没有考虑特殊情况&#xff0c;实现仅表达了算法的基本思想。冒泡排序内层循环中相邻的元素被依次比较&#xff0c;内层循环第一次结束后会将最大的元素移到序列最右边&#xff0c;第二次结束后会将次大的…

如何减小内存碎片

内存碎片 &#xff1a; 内部碎片&#xff08;占了不用&#xff09; 内部碎片就是已经被分配出去&#xff08;能明确指出属于哪个进程&#xff09;却不能被利用的内存空间&#xff1b;内部碎片是处于区域内部或页面内部的存储块。占有这些区域或页面的进程并不使用这个存储块。而…

python 英语翻译 excel_python批量将excel内容进行翻译写入功能

由于小编初来乍到&#xff0c;有很多地方不是很到位&#xff0c;还请见谅&#xff0c;但是很实用的哦&#xff01;1.首先是需要进行文件的读写操作&#xff0c;需要获取文件路径&#xff0c;方式使用os.listdir(路径)进行批量查找文件。file_path ‘/home/xx/xx/xx# ret 返回一…

bison实例

逆波兰记号计算器【文件名rpcalc.y】%{ #define YYSTYPE double #include <stdio.h> #include <math.h> #include <ctype.h> int yylex (void); void yyerror (char const *); %}%token NUM%% input: /* empty */| input line;line: \n| exp \n …

InstallShield LaunchAppAndWait运行另一个程序并等待该程序终止。

LaunchAppAndWait语法&#xff1a;LaunchAppAndWait (szProgram, szCmdLine, lWait);说明&#xff1a;LaunchAppAndWait函数运行由szProgram指定的带有szCmdLine指定的命令行参数的应用程序。第三个参数&#xff0c;lWait指示安装在继续前是否要等待直到运行的应用程序终止。 …

python3 while循环语句_python While 循环语句

python While 循环语句发布时间&#xff1a;2018-02-12 16:46:28编辑&#xff1a;admin阅读(2055)python 编程中 while 语句用于循环执行程序&#xff0c;即在某条件下&#xff0c;循环执行某段程序&#xff0c;以处理需要重复处理的相同任务。其基本形式为&#xff1a;while 判…

笔记:Zygote和SystemServer进程启动过程

简述 Android设备启动过程中&#xff0c;先是Linux内核加载完&#xff0c;接着Android中的第一个进程init启动&#xff0c;它会启动一些需要开机启动的进程。 Zygote就是进程init启动起来的。Android中所有应用程序进程&#xff0c;以及运行系统关键服务的System进程都是由Zygo…

C中执行指令/程序

//执行并等待程序运行完毕system("E:\\code\\Test\\Debug\\MyEditor.exe"); //暂停system("pause");

python中怎么精确20位_Python中的精确处理

Python可以使用不同的函数来处理浮点数的精度。数学模块中定义了大多数用于精确处理的函数。因此&#xff0c;要使用它们&#xff0c;首先我们必须将math模块导入到当前命名空间中。import math现在&#xff0c;我们将看到一些用于精确处理的功能。该trunc()方法该trunc()方法用…

Axure 共享强制签出签入

签出时点击不签出编辑全部——确定修改后签入时点击全部偷偷签出——确定注意一定要修改后&#xff0c;否则无法检测到修改&#xff0c;不会执行签入

ubuntu mysql混合开发_mysql5.7主从同步 ubuntu

实现环境&#xff1a;| System   | mysql     | ip       ||主ubuntu  | mysql-5.7.24 | 10.192.209.122 ||从ubuntu  | mysql-5.7.39 | 10.192.209.43 |注&#xff1a;从服务器的mysql版本最好和主服务器相同&#xff0c;或者大于主服务器版本MySQL主…

关于逐项作用函数的用法

关于逐项作用函数的用法讲一下Thread这个函数的用法&#xff0c;其中后面两个用法很好用&#xff0c;也常常被忽略。用法一&#xff1a;比较常用用法二&#xff1a;我觉得这一种是很实用的有拓展的方法用法三&#xff1a;构造一种映射关系&#xff0c;在配合 Association[] 关联…