如何更换所有<li>元素<ul>使用 JQuery？

Question

如何在 JQuery 中替换ul所有li ，我不想通过使用append将任何新项目添加到列表中，而是希望在同一个ul一个包含新li元素的新列表。

我试过了

for (index = 0; index < users.length; ++index) {
$('#users').replaceChild(users[index].UserName, $('#users').childNodes[index]);
}

#HTML

<div class="col-md-4" style="margin:auto">
    <h2 class="text-success">Users</h2>
    <ul id="users" style="list-style:none"></ul>
</div>
         

但它只将 Array 的最后一个元素添加到ul ，如何在每次获得新列表时创建新的ul ？

Answer 1

如果包含数组示例会更好。 我做了一个片段，希望它有帮助。

 var array = ["New li 1", "New li 2", "New li 3"]; $('#load').click(function(){ $('#list').empty(); $.each(array, function( key, value ) { $('#list').append('<li>' + value + '</li>'); }); });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> <ul id="list"> <li>Old li 1</li> <li>Old li 2</li> <li>Old li 3</li> </ul> <button id="load">Load array</button>

Answer 2

您可以使用 jQuery .replaceWith()函数。

只需使用以下代码

$('#users').replaceWith( "<li>New Item</li>" );

参考这篇文章。