Javascript—返回NaN的文本字段中的字符计数

我有一个表单，我正在尝试，如果有人在表单的文本字段中输入文本，然后单击提交，我想向他显示我一直得到的符号成本（charactercount x price）

NaN

这是我的Html：

<section class="sign" id="sign">
<h3 class="sign_header">CUSTOM SIGNAGE</h3>
<p class="sign_text">Enter Name, the cost per letter is $<span id="lettercost">6</span>.</p>
<form class="info_form">
  <input type="text" id="inputletters" value="Example Name"><br>
  <input type="button" value="Submit" class="button" id="getprice"  onClick="getPrice();">
</form>

---

下面是一个可运行的示例--

price

是一个对象，您需要

.textContent

，并将其解析为数字以使其工作

函数getPrice（）{
var quantity=document.getElementById（'inputletters'）.value.length；
var price=document.getElementById（'lettcost'）.textContent；
控制台日志（数量类型、价格类型）
var总额=数量（数量）*数量（价格）；
var cost=document.getElementById（'cost'）；
cost.textContent=总计；
}

定制标志
输入姓名，每个字母的费用为6美元

您必须将它们解析为整数！而且，

price

甚至不是一个包含数字的字符串，而是一个元素。您想要

值

吗？

价格

是一个HTMLElement。。。你认为乘法的结果会是什么。。。您需要使用

var price=document.getElementById（'lettcost'）.textContent-如果使用乘法jarmouda X.textContent，则无需对其进行解析；工作完美无瑕！我不敢相信这是一个如此微小却愚蠢的错误！非常感谢！
function getPrice(){
    var quantity = document.getElementById('inputletters').value.length;
    var price = document.getElementById('lettercost');
    var total = quantity*price;
    var cost = document.getElementById('cost');
    cost.textContent = total;
}