js 加法不生效

Question

我自己写了一个很简单的加法功能，可是却不能算出正确结果？https://codepen.io/niusz/pen/...

Answer 1

因为运算从前往后的原因，first + second不先进行计算的话会被转换成字符串直接拼接的，所以需要提高优先级。

document.getElementById("add-btn").onclick = function() {

    var first = Number(document.getElementById("first-number").value);

    var second = Number(document.getElementById("second-number").value);

    // 这句改了下计算优先级

    document.getElementById("result").innerHTML = "运算结果" + (first + second);

};

Answer 2

document.getElementById("add-btn").onclick = function(){

    var first = document.getElementById("first-number").value;

    var second = document.getElementById("second-number").value;

    document.getElementById("result").innerHTML = ("运算结果："+ (Number(first) + Number(second)));

}

Answer 3

Answer 4

两个问题：
1、事件触发后再去读取输入框的值才对；
2、输入框的值展示前需要先行转换成数字并相加。得到结果后再予以展示

Answer 5

你console.log一下就能发现input里面的是字符串了，你要先进行转变

Answer 6

document.getElementById("add-btn").onclick = function() {

    var first = Number(document.getElementById("first-number").value);

    var second = Number(document.getElementById("second-number").value);

    document.getElementById("result").innerHTML = `运算结果${first + second}`;

};