html中用无序列表表示数组,从javascript数组创建一个html无序列表

我有一点问题.我正在尝试从javascript数组创建一个无序列表,这是我的代码：

var names = [];

var nameList = "";

function submit()

{

var name = document.getElementById("enter");

var theName = name.value;

names.push(theName);

nameList += "

" + names + "";

document.getElementById("name").innerHTML = nameList;

}

例如,如果我发布2个名称,Name1和Name2,我的列表如下所示：

•Name1

•Name1,Name2

我希望它看起来像这样：

•Name1

•Name2

解决方法:

function submit()

{

var name = document.getElementById("enter");

var theName = name.value;

names.push(theName);

document.getElementById("name").innerHTML = "";

for (var I = 0; I < names.length; I++)

{

nameList = "

" + names[I] + "";

document.getElementById("name").innerHTML += nameList;

}

}

您正在使用数组,当您打印数组时,JavaScript将显示以逗号分隔的数组的所有条目.您需要遍历数组以使其工作.但是你可以优化这个：

var names = [];

function displayUserName()

{

var theName = document.getElementById("enter").value;

if (theName == "" || theName.length == 0)

{

return false; //stop the function since the value is empty.

}

names.push(theName);

document.getElementById("name").children[0].innerHTML += "

"+names[names.length-1]+"";

}

在此示例中,通过使用添加了lis(列表项)的UL(或无序列表)容器,HTML在语法上是正确的.

document.getElementById("name").children[0].innerHTML += "

"+names[names.length-1]+"";

此行选择具有名称的div：name及其第一个子项(ul).然后它将LI附加到列表中.

正如@FelixKling所说：避免使用保留或含糊不清的名称.

标签：javascript,dom,html

来源： https://codeday.me/bug/20190716/1476501.html