Question

我有一些js代码，当单击一个按钮时会插入一个section标签。我想在插入时将部分内容放在section标签中。优选地，这将在相同的按钮点击上发生。

HTML（工作）：

<button a onclick="runme()">New Slide</button>

JS（工作）：

 function runme()
{

    var sec = document.createElement("section");
    document.getElementById('slides').appendChild(sec);
}

要添加到部分代码的代码：

<b>Title</b><br><br>

                    <small>
                        <ul>
                            <li></li><br>
                            <li></li><br>
                            <li></li><br>
                            <li></li><br>
                            <li></li><br>
                            <li></li><br>
                            <li></li><br>
                        </ul>
                    </small>

                <br>

Answer 1

在这里检查demo

   function runme()
  {
     var sec = document.createElement("section");
     sec.innerHTML = '<b>Title</b><br><br> <small> <ul>  <li></li><br><li></li><br><li></li><br><li></li><br><li></li><br><li></li><br><li></li><br> </ul></small><br>';
     document.getElementById('slides').appendChild(sec);
  }

Answer 2

您可以创建每个节点并将其附加到yor＆＃34; sec＆＃34;变量。您还可以使用 innerHTML 属性，只需在变量中编写HTML代码即可。如果您只想添加文字，可以使用 textContent 属性，而不是 innerHTML 。

sec.innerHTML = "<div>content of the <i>section</i></div>";

Answer 3

使用此代码，您还可以设置所需的属性，例如class属性或id属性：

 function runme()
 {
    var cont = "<b>Title</b><br><br> <small><ul><li></li><br><li></li><br><li></li><br><li></li><br><li></li><br><li></li><br><li></li><br></ul></small><br>"; 

    var sec = $('<section/>',{
                 class : 'hi'}).appendTo('body'); //<-- with additional attribute
    var sec = $('<section/>').appendTo('body'); //<-- without additional attribute

    $('section').html(cont);
 }

Answer 4

检查bin中的工作代码。你必须使用innerHTML来实现这一点。

插入包含内容的部分

4 个答案: