Javascript 相互增值

如何将值相互叠加？因此，如果你要点击一个按钮，它会将数字添加到彼此并继续堆叠。我试图将这些值添加到一个P标记的innerHTML中，以计算总数，但我刚刚知道如何在不添加其他值的情况下显示其真实值

const input=document.querySelector（'input'））
const button=document.querySelector（'按钮'）
const p=document.querySelector（'p'）
函数addCal（）{
常量inputVal=input.value
p、 innerHTML=inputVal
}
按钮。addEventListener（'click'，addCal）

增加热量
0

您只需在某处跟踪最后一个值，并将其添加到最新的数字中

请记住，从HTML获取的所有值都是字符串，因此必须先将它们（隐式或显式）转换为数字，然后才能进行数学运算。另外，

.innerHTML

用于获取/设置包含HTML的字符串。如果不这样做，请使用

.textContent

还要注意的是，在对用户输入进行操作之前，应始终验证用户输入是您认为的。如果用户没有输入任何内容，但还是单击了按钮，该怎么办？如果他们输入非数字数据怎么办

const input=document.querySelector（'input'）；
const button=document.querySelector（'button'）；
const p=document.querySelector（'p'）；
var total=null；//运行总数将保留在这里
函数addCal（）{
常量inputVal=input.value；
//.parseInt（）和.parseFloat（）是
//显式转换包含数字的字符串
//将字符转换为数字。使用.parseInt（）将
//参数是基数，它指定什么数字
//要使用的系统（此处以10为基数）。
总计=总计+解析整数（inputVal，10）；
p、 text内容=总数；
}
按钮。addEventListener（'click'，addCal）

增加热量
0

最简单的方法之一是对所有输入值求和

1） 使用

querySelectorAll

拾取所有输入

2） 然后用

reduce

在输入元素上迭代，将每个输入的值添加到总和中。我们使用

+input.value

将值的字符串类型强制为数字

const inputs=document.querySelectorAll（'input'）；
const button=document.querySelector（'button'）；
const para=document.querySelector（'p'）；
函数addCal（）{
para.textContent=[…输入].reduce（（总和，输入）=>{
返回和+=+输入值；
}, 0);
}
按钮。addEventListener（'click'，addCal，false）

增加热量
0
只需将p标记值转换为int，然后相加即可。像

function addCal() {
   const inputVal = input.value  
   p.innerHTML = ( parseInt(p.innerHTML) + parseInt(inputVal) )  
}

从
文本中获取现有编号。。。转换为数字…将输入值转换为数字并相加以进行小编辑：您需要检查
inputVal
是否为空，否则您的结果将为NaN。@Azuloo还有许多其他检查要做（值在处理之前应进行修剪，等等），但这并不是问题所在。考虑到问题的简单性，这是一个过于复杂的答案。除了我在刚开始的时候就知道reduce是如何处理问题的。有很多像你这样的答案，其中一些显示了更复杂但更具启发性的解决问题的方法。在我看来，如果你只看到简单的解释，那么作为程序员成长的机会就越少。如果OP不知道如何存储一个简单的值，那么显示数组、排列运算符和箭头函数并不能真正提供一个学习过程。你甚至没有在你的答案中解释这些概念，那么人们会如何从中学习呢？而且，你已经将UI更改为OP所不关心的东西，这使得你的答案无关紧要。您正在回答一个未被询问的问题。
。此处不应使用innerHTML
，为什么要在此处仅包含代码片段的情况下创建第三方网站示例？是的，它可以工作，但是这里不应该使用
.innerHTML
。仅仅因为某些东西有效，并不意味着它是正确的。