javascript - 在javascript中返回html代码

Question

我想在 Javascript 代码中打印 html 代码。我想打开和关闭五个li标签的底线。我怎样才能用 for 循环做到这一点

jQuery(document).ready(function () {
   InsertLi();
});

function InsertLi(){
   var count = 5;
   for (var i = 0; i < count; i++) {
       var codeBlock = ' <li>' + i + '</li>';
       $(".bildirimMetin").html(codeBlock);
  }
}

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="bildirimMetin">
</ul>

Answer 1

您需要改用append 函数。 html 函数每次都会用新内容覆盖您的 html 内容，您只会得到最后一个。还使用 5 个 li-s 创建您的字符串，然后在末尾调用 append 以使用 DOM 一次并获得更高的性能。

function InsertLi() {
   var count = 5;
   var codeBlock = '';
   for (var i = 0; i < count; i++) {
       codeBlock += ' <li>' + i + '</li>';
   }
   
   $(".bildirimMetin").append(codeBlock);
}

jQuery(document).ready(function () {
   InsertLi();
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<ul class="bildirimMetin"></ul>

如果您只有一个项目具有 bildirimMetin 类，最好使用 id 而不是 class。