javascript - Instagram API - 使用 jquery 获取图像

Question

我制作了一个 AJAX 函数来获取我的 Instagram 帐户的四张最新图像。现在我想做一个append函数将我的前两张图像插入 <div>叫insta-left以及另外两个人 <div>叫insta-right ，但我找不到拆分函数的解决方案:

var token = 'MY_TOKEN', 
    userid = MY_USER_ID,
    num_photos = 4; // number of photos i get

$.ajax({
    url: 'https://api.instagram.com/v1/users/' + userid + '/media/recent',
    dataType: 'jsonp',
    type: 'GET',
    data: {
        access_token: token,
        count: num_photos
    },
    success: function(data) {
        console.log(data);
        for (x in data.data) {
            $('.insta-left').append('<img src="' + data.data[x].images.low_resolution.url + '">');
        }
    },
    error: function(data) {
        console.log(data);
    }
});

如果我这样做，所有图像都将被插入到 insta-left 中。我如何拆分我的函数来获取此 <div> 中的前两张照片以及另一个最新的两个 <div> ？

Answer 1

做一个常规的 for 循环并检查索引怎么样？

success: function(data) {
console.log(data);
    for (i = 0; i < data.data.length; i++) {
        if (i < 2) {
            $('.insta-left').append('<img src="' + data.data[i].images.low_resolution.url + '">');
        } else {
            $('.insta-right').append('<img src="' + data.data[i].images.low_resolution.url + '">')
        }
    }

您可能还需要考虑 Instagram API 返回的照片数量少于您请求的照片数量的情况。