javascript - 添加同类javascript的输入值

Question

如何添加同一类的输入值。我已经尝试过下面的代码，但似乎不起作用。我哪里出错了？

<table id="tableID">
<tr>

<td>   <input name="name" class="compulsory1" type="text" value="1" />  </td>
<td>   <input name="name1" class="compulsory1" type="text" value="2" />  </td>
<td>   <input name="name2" class="compulsory1" type="text" value="3" />  </td>

<td>
<script type="text/javascript">
var tdsCompulsory = document.getElementsByClassName('compulsory1')[0].value;
var cData = [];
sum = 0;
for(var i in tdsCompulsory){
    if(typeof tdsCompulsory[i].textContent != 'undefined')
    cData.push(tdsCompulsory[i].textContent);
}
console.log(cData);

for(var i in cData){
    sum +=parseInt(cData[i]);
}
alert (sum);
</script>

</td>

</tr>
</table>

Answer 1

尝试一下，使用 querySelectorAll ，您将获得文档中带有 class="compulsory1"的所有元素:

window.onload = function(){
var x = document.querySelectorAll(".compulsory1");
var total = 0;
for(var i=0;i<x.length;i++)
{
total+=Number(x[i].value);
}
console.log(total);
}

  <input name="name" class="compulsory1" type="text" value="1" /> 
  <input name="name1" class="compulsory1" type="text" value="2" /> 
  <input name="name2" class="compulsory1" type="text" value="3" />