首页 新闻 搜索 专区 学院

前端:简单计算器,把substr换成splice,为什么实现不了?代码如下

0
[待解决问题]

我把run.innerHTML.substr(0,run.innerHTML.length-1);换成run.innerHTML.splice(length-1,1);为什么不能实现

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Document</title>
<meta name="viewport" content="width=device-width,initial-scale:1.0">
<style>
html,body{
height: 100%;
overflow: hidden;
}
div{
box-sizing: border-box;
font: 26px/30px '微软雅黑','sans-serif';
}
#main{
height: 100%;
}
#run{
height: 20%;
}
.c3{
float: left;
width: 25%;
height: 16%;
border: 1px solid gray;
line-height: 100px;
text-align: center;
height: 3em;
line-height: 3em;
}
.c6{
width: 50%;
height: 16%;
float: left;
border: 1px solid gray;
line-height: 100px;
text-align: center;
height: 3em;
line-height: 3em;
}
</style>
</head>
<body>
<div id="main">
<div id="run"></div>
<div class="c3">AC</div>
<div class="c3">+/-</div>
<div class="c3">back</div>
<div class="c3">/</div>
<div class="c3">7</div>
<div class="c3">8</div>
<div class="c3">9</div>
<div class="c3">-</div>
<div class="c3">4</div>
<div class="c3">5</div>
<div class="c3">6</div>
<div class="c3">+</div>
<div class="c3">1</div>
<div class="c3">2</div>
<div class="c3">3</div>
<div class="c3">*</div>
<div class="c6">0</div>
<div class="c3">.</div>
<div class="c3">=</div>
</div>
</body>
<script>
var main = document.getElementById('main');
var run = document.getElementById('run');

main.onclick = function (ev) {
    var el = ev.target;

    //如果点击的不是类名以 c3 c6 开头的直接return
    if(el.className.indexOf('c')!=0){
        return;
    }

    if(el.innerHTML=='AC'){
        run.innerHTML='';//清除全部
    }else if(el.innerHTML=='back'){

run.innerHTML=run.innerHTML.substr(0,run.innerHTML.length-1);

        //保留下来的长度,前删一位
    }else if(el.innerHTML=='='){
        run.innerHTML=eval(run.innerHTML);//eval() 函数可计算某个字符串,并执行其中的的 JavaScript 代码。
    }else{
        run.innerHTML += el.innerHTML;
    }

}

</script>

</html>

牧_童的主页 牧_童 | 菜鸟二级 | 园豆:202
提问于:2018-10-31 01:32
< >
分享
所有回答(2)
0

不就是个计算器吗 表示代码看不懂

思念断了线 | 园豆:263 (菜鸟二级) | 2018-10-31 08:38
0

运行了你的代码,大概是back回退功能,代码改为:
run.innerHTML=run.innerHTML.slice(0,run.innerHTML.length-1);
运行效果一样。
array.slice(start,end)用法为:该方法是对数组进行部分截取,并返回一个数组副本;参数start是截取的开始数组索引,end参数等于你要取的最后一个字符的位置值加上1。
splice的话是对数组的操作无法直接对字符串进行修改,你需要进行分割转换成数组格式。如下:
run.innerHTML=run.innerHTML.split('').splice(0,run.innerHTML.length-1,).join('');

疯癫释流年 | 园豆:301 (菜鸟二级) | 2018-10-31 16:56
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册