jquery - 从 api 获取数据为 json，但 html 嵌套已关闭

Question

在循环一些 JSON 数据时，我试图<a>在我的<li>标签中嵌套一个标签，但它不是：

var ul = $('<ul/>');
$.each(data.headlines, function() {
var linkFromJson = "<a>" + this.headline + "</a>";
linkFromJson = $(linkFromJson).attr("href", this.links.web.href).attr("target", "_blank");
var listItem = document.createElement('li');
ul.append(listItem, linkFromJson);
});
// append this list to the document body
$('body').append(ul);

我得到的是 a<li></li>和<a>标签，但它正确显示超链接。当我编写代码以嵌套 json 时，它会[object][Object]在遍历每个<li>标签的项目后返回给我。

我究竟做错了什么？

谢谢！

编辑：我想通了，用于.html在 中插入内置链接<li>，然后将<li>s 附加到<ul>：

var ul = $('<ul/>');
$.each(data.headlines, function() {
var linkFromJson = "<a>" + this.headline + "</a>";
linkFromJson = $(linkFromJson).attr("href", this.links.web.href).attr("target", "_blank");
var listItem = $('<li/>');
$(listItem).html(linkFromJson);
ul.append(listItem);
});
// append this list to the document body
$('body').append(ul);
},
error: function() {
// handle the error
}

Answer 1

根据.append(),ul.append(listItem, linkFromJson)将所有内容ul按顺序插入到元素的末尾。它不会将给定的内容相互嵌套。

为此，您必须先附加<a>到<li>，然后将结果附加<li>到<ul>

var listItem = document.createElement('li');
listItem.append(linkFromJson);
ul.append(listItem);