如何使用Jquery向附加元素添加類？

Question

如何在使用jquery追加元素時添加'list-group-item'類？

將<li>附加到<ul id="todoList"> ，類屬性無法正常工作。

  $("#todoList").append($('<li>', {
    text: $('#todoInput').val(),

    class: $('list-group-item') // this is not working
  }));

Answer 1

你可以做：

 $("#todoAddBtn").on("click", function() { $("#todoList").append($('<li>', { text: $('#todoInput').val(), class: 'list-group-item' // <-- Class name should be an string })); $('#todoInput').val(''); // Clear input.. }); 

 .list-group-item { color: blue; } 

 <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <ul id="todoList"></ul> <input id="todoInput"> <button id="todoAddBtn">Add</button> 

Answer 2

當你class: $('list-group-item') ，你基本上是在創建一個你添加到class的對象。 您只需要一個類名的字符串，而不是一個對象。 所有你需要的是class: 'list-group-item' 。

$("#todoAddBtn").on("click", function() {
  $("#todoList").append($('<li>', {
    text: $('#todoInput').val(),
    class: 'list-group-item'
  }));
});

Answer 3

如果要添加此“list-group-item”，請將其更改為

class: 'list-group-item'