未捕获的类型错误：无法读取未定义的属性（读取“类型”）

Question

我有一个包含两列的表格：值和复选框。 我想用选中的复选框识别最小值。 我从这个问题调整了设置，但改变了我从document.getElementsByTagName('input')到querySelectorAll(".myCheckbox")识别复选框的方式。 当我添加一个额外的输入字段时，最初的方式成为一个问题（这就是我在下面包含它的原因）

但是，该函数会抛出Uncaught TypeError: Cannot read properties of undefined (reading 'type') 。

怎么了？

 function smallestWeight() { let values = []; const ele = document.querySelectorAll(".myCheckbox"); let table = document.getElementById("myTable"); let trs = table.getElementsByTagName("tr"); for (i = 0, len = trs.length; i < len; i++) { if (ele[i].type == 'checkbox' && ele[i].checked == true) { values.push(parseFloat(trs[i].cells[0].innerHTML)); } } } const btn = document.getElementById("click"); btn.addEventListener("click", function() { smallestWeight(); })

 <table id="myTable"> <thead> <tr> <th>value</th> <th>include</th> </tr> </thead> <tbody> <tr> <td>1.1</td> <td><input type="checkbox" class="myCheckbox" id="include" value="include" checked></td> </tr> <tr> <td>2.2</td> <td><input type="checkbox" class="myCheckbox" id="include" value="include" checked></td> </tr> <tr> <td>3.3</td> <td><input type="checkbox" class="myCheckbox" id="include" value="include" checked></td> </tr> <tr> <td>4.4</td> <td><input type="checkbox" class="myCheckbox" id="include" value="include" checked></td> </tr> </tbody> </table> <button id="click">Click</button><br> <input type="number">

Answer 1

您的代码查看表中的所有行。 您没有考虑表的第一行是 thead。 所以你的表格行比复选框多一个。

const trs = table.querySelectorAll("tbody tr");