javascript - 使用 for 循环遍历 JSON

Question

我正在尝试通过遵循 JSON- 添加图像

json = [{
        "id": 6,
        "name": "rac2 ",
        "shop_id": 4,
        "categories_id": 5,
        "category": "category-5",
        "min_price": 555,
        "max_price": 55656,
        "image": "http://www.shopforshops.com/www/61/files/clothing-racks1.jpg",
    },
    {
        "id": 64,
        "name": "rac32 ",
        "shop_id": 4,
        "categories_id": 5,
        "category": "category-5",
        "min_price": 555,
        "max_price": 55656,
        "image": "http://ohjoy.blogs.com/.a/6a00d8341c6a0853ef019affb2bbfe970c-800wi",
    },
    {
        "id": 643,
        "name": "rac32 ",
        "shop_id": 44,
        "categories_id": 5,
        "category": "category-5",
        "min_price": 555,
        "max_price": 55656,
        "image": "http://cache2.asset-cache.net/gc/129305805-racks-of-clothes-in-a-menswear-store-gettyimages.jpg?v=1&c=IWSAsset&k=2&d=mcPYJ5XyANr2jzh2gHmNDG%2FS5MzSDogxQ%2BKrWHyAnTHGKr%2FOnkBx3JkVNAMcV9GZ",
    },
]

我像这样循环它-

 $('.rackLayer').css({"background-image": "url('" + json[0].image + "')"});
            for (z = 1; z < json.length; z++)
            {
                    $('.rackLayer').after("<div class='inside-rack'> </div>");
                    $('.inside-rack').css({"background-image": "url('" + json[z].image + "')"});
            }

html 是-

<div class="container-fluid">
            <div class="row">
                <div id="scroll-section">
                    <div class="rackLayer">

                    </div>
                </div>
            </div>
        </div>

我想要的是首先添加带有 O 索引的图像，然后按照索引 1 然后 2 的顺序添加剩余图像。

有人能帮忙吗？

Answer 1

更新到这个:

for (z = 1; z < json.length; z++)
{
   var div = $("<div >", { //<---creates div element
      class  :'inside-rack', 
      'style':'background-image:url("'+ json[z].image +'")' // <--style the bgimg
   });
   $('.rackLayer').after(div); //<---now push in the DOM.
}

问题在我看来是选择器，$('.inside-rack') 这将针对所有 div 进行更改。当循环结束时，每个人都从 json 中获取最后一个对象的图像属性。
因此，解决方案是在那里创建一个新的元素样式，然后将其推送到 DOM 中。