Question

我有以下代码：

$.ajax({
    url: (path+args),
    type: "POST",
    success: function( data ){
        // do stuff with "data"
    }
});

如果数据如下所示：

<div id="imageList">
    <div class="image"></div>
    <div class="image"></div>
    <div class="image"></div>
    <div class="image"></div>
    <div class="image"></div>
    <div class="image"></div>
    <div class="image"></div>
    <div class="image"></div>
</div>

如何迭代具有div的数据？

Answer 1

如果您可以控制服务器返回的内容，我可能会将JSON发送回浏览器 - 例如：

[
    { url: "a.png" },
    { url: "b.png" }
]

...这样可以轻松完成for (var i = 0; i < data.length; i++) data[i].url。

之类的操作

也就是说，如果您无法控制从服务器返回的内容，您可以使用返回的数据创建一个片段并使用常规的jQuery方法。

$(data).children('.image').each(function() {
    var url = $(this).children('img').attr('src');  // or whatever
});

这是有效的，因为将一串HTML传递给jQuery会创建一个DocumentFragment，解析字符串中的HTML并创建一个“迷你DOM”。返回的jQuery对象选择该DOM的顶级元素（在本例中为div#imageList），您可以自由遍历片段DOM。

在我的示例中，我使用类#imageList选择image的子项，然后迭代每个选定的元素。

Answer 2

你可以做这样的事情

$(data).children('div').each(function(){
$(this).doSomething();
})

Answer 3

也许是这样的：

$.each( $('#imageList'), function(i, imageList) {
   $('div', imageList).each(function() {

   });
})

or could use something like:

$("#imageList").children().each()

我如何迭代数据？

3 个答案: