如何获取带有 id 的空 div 的总和？答案

【问题标题】：How to take sum of an empty div with an id?如何获取带有 id 的空 div 的总和？
【发布时间】：2018-10-31 20:32:47
【问题描述】：

编写一个名为“additionCalculator”的函数，它不带任何参数且不返回值。此函数将控制添加两个数字的基于 Web 的计算器的逻辑。网页上会有两个文本框，id 为“input_one”和“input_two”，以及一个空 div，id 为“sum”。读取两个文本框的值，将这两个值的相加写入div内。

function additionCalculator(){
    var one = parseInt(document.getElementById('input_one'));
    var two = parseInt(document.getElementById('input_two'));
    var sum = one + two;
    document.getElementById('sum').value = sum;
}

我似乎无法将这两个数字相加。我做错了什么？

【问题讨论】：

标签： javascript html function

【解决方案1】：

document.getElementById 返回一个 HTML 元素 - 你想要元素的 value（我假设这些是输入） - 所以你需要获取实际属性：

var one = parseInt(document.getElementById('input_one').value);
var two = parseInt(document.getElementById('input_two').value);

将值设置回 div 时 - 使用 innerHTML 属性：

document.getElementById('sum').innerHTML = sum;

【讨论】：

我仍然没有得到空 div 中的总和。
@Anonymous - 尝试设置div 的innerHTML 属性而不是value - div 元素没有value 属性。
您也可以使用 + 运算符将字符串解析为数字。结果 = +str + +str
@Anonymous - 打开你的控制台，看看你是否收到任何错误。在 JSFiddle 中重新创建此问题可能会有所帮助
您的代码正在返回
。假设返回
0
，其中“input_one”值为-87，“input_two”值为87。

【解决方案2】：

试试这个，我认为您缺少的是一个按钮，该按钮调用操作以进行计算。还记得更改您的语句以获取inputs 的value 并定位空div 的innerHTML

document.getElementById('sumBtn').onclick = function additionCalculator(){
    var one = parseInt(document.getElementById('input_one').value);
    var two = parseInt(document.getElementById('input_two').value);
    var sum = one + two;
    document.getElementById('sum').innerHTML = sum;
}

<input type="text" id="input_one">
<input type="text" id="input_two">
<button id="sumBtn">Add</button>
<div id="sum"></div>

【讨论】：