如何在 javascript 中循环数据

Question

我有一个这样的对象

var itemlist= {"50271":2,"50025":1,"90012":3}1

它表示要包含在混合物中的试剂。属性名称是试剂的 ID，属性值是数量。我想生成 HTML 来显示混合物的试剂，如下所示

<img src='50271.jpg'> x 2
<img src='50025.jpg'> x 1
<img src='90012.jpg'> x 3

如何循环对象以获得预期的输出？

Answer 1

您需要像这样遍历对象

for (var key in itemlist) {
  if (itemlist.hasOwnProperty(key)) {
    alert(key + " -> " + itemlist[key]);
  }
}

如图所示： How do I loop through or enumerate a JavaScript object?

Answer 2

您可以使用 for (prop in obj) 语法遍历对象的属性并生成特定的 HTML，如下所示：

var itemlist = {"50271":2,"50025":1,"90012":3};
var html = "";
for (var prop in itemList) {
    html += "<img src='" + prop + ".jpg'> x " + itemList[prop];
}
// insert the html somewhere now

P.S。我猜你可能希望在每行之后有一个 <br>。

P.P.S。 javascript 对象中的数据没有保证顺序，因此迭代可能以任何顺序结束。如果你想要一个特定顺序的集合，你必须使用数组，或者你可以先收集对象的所有键，然后在使用它们之前对键进行排序。

如何在 javascript 中循环数据

How to loop data in javascript

javascript

object