Javascript 如何使用jquery在提要html中附加注释

这是api提供的详细数据

我正在开发SNS

我得到了这些数据 我想创建一个有2条注释的提要列表 但评论可能存在，也可能不存在

那么如何将这些注释附加到html中？

下面是示例代码 请添加注释html是

。feedComment

[
    {
        "id": 0,
        "owner": {
            "id": 0,
            "email": "",
            "username": "",
            "profile": "",
            "description": "",
            "followers": 0,
            "following": 0
        },
        "title": "",
        "content": "",
        "image_urls": [
            "image_url1",
            "image_url2",
            "image_url3", ...
        ],
        "liked_people": [
            1,
            2,
            3, ...
        ],
        "like_count": 0,
        "comment_count": 0,
        "view_count": 0,
        "tag" : [
          "tag1",
          "tag2",
          "tag3", ...
        ],
        "created_at": "",
        "comment_preview": [
            {
                "comment_id": 0,
                "owner": {
                    "id": 0,
                    "email": "",
                    "username": "",
                    "profile": "",
                    "description": "",
                    "followers": 0,
                    "following": 0
                },
                "content": "",
                "created_at": ""
            }, ...
        ]
    }, .....
]

const getFeed=（id）=>{
$.ajax({
url:`BASE\u url/feed/postList`，
键入：“GET”，
成功：功能（res）{
res.map（{id，owner，image\u url，title，content，tag，comment\u preview}）=>{
$（'.feedArea'）。追加(`
${owner.username}


${title}
${content}
${tag}
//我该怎么办？
`);
})   
},
错误：函数（err）{
控制台日志（err）；
},
异步：false
})

}

我的生命是有时间限制的。

---

如果我不解决这个问题，我可能会死。

假设您的ajax工作正常，您基本上需要它

const getFeed = (id) => {
$.ajax({
    url: `BASE_URL/feed/postList`,
    type: 'GET',
    success: function(res) {            
        res.map(({id, owner, image_urls, title, content, tag, comment_preview}) => {  
            $('.feedArea').append(`
               <div class='feed'>
                 <div class='feedHead'>
                     <div class='postmanProfile'>
                             <img src= "${owner.image}">                     
                     </div>
                     <div class='postmanName'>
                         <div class= 'postmanNameText'>${owner.username}</div>
                     </div>                     
                 </div>
                 <div class='disuniteLine'>
                     <hr>
                 </div>
                 <div class="feedThumbanil">
                     <div class="thumbanilImg">
                         <a href="detailFeed.html?id=${id}">
                             <img class="ImgArea" src="${image_urls}" alt="">
                         </a>
                     </div>
                 </div>
                 <div class="disuniteLine">
                     <hr>
                 </div>
                 <div class='feedLike_And_Comment'>
                     <div class='LikeIconImg like-${id}' feedId="${id}">

                     </div>
                     <div class="CommentIconImg">
                         <img class="commentImg" src="/picture/Icon/chat-box.png" alt="#">
                     </div>
                     <div class="viewMoreArea">
                         <img class="view_more" src="/picture/Icon/more.png">
                     </div>
                 </div>
                 <div class='title'>
                     <h2>
                         ${title}
                     </h2>
                 </div>
                 <div class='content'>
                     <span>
                         ${content}
                     </span>
                 </div>
                 <div class='tag'>
                     <h4>
                         ${tag}
                     </h4>
                 </div>
                 <div class="feedComment">
                    // What should I do?   
                 </div>
               </div>
            `);
        })   
    },
    error : function(err){
        console.log(err);
    },
    async: false    
})

${Object.keys（注释\预览[0]。所有者）
.map（key=>（key+“：“+注释\预览[0]。所有者[key]））
}

const res=[{“id”：0，“所有者”：{“id”：0，“电子邮件”：“用户名”：“个人资料”：“描述”：“关注者”：0，“关注者”：0，“标题”：“内容”：“图像URL”：[“图像url1”、“图像url2”、“图像url3”]，“喜欢的人”：[1,2,3]，“喜欢的人”：0，“评论计数”：0，“视图计数”：0，“标记”：“标记1”、“标记2”、“标记3”]，“已创建于”：“”“评论预览”：[{“评论id”：0，“所有者”：{“id”：0，“电子邮件”：”bla@bla.com“，”用户名“：”用户x“，”个人资料“：”x个人资料“，”说明“：”说明“，”关注者“：0，“以下“：0}”，内容“：”这是提要注释吗？”，“创建地点“：”}]}]
函数格式（res）{
弗雷赫酒店(({
身份证件
所有者，
图像和URL，
标题
内容,，
标签，
评论与预览
}) => {
$（'.feedArea'）。追加(`
${owner.username}
（键+”：“+注释\预览[0]。所有者[键]）
}
`);
})
}
格式（res）

---

const data=${comment\u preview}const comments=data.map（item=>{.returnitem.content

}）

<div class="feedComment">
   ${Object.keys(comment_preview[0].owner)
     .map(key => (key+":"+comment_preview[0].owner[key]))
    }
</div>