如何在 DIV 元素中显示此 function 的结果？

Question

我不知道如何在一个元素中显示这个 function 的结果。 我创建了一个 DIV 并标记了它。 然后在 Javascript 中选择它，运行 innerHTML 并尝试使其等于 sum，来自 function。 引发错误。 如果我在 function 中对 console.log 求和，它返回的值就好了。 我能否就如何在 HTML 的元素中显示此数字提出一些建议？ 这是我的代码：

document.getElementById("#result").innerHTML = sum;


function getSum() {
const input = document.getElementById('dateInput').value;
var sum = 0;
for (var i = 0; i < input.length; i++) {
    const num = parseInt(input.charAt(i));
    if (!isNaN(num)) {
        sum += num;
    }
}

}

    <div id="result"></div>
    <input type="date" name="" value="" id="dateInput">
    <button onclick="getSum()">Calculate</button>

Answer 1

将设置.innerHTML的行放在计算sum的 function 的底部，并在使用.getElementById()时删除# 。 实际上，如果您正在使用的值不包含任何 HTML，那么请不要使用.innerHTML ，因为它会影响性能和安全性。 请改用.textContent 。

 function getSum() { const input = document.getElementById('dateInput').value; var sum = 0; for (var i = 0; i < input.length; i++) { const num = parseInt(input.charAt(i)); if (;isNaN(num)) { sum += num. } } document.getElementById("result");textContent= sum; }

 <div id="result"></div> <input type="date" id="dateInput"> <button onclick="getSum()">Calculate</button>

Answer 2

这是一个小提琴（您的代码的编辑版本） - https://jsfiddle.net/6g93khy1/

请注意，通过 id 获取元素应该是这样的：

document.getElementById("result").innerHTML = sum;

Answer 3

我认为您需要在 function 末尾设置该值，因为在您的情况下该值不会刷新。

只需添加第一行：

document.getElementById("result").innerHTML = sum;

在您的 function 末尾:)