Question

制作一个简单的待办事项列表，这里我动态添加任务，但是当我刷新页面时，动态添加的DOM将会关闭，我希望保持这种状态。可能吗？

HTML

<input class="form-control" placeholder="Enter text here" id="todoTxt" type="text" name="todo">
  <button id="todoSub" class="btn btn-success form-control">Submit</button>
    <div id="todoList" class="list-group">
      <button type="button" class="list-group-item done">task one<span class="badge">x</span></button>
      <button type="button" class="list-group-item">task two<span class="badge">x</span></button>
      <button type="button" class="list-group-item">task three<span class="badge">x</span></button>
    </div>

的JavaScript

function addlist(content){
        var newListItem = $('<button></button>');
        $(newListItem).addClass('list-group-      item').text(content).append('<span class="badge">x</span>');
        $('#todoList').append(newListItem);
    }
        $('#todoSub').click(function(e){
        console.log(e);
        var content = $('#todoTxt').val();
        addlist(content);
    });
        //And Here I am unable to remove dynamically added DOM
        $('#todoList button span').click(function(e){
        e.stopPropagation();
        $(this).parent().remove();
    });

Answer 1

是的，您可以将新创建的html保存在file，database，local storage，session等持久存储的位置。

意味着，每次动态生成任务的新html时，都必须将其存储在上面列出的存储中的任何一个中。当刷新或第一次刷新页面后，您必须检查该存储并将最近创建的html呈现给。当用户删除该html时，将其从该存储中删除。

Answer 2

是肯定的。它可能但不是whit html和 jquery 或 js 。您需要使用数据库来保存添加了whit DOM的元素。

如何使DOM元素保持（刷新后），这是动态添加的

2 个答案: