Question

我有一个数组：

[{
  "img_ID": 1,
  "ci_ID": 1,
  "ciCode": "CI_00001ID",
  "Title": "my_images_01",
  "Image": "C:\\Users\\SMG48\\Downloads\\Images\\wp2448691-jihyo-twice-wallpapers.jpg"
}]

反正有使用JavaScript在Image标签中的数组上显示<img>吗？

Answer 1

在使您获得数组的函数中：

function displayImg(array) {
    var img;
    for (var i = 0; i < array.length; i++) {
        img = document.createElement('img');
        img.source(array[i]['Image']);
      document.appendChild(img); // if you want just to append to parent
    }
}

Answer 2

您可以使用DOM API动态创建Image元素并将其附加到DOM。

您可以遍历图像响应数组，并在循环中添加以下代码。

var someParentNode; // Some DOM Node
var images = [{
  "img_ID": 1,
  "ci_ID": 1,
  "ciCode": "CI_00001ID",
  "Title": "my_images_01",
  "Image": "C:\\Users\\SMG48\\Downloads\\Images\\wp2448691-jihyo-twice-wallpapers.jpg"
}]

images.forEach((img) => {

var IMG = document.createElement('img');
IMG.source(img.Image)

// append to parent. 
someParentNode.appendChild(IMG);
}

参考：https://www.w3schools.com/jsref/dom_obj_image.asp

Answer 3

在您的脚本中：

images = [{
  "img_ID": 1,
  "ci_ID": 1,
  "ciCode": "CI_00001ID",
  "Title": "my_images_01",
  "Image": "C:\\Users\\SMG48\\Downloads\\Images\\wp2448691-jihyo-twice-wallpapers.jpg"
}] //for each Images ________

images.forEach(function(element) {
  document.getElementById("img").src = element.Image;
});

如何使用JavaScript在<img>元素中显示图像？

3 个答案: