javascript - 如何在仍使用现有 CSS 的情况下 append Jquery html 代码

Question

我在java脚本中有这个函数

function appendAllQna(qnaList, num){
    for (var i in qnaList){ 
        var qnaCom = "";
        qnaCom += "<div class='scomment scommentLine'>";
        if(qnaList[i].sellerYn == "Y"){
            qnaCom += "<div class='avatar defaultstore'>";
        }else{
            qnaCom += "<div class='avatar defaultuser'>";
        }
        qnaCom += "<img src=''></div><table class='subTab'>";
        qnaCom += "<tbody><tr><td class='infoME'>";     
        if(qnaList[i].sellerYn == "Y"){
            qnaCom += "<span class='name'>";
            qnaCom += qnaList[i].nickNm;
            qnaCom += "</span><span class='badge'></span>";
        }else{
            qnaCom += "<span class='name'>";
            qnaCom += qnaList[i].memNM;
            qnaCom += "</span>";
        }
        var page = document.getElementById("addMoreQna"+num);
        page.append(qnaCom);
    }
}

这是我声明要 append 到我的 jsp 中的 div

<div id="addMoreQna<%= i%>"></div>

我想 append ，以便 html 也将与页面中存在的 css 一起出现。但结果只是出现这样的代码:

<div class='scomment scommentLine'><div class='avatar defaultuser'><img src=''></div><table class='subTab'><tbody><tr><td class='infoME'><span class='name'>Putri</span><div class='scomment scommentLine'><div class='avatar defaultuser'><img src=''></div><table class='subTab'><tbody><tr><td class='infoME'><span class='name'>Putri</span><div class='scomment scommentLine'><div class='avatar defaultuser'><img src=''></div><table class='subTab'><tbody><tr><td class='infoME'><span class='name'>Putri</span><div class='scomment scommentLine'><div class='avatar defaultuser'><img src=''></div><table class='subTab'><tbody><tr><td class='infoME'><span class='name'>undefined</span>enter code here

外观不正确。我应该怎么办？提前致谢。无论如何，我还是初学者:D

Answer 1

append 是一个 jquery 方法，但您使用它就像它是一个 javascript 方法一样。

要使用 jquery 方法，请使用:

$('#addMoreQna' + num).append(qnaCom);

或者如果是纯js:

page.innerHTML += qnaCom;