首先，抱歉，如果这是一个noob错误，我是JS和Stack Overflow的新手，我真的无法解决这个问题。我正在制作一个待办事项列表应用程序，有多个待办事项列表，我有一个功能，它获取页码并返回列表元素（我在同一个html文件中有所有待办事项列表，而且我是＆＃39; m使用Swipe.js在页面之间移动）。我在名为list的每个meshgrid元素上都有一个属性，该函数使用JQuery查找与页码匹配的列表项。这是功能：
ul然后我有另一个函数接受// Return target list based on page number
function returnList(listNumber, completed) {
var list;
if (listNumber == 0 && completed == false) {
list = $("ul[list='todo1']")
} else if (listNumber == 0 && completed == true) {
list = $("ul[list='completed1']")
} else if (listNumber == 1 && completed == false) {
list = $("ul[list='todo2']")
} else if (listNumber == 1 && completed == true) {
list = $("ul[list='completed2']")
} else if (listNumber == 2 && completed == false) {
list = $("ul[list='todo3']")
} else if (listNumber == 2 && completed == true) {
list = $("ul[list='completed3']")
} else if (listNumber == 3 && completed == false) {
list = $("ul[list='todo4']");
} else if (listNumber == 3 && completed == true) {
list = $("ul[list='completed4']");
} else {
console.log("It's broken. Yay!");
}
return list;
}
元素并添加一个带有按钮等的列表项。我使用insertBefore。这是函数：
ul然而，当我运行//Adds a new item to the todo list
function addItemToDOM(text, completed, listNumber) {
var list = returnList(listNumber, completed);
console.log(list);
var item = document.createElement('li');
item.innerText = text;
var buttons = document.createElement('div');
buttons.classList.add('buttons');
var remove = document.createElement('button');
remove.classList.add('remove');
remove.innerHTML = removeSVG;
// Add click event for removing the item
remove.addEventListener('click', removeItem);
var complete = document.createElement('button');
complete.classList.add('complete');
complete.innerHTML = completeSVG;
// Add click event for completing the item
complete.addEventListener('click', completeItem);
buttons.appendChild(remove);
buttons.appendChild(complete);
item.appendChild(buttons);
console.log(list.childNodes);
list.insertBefore(item, list.childNodes[0]);
}
时，它会在list.insertBefore上抛出错误，说没有子节点。
如果需要，可以使用以下列表的HTML代码：
list.childNodes[0]有什么想法吗？谢谢！
答案 0 :(得分：0)
方法returnList返回一个jQuery对象，该对象没有childNodes属性。因此，错误是预期的。
您可以使用.get(index)获取对DOM元素的引用，然后可以使用childNodes属性。
var elem = returnList(listNumber, completed)
//Also handler if undefined is returned from the function
if(elem == undefined){
return;
}
var list = elem.get(0);
您可以将.prepend()函数与jQuery对象一起使用。
list.prepend(item);