制作一个简单的计算器,带有加减乘除,AC和退格的基本功能在此次学习中我学到了四个方法
1.
indexOf()
方法,若不为数字,需要加引号
indexOf() (补充:indexOf从前往后查询,而lastIndexOF从后往前查询)
用于查找字符在数组的位置,()里输入你想要查找的字符,若是有则会输出一个位置,若是没有则会输出一个-1
2.
join()
方法,若不为数字,需要加引号
join() //若是给括号里加入内容,就会把数组的每一位后面加上”“里的内容
join()
方法是将数组的每一位拼接成一个字符串
3.
eval(需要计算的字符串)
方法,计算表达式的值,需要传入字符串
4.subter(参数一, 参数二)方法
选择性截取字段,从参数一位置开始,从参数二位置结束。
最后附上我自己的代码
样式嘛,自己喜欢什么样的自己写
<!DOCTYPE html><html lang=\"en\"><head><meta charset=\"UTF-8\"><title>网页计算器</title></head><body><table><tr><td><input class=\"txt\" type=\"text\" disabled/></td></tr><tr><td><input class=\"btn_click\" type=\"button\" value=\"AC\"/><input class=\"btn_click\" type=\"button\" value=\"DEL\"/></td></tr><tr><td><input class=\"btn\" type=\"button\" value=\"7\"/><input class=\"btn\" type=\"button\" value=\"8\"/><input class=\"btn\" type=\"button\" value=\"9\"/><input class=\"btn\" type=\"button\" value=\"*\"/></td></tr><tr><td><input class=\"btn\" type=\"button\" value=\"4\"/><input class=\"btn\" type=\"button\" value=\"5\"/><input class=\"btn\" type=\"button\" value=\"6\"/><input class=\"btn\" type=\"button\" value=\"/\"/></td></tr><tr><td><input class=\"btn\" type=\"button\" value=\"1\"/><input class=\"btn\" type=\"button\" value=\"2\"/><input class=\"btn\" type=\"button\" value=\"3\"/><input class=\"btn\" type=\"button\" value=\"-\"/></td></tr><tr><td><input class=\"btn\" type=\"button\" value=\"0\"/><input class=\"btn\" type=\"button\" value=\".\"/><input class=\"btn\" type=\"button\" value=\"+\"/><input class=\"btn\" type=\"button\" value=\"=\"/></td></tr></table><script src=\"./practice.js\"></script></body></html>
js
var my_value = [];var txt = document.getElementsByClassName(\"txt\")[0];var btn_click = document.getElementsByClassName(\"btn_click\");var btn = document.getElementsByClassName(\"btn\");for (var i=0; i<btn.length; i++) {btn[i].onclick = function() {if (!isNaN(this.value) || this.value == \".\") {if (txt.value.indexOf(\".\") != -1) {if (this.value !== \".\") {txt.value += this.value}}else {txt.value += this.valueconsole.log(txt.value)}}else {if (this.value == \"=\") {my_value[my_value.length] = txt.valueconsole.log(my_value)console.log(my_value.join(\"\"))txt.value = eval(my_value.join(\"\"))my_value = []}else {my_value[my_value.length] = txt.valueconsole.log(my_value)my_value[my_value.length] = this.valueconsole.log(txt.value)txt.value = \"\"}}}}for (var i=0; i<btn_click.length; i++) {btn_click[i].onclick = function () {if (this.value == \"AC\") {txt.value = \"\"my_value = []}else {txt.value = txt.value.substr(0,txt.value.length-1)}}}
在此次的js代码中我还学到了
length
一用法
那就是如果你想给某个数组最后一项添加一个内容,就可以
var mar = [1, 2, 3]mar[mar.length] = 4console.log(mar) // 输出[1, 2, 3, 4]