Chrome控制台报Uncaught (in promise) TypeError：无法设置undefined的innerHTML属性

核心问题：循环边界越界 #

你代码里的两个for循环用了i <= postData.length和i <= postName.length的条件，这是典型的索引越界问题：

• 数组的索引从0开始，比如长度为3的数组，有效索引是0、1、2
• 当i等于数组长度时，postData[i]会返回undefined，此时尝试给undefined设置innerHTML，就会触发控制台里的TypeError

额外问题：未声明的全局变量 #

postName、postData、PN这几个变量没有用let/const声明，会自动挂载到全局作用域，可能和其他代码产生命名冲突，建议始终显式声明变量。

修复后的代码 #

let creatPost = document.getElementById('CP');

let postNames = document.querySelectorAll("#po");
console.log(postNames);

let postDatas = document.querySelectorAll("#dat");
console.log(postDatas);

let editBtns = document.querySelectorAll("#editBu");
console.log(editBtns);

let deleteBtns = document.querySelectorAll("#deleteBu");
console.log(deleteBtns);

// 显式声明变量
const postName = Array.from(postNames);
const postData = Array.from(postDatas);

// 循环条件改为 i < 数组长度
for (let i = 0; i < postData.length; i++) {
    let PD = postData[i];
    PD.innerHTML = "title";
};

for (let i = 0; i < postName.length; i++) {
    // 声明PN变量
    const PN = postName[i].innerHTML = "post " + (i + 1);
};

内容的提问来源于stack exchange，提问作者Abdallah Fahim