Codecademy jQuery坚持"Modifying HTML Elements"

Question

我们正在制作一个待办事项列表

以下是说明：

完善！现在我们要将 HTML 元素添加到文档中。我们可以使用方便的 .append（） 函数来做到这一点。 让我们继续使用 .list 类附加到我们的div。我们将附加一个 with class="item"，因为我们想要一种方法来定位我们附加的 s，稍后当我们删除它们时。（如果我们不能检查"待办事项"列表，那就不好了。 我们希望div 的内容是输入字段的内容，我们将其保存在变量 toAdd 中。这意味着当我们追加时，我们需要追加：

'<div class="item">' + toAdd + '</div>'

继续将 .append（） a 与 class="item" 添加到 HTML 文档的 .listdiv 中，然后确保单击您的按钮以添加项目——练习将等待您这样做！

我不明白需要做什么。

我试过这个：

$(document).ready(function() {
$("button").click(function () {
   var toAdd = $("input[name=checkListItem]").val();
   $(".list").append("div class='item'" + toAdd + "div");
});});

但是当我输入任何内容并单击按钮时，它不起作用。

Answer 1

关闭！试试这个：

$(document).ready(function() {
    $("#button").click(function() {
       var toAdd = $("input[name=checkListItem]").val();
       $(".list").append("<div class='item'>" + toAdd + "</div>");
    });
});

您的 append（） 中没有 HTML 尖括号。此外，$("button")应该$("#button")，因为它是 ID"按钮"，而不是真正的<button>。

Answer 2

$(".list").append("div class='item'" + toAdd + "div");

应该是：

$(".list").append("<div class='item'>" + toAdd + "</div>");

或

$(".list").append($('<div>').addClass('item').text(toAdd));