javascript - 添加到 div 的正确方法是什么？

Question

我正在使用.text()添加到div 。我不知道我要添加多少。但如果我使用 .text()超过一次它只会添加最后一个。我用过.text(msg1,msg2,msg3)这对我来说确实有用，但如果文本更加有序，我希望它。就像每一条消息后都会开始一个新行。我尝试添加空格，但这不起作用，也不是我想要的方式。我刚刚有一个 div，我尝试添加 <p>就是这样，我试过$("p:first")通过ID尝试过。我已经添加了一个 fiddle 。

http://jsfiddle.net/G24aQ/12/

if(k1<10){
  msg1= "This will not space like a want." + "  "
  msg2= "I don know why not.      "
  msg3= "How come.       "
  $('#output1').text(msg1);
  $('#p').text(msg2);
  $('#output1').text(msg3+"      "+msg2+"       "+ msg1);
}

Answer 1

1. 您可以使用<br/>在新行中添加消息。
2. 您可以使用html而不是text并一次性添加所有内容。要一一添加，请使用 html和append在一起。

演示:http://jsfiddle.net/G24aQ/14/

if (k1 < 10) {
        msg1 = "This will not space like a want.<br/>";
        msg2 = "I don know why not.<br/>";
        msg3 = "How come.<br/>";
        $('#output1').html(msg3 + msg2 + msg1); //this will add all the three variables together into #output1 - replacing older content
        /*
        //To add one by one 
        $("#output1").html(msg3); // this will erase the older content so that you have a clean #output1 div
        $("#output1").append(msg2); //this will add to the existing content, will not over write it
        $("#output1").append(msg1); //this will add to the existing content, will not over write it
        */
}

永远记住html() & text()将删除选择器中的所有内容并将新内容添加到其中。 append添加到现有内容。并且，如果 text()，您的 HTML 标记将被忽略。已使用。

html 的文档& append 获取额外信息。