.append 一个带有图片的新 div答案

【问题标题】：.append a new div with pictures in it.append 一个带有图片的新 div
【发布时间】：2020-07-02 18:10:51
【问题描述】：

我正在使用 AJAX 编写一个 Flask 应用程序。用户进行查询，每次答案出现在一个新的 div 中；例如，他要求一个地点，应用程序会显示该地点的两张图片和一篇维基百科文章。问题是每次用户查询时，前一个 div 中也显示两张图片，只有最后一个 div 中只有两张图片。

    $("#chatbox").append( "<p class = display_question>"+data['user_question']+"</p>" );                            
    $("#user_form")[0].reset();
    $("#chatbox").append("<div class = pictures> </div>");       
    $(".pictures").append($('<img id = wiki_img>').attr('src', data['wiki_pic']));
    $(".pictures").append($('<img id = img>').attr('src', data['response']));        
    $("#chatbox").append( "<p class = wikidata>"+data['wiki_data']+"</p>" );

有没有办法在不将它们添加到前一张的情况下将包含两张图片的 div 附加到其中？

【问题讨论】：

标签： jquery ajax flask append

【解决方案1】：

您需要选择正确的元素（仅最后一个div.pictures）；在您选择所有 div.pictures 之前；见.last()

$("#chatbox").append( "<p class = display_question>"+data['user_question']+"</p>" );                            
$("#user_form")[0].reset();
$("#chatbox").append("<div class = pictures> </div>");       

// Append pictures to last element of class .pictures only
$(".pictures").last().append($('<img id = wiki_img>').attr('src', data['wiki_pic']));
$(".pictures").last().append($('<img id = img>').attr('src', data['response']));        

$("#chatbox").append( "<p class = wikidata>"+data['wiki_data']+"</p>" );

【讨论】：