我循环了一些 json 并从数据中提取了 url。缩略图数据如下所示:
{href: "https://link/medium.jpg"}
href: "https://link/medium.jpg"
>__proto__: Object
如何公开每个网址,以便实际图像显示在浏览器上而不是链接上。这是我的代码。 console.log(o._links.thumbnail)
是我从上面收到的数据:
<html lang="en">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=\, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Fetch Json</title>
</head>
<body>
<p>
thumbnail:
</p>
<script>
const url =
"https://s3-us-west-2.amazonaws.com/example.json";
async function getThumbnail() {
const response = await fetch(url);
const data = await response.json();
var art = data._embedded.artworks;
art.forEach(function(o) {
//console.log(o._links.thumbnail);
var img = document.createElement("image");
img.src = o._links.thumbnail; //set the value equal to the href
document.querySelector("body").appendChild(img);
});
}
getThumbnail();
</script>
最佳答案
你需要操作 DOM,像这样。
let elem = document.createElement("img");
elem.src = o._links.href;
document.getElementById("placehere").appendChild(elem);
引用:
关于javascript - 如何公开 json 数据中的图像,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/57246012/