循环仅附加到一个元素而不是多个答案

【问题标题】：Loop only appending to one element rather than multiple循环仅附加到一个元素而不是多个
【发布时间】：2017-09-22 17:15:01
【问题描述】：

所以我似乎无法准确地弄清楚这一点。我想将按钮附加到每个没有空 id 的容器。所以在内容列表中有两个项目，我想附加按钮。问题是它只附加到列表中的最后一项。所以我的问题是为什么？以及如何解决它。

示例数据集

内容

0:{item_uuid: null, label: "11"}
1:{item_uuid: "49b661aa-222b-4c3c-a3cc-92db229c500e", label: "24"}
2:{item_uuid: null, label: "25"}
3:{item_uuid: null, label: "31"}
4:{item_uuid: "49b661aa-222b-4c3c-a3cc-92db229c500e", label: "43"}
5:{item_uuid: null, label: "44"}

守则

 for (var i = 0; i < contents.length; i++) {
      if (contents[i].item_uuid !== null) {
           $('#' + contents[i].label).append(button);
           button.setAttribute("class", "button");
      }
    }

【问题讨论】：

对我来说很好。 jsbin.com/cemulifuki/edit?html,js,console,output
您的代码运行良好.. 检查您的页面中是否同时包含 ids 24 和 43
嗯，这有点令人困惑。也许代码中的其他东西破坏了这个功能。虽然有点奇怪的互动
是的，我可能会不知所措。它找到了我正在寻找的两个 ID，并且只将按钮附加到最后一个 ID。
@SulimanSharif 我在尝试两次附加同一个按钮时遇到了一些奇怪的结果，这就是我在循环中创建它的原因。您可能需要确保没有将同一个按钮附加到多个容器。

标签： javascript jquery html

【解决方案1】：

您的代码有效，但在尝试两次附加同一个按钮时出现了一些奇怪的结果，这就是我在循环中创建它的原因。您可能需要确保没有将同一个按钮附加到多个容器。

E.G

 for (var i = 0; i < contents.length; i++) {
      if (contents[i].item_uuid !== null) {
        var button = $('<button>blah</button>');
           $('#' + contents[i].label).append(button);
           //button.setAttribute("class", "button");
      }
    }

【讨论】：

【解决方案2】：

可以在 for 循环中创建按钮对象。否则它将使用相同的按钮实例，并且只会附加到最后一个。

for (var i = 0; i < contents.length; i++) {
      if (contents[i].item_uuid !== null) {
           var button = createElement(....); //create it here
           $('#' + contents[i].label).append(button);
           button.setAttribute("class", "button");
      }
    }

【讨论】：