将 JSON 内容输出到页面

如何解决将 JSON 内容输出到页面

我有一些代码正在查看 JSON 文件，然后需要将文件中的名称导出到带编号的 div 中；

$(data).each(function(i,el){
    var get_firstName = data[i].firstName;
    var nameItem = i+1;
    var outPutId = '#name-' + nameItem;
                                
    $(outPutId).html(get_firstName);
                
    console.log(outPutId);
    console.log(get_firstName);
});

还有 HTML：

<div id="#name-1"> </div>
<div id="#name-2"> </div>

我在控制台日志中看到的似乎是正确的，输出“#name-1”后跟“John”，然后是下一个条目等。 但是，页面上的 div 仍然是空的。

解决方法

您的 div 的名称中包含 #，这是多余的，但我不知道这是拼写错误还是您想让它们变成那样。您的 outPutId 的值为 { {1}} 并且当您调用 #name-1 时，您将获得 ID 为 $(outPutId) 的元素，因为 name-1 是 id 的选择器。为了让您的代码正常工作，我建议您更改 div Id

#

或者如果你真的不想改变 div id 名称，你可以像这样转义你的 <div id="name-1"> </div> <div id="name-2"> </div>

#

但我看不出这样做的理由。