返回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 。

Answer 2

你有幾個問題。 一種是覆蓋內部HTML而不是附加HTML。 另一個是語法問題。

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

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

Answer 3

好吧，另一種解決方案，與您的代碼接近，使用html ，通過+=將所有字符串存儲在變量中，然后必須在for循環之前定義變量，然后在其之后移動html 。 您當前的代碼不起作用，因為它僅存儲了最后一個字符串，而不是全部。

 InsertLi(); function InsertLi() { var count = 5; var codeBlock = ''; for (var i = 0; i < count; i++) { 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>