使用Javascript

Question

Retrieve data from JSON file and display images in a gallery

  

我能够在HTML页面上输出.json

@Jesuraja - 你是怎么做到这一点的。 我实际上是在同一个州。我有JSON文件，其图像本地驱动器位置与您的相似，我想知道您是如何执行上述步骤的。 我只想要一个方法我应该如何进行

Answer 1

试试这个：

＆＃13;

＆＃13;

var jsonObj = {
"items": [
    {
      "url": "images/image_1.jpg",
      "caption": "Image 1 Caption"
    },
    {
      "url": "images/image_2.jpg.jpg",
      "caption": "Image 2 Caption"
    },
    {
      "url": "images/image_3.jpg.jpg",
      "caption": "Image 3 Caption"
    },
    {
      "url": "images/image_4.jpg.jpg",
      "caption": "Image 4 Caption"
    }
  ]
};

function createGallery(array) {
    // Create the list element:
    var list = document.createElement('ul');

    for(var i = 0; i < array.length; i++) {
        // Create the list item:
        var item = document.createElement('li');

        // Set its contents:
        item.appendChild(document.createTextNode("Image : "+array[i].url+"  Caption: "+array[i].caption));

        // Add it to the list:
        list.appendChild(item);
    }

    // Finally, return the constructed list:
    return list;
}

// Add the contents of options[0] to #foo:
document.getElementById('gallery').appendChild(createGallery(jsonObj.items));

＆＃13;

<div id="gallery"></div>

＆＃13;

＆＃13;

＆＃13;