Question

我有这个

<div id="inprog_table">
</div>

我试过这个插入

  var div = document.getElementById('inprog_table');
  div.innerHTML = div.innerHTML+
      "<div class='row'>
              <div class='col-xs-7'>
                 "+ $(".row.active .col-xs-7 p:first-child").text()+"  
              </div>
              <div class='col-xs-2'>
                  "+ $(".row.active .col-xs-7 p:last-child").text()+"
              </div>

              <div class='col-xs-2'>
                1
              </div>"

在inprog_table div中。我知道这是错的，但我不知道如何追加所有这些。

Answer 1

JavaScript中的字符串文字不能延伸到多行，您必须使每个字符串在它开始的同一个末尾结束，或者使用\

转义新行

var div = $('#inprog_table');
div.append( "<div class='row'>"+
              "<div class='col-xs-7'>"+
                $(".row.active .col-xs-7 p:first-child").text() + 
              "</div>" +
              "<div class='col-xs-2'>" +
                $(".row.active .col-xs-7 p:last-child").text()+
              "</div>"+
              "<div class='col-xs-2'>1</div>"+
            "</div>");

Answer 2

使用.append()

$('#inprog_table').append("<div class='row'><div class='col-xs-7'>" + $(".row.active .col-xs-7 p:first-child").text() + "</div><div class='col-xs-2'>" + $(".row.active .col-xs-7 p:last-child").text() + "</div><div class='col-xs-2'>1</div>");

使用.html()

$('#inprog_table').html(function (_, old_html) {
    return old_html + "<div class='row'><div class='col-xs-7'>" + $(".row.active .col-xs-7 p:first-child").text() + "</div><div class='col-xs-2'>" + $(".row.active .col-xs-7 p:last-child").text() + "</div><div class='col-xs-2'>1</div>"
});

Answer 3

使用jQuery来表达这些内容。纯粹的Javascript太麻烦了。

这是jQuery中的代码：

$('#inprog_table').html(
    '<div class="row">' +
        '<div class="col-xs-7">' +
            $(".row.active .col-xs-7 p:first-child").text() +  
        '</div>' +
        '<div class="col-xs-2">' +
            $(".row.active .col-xs-7 p:last-child").text() +
        '</div>' +
        '<div class="col-xs-2">1</div>' +
    '</div>'
);

Answer 4

您可以使用：

.append（） -

Ex：$（“＃div1”）。append（要追加的元素）

或者

。经过（） -

Ex：$（“＃div1”）。after（要追加的元素）

如何在里面附加一个带有javascript的div

4 个答案: