Javascript 从滑块输出生成JS公式

我相信这在JavaScript中是可能的，但我无法通过搜索找到我想要的内容，而且我的脚本编写技能非常差

我在一个页面上有3个滑块，将它们的值输出到3个单独的div（带有id cost、length和income）。我希望有一个公式，可以计算每个div的内容并给出最终结果，例如，在单独的div中，

result=（收入成本）*length

。理想情况下，结果会随着每个滑块的移动而更新，但“计算”按钮可能更容易

---

下面是一个

假设您有三个div，如下所示。检查代码

<div id="cost"></div>
<div id="income"></div>
<div id="length"></div>

<div id="total"></div>

<script>
var cost=document.getElementById('cost').innerHTML;
var income=document.getElementById('income').innerHTML;
var length=document.getElementById('length').innerHTML;

var total=(Number(income)-Number(cost))*(Number(length));

//This would give you the total value

document.getElementById('total').innerText=total;//To insert the element into div

</sctipt>

var cost=document.getElementById（'cost'）.innerHTML；
var income=document.getElementById（'income'）.innerHTML；
var length=document.getElementById（'length'）.innerHTML；
风险价值总额=（数量（收入）-数量（成本））*（数量（长度））；
//这将为您提供总价值
document.getElementById（'total'）。innerText=total//将元素插入到div中

---

请检查小提琴链接

您能告诉我们您到目前为止有什么吗？还是有问题的页面的链接？我不太清楚你的要求是什么。对不起，一开始就应该这么做。对不起，不能让它工作。如果有帮助，这里有一个例子。谢谢@实际上，jtrich I没有将文本解析为数字，在脚本运行之前，div必须有一个内容。因此，请使用onload函数来确定页面是否已加载。@jtrich我已经更改了代码，还提到了一个fiddle链接。想了想上面的答案。非常感谢，这非常有效！如上所述，我使用滑块来生成值，因此我使用onclick制作了一个计算按钮。如果在用户移动滑块手柄时仍然可以动态更改结果，那将是完美的，但我现在对此非常满意。再次感谢@jtrich是的，但您是否愿意使用JQuery，因为在使用JavaScript的情况下，您需要编写大量代码。即使您坚持使用JavaScript，我也不介意为您显示路径：）