JavaScript无法正确检测页面上的元素

给定的代码不起作用，我不知道为什么，当我写入console.log而不是添加到查询变量时，此控制台显示值，然后返回错误“Uncaught TypeError:无法读取未定义的属性'innerHTML'”

let editProduct=（id）=>{
让length=sessionStorage.getItem（“valuesArray”）.length；
let query=“UPDATE`products`SET id=”+id+“，”；
for（设i=0；i

---

有什么问题吗？

这会让你更接近：

const editProduct = id => {
    const length = sessionStorage.getItem("valuesArray").length;
    let query = "UPDATE `products` SET id='"+id+"', ";
    // querySelectorAll returns a NodeList. Convert to Array:
    const labels = Array.from(document.querySelectorAll("label"))
    const labelsText = labels.map(label => label.innerHTML)
    console.log(labels.join(', '))
    alert(query);
}

代码的问题是，您正在使用从localstorage获得的数组长度进行迭代，但不能保证该数组的长度与页面上标签元素的数量相同，而且数组中的项目似乎多于标签元素

您应该迭代由

document.querySelectorAll（“标签”）

返回的集合

我建议您学习

Array.map

和

Array.filter

。它们比循环更安全，也更容易推理

您的意图在代码中并不明确，但如果您希望“获得一个等于

Math.min（labels.length，valuesArray.length）

”的标签元素数，则需要执行以下操作：

const editProduct = id => {
    const length = sessionStorage.getItem("valuesArray").length;
    let query = "UPDATE `products` SET id='"+id+"', ";
    const labels = Array.from(document.querySelectorAll("label")) || [];

    const numberOfElementsToGet = Math.min(labels.length, length) - 1;
    const elementsToGet = labels.slice(0, numberOfElementsToGet)
    const labelsText = elementsToGet.map(label => label.innerHTML)

    console.log(labels.join(', '))
    alert(query);
}

---

尝试检查值是否为任意数组，以应用长度函数来正确结束循环

   let length = sessionStorage.getItem("valuesArray").length

---

代码不起作用，sessionStorage的值肯定等于输入和标签的长度。当您说“它不起作用”时，我的代码是否有未定义的错误？在第7行返回“Uncaught TypeError:labels.slice不是函数”。请看，现在我可以用它做些什么。更新。我将添加一条注释来解释它。