Question

我的代码在这里有问题。我不知道为什么为数组值定义ID时会收到错误：

Uncaught TypeError: Cannot set property 'id' of undefined
    at script.js:56

预先感谢您的帮助。

我尝试过在线寻找答案，但没有发现任何帮助。

// Create variables, including grabbing the list, page div, and a variable restricting how many students per page
const page = document.querySelector('div.page');
const studentList = document.getElementsByClassName('student-item cf');
const numberRestriction = 10;
const paginationDiv = document.createElement('div');
const paginationUl = document.createElement('ul');
paginationUl.className = 'pagination';

// Generate n number of pages correlating to the amount of students on the list / 10 
let j = 0;
if (studentList.length % numberRestriction === 0) {
   for (let i = 1; i <= (Math.round(studentList.length/numberRestriction)); i++) {
      const li = document.createElement('li');
      const a = document.createElement('a');
      a.setAttribute("href", "#" + i);
      a.textContent=i;
      li.appendChild(a);
      paginationUl.appendChild(li);
      j = j + 10;
      let k = j - 10;
      while (k < j) {
         studentList[k].id = "#" + i; // where the error occurs
         k++; 
      }
   }
} else {
   for (let i = 1; i <= (Math.round(studentList.length/numberRestriction)+1); i++) {
      const li = document.createElement('li');
      const a = document.createElement('a');
      a.setAttribute("href", "#" + i);
      a.textContent=i;
      li.appendChild(a);
      paginationUl.appendChild(li);
      j = j + 10;
      let k = j - 10;
      while (k < j) {
         studentList[k].id = "#" + i; // where the error occurs
         k++; 
      }
   }
}
paginationDiv.appendChild(paginationUl);
page.appendChild(paginationDiv);

Answer 1

Uncaught TypeError: Cannot set property 'id' of undefined
    at script.js:56

这仅表示您正在尝试更改不存在的对象的属性。

让我们看一下导致此错误的代码：

  while (k < j) {
     studentList[k].id = "#" + i; // where the error occurs
     k++; 
  }

studentList 是长度为n的htmlElement的集合。在此while循环内，您超过（> n）或超过（<0）长度，因此它将尝试设置不存在的对象的ID。

要进一步调试，请在此while循环之前放置 console.log（“ length：” + studentList.length）; ；并在另一个 console.log（“ current element：” + k）; 里面看看发生了什么。

 console.log("length: "+studentList.length);
 while (k < j) {
   console.log("current element: "+k);
   studentList[k].id = "#" + i; // where the error occurs
   k++;
 }

Answer 2

这可能意味着您的studentList中没有那么多元素（j-1个元素），因此当您超出其实际大小的限制时，studentList[k]是不确定的。

Answer 3

我能够找到解决方案，谢谢。我将重申扬在这里写的内容：

“我的第一个猜测是，您尝试超出范围访问数组。检查k是否小于数组的长度，如果k大于数组的长度，则您对kis的计算错误，并且您从studentList返回未定义[ k]”-一月

我使用（k！= studentList.length）而不是（k

未捕获的TypeError：无法设置未定义的属性“ id”

3 个答案: