javascript - 动态创建的 div 中未显示数组元素？

Question

我正在尝试在动态创建的 div 中使用 html li 元素打印数组元素，但没有显示错误，而且数组元素都不是空的 div.

有什么问题吗？

这是我的代码:

var fruitsName, fruitsLists, numFruits, i;

fruitsName = ["Mango", "Apple", "Banana", "Strawberry", "Blackberry", "Blueberry"];
numFruits = fruitsName.length;
fruitsLists = "<ul>";

for (i = 0; i < numFruits.length; i++)
{
    fruitsLists = "<li>" + fruitsName[i] + "</li>";
}
fruitsLists += "</ul>";
var myDiv = document.createElement('div');
myDiv.className = 'bookmarksHolder';
myDiv.id = 'randomItem';

document.getElementById('bookmarks_row').appendChild(myDiv);
document.getElementById('randomItem').innerHTML = fruitsLists;

Answer 1

两个问题:numFruits已经是一个数组的长度，所以应该是 i < numFruits .其次，在循环中将先前的值与当前值连接起来:

for (i = 0; i < numFruits; i++) {
  fruitsLists += "<li>" + fruitsName[i] + "</li>";
}

完整示例:

var fruitsName, fruitsLists, numFruits, i;

fruitsName = ["Mango", "Apple", "Banana", "Strawberry", "Blackberry", "Blueberry"];
numFruits = fruitsName.length;
fruitsLists = "<ul>";

for (i = 0; i < numFruits; i++) {
  fruitsLists += "<li>" + fruitsName[i] + "</li>";
}
fruitsLists += "</ul>";

var myDiv = document.createElement('div');
myDiv.className = 'bookmarksHolder';
myDiv.id = 'randomItem';

document.getElementById('bookmarks_row').appendChild(myDiv);
document.getElementById('randomItem').innerHTML = fruitsLists;

<div id="bookmarks_row"></div>