我正在使用 MET API 來顯示特定部門中每件藝術品的資訊。為此，我嘗試first10使用forEach. 當我查看 console.log 時，我可以看到objs中的每一個，first10但是一旦到達，我只會得到陣列object.onload中最后一個的“卡片” 。objs
這是 HTML：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
</head>
<body id="home">
<main id="results-container"></main>
<script src="js/script.js" type="text/javascript"></script>
</body>
</html>
這是 JavaScript：
let resultsBody = document.getElementById('results-container');
objects.open('GET', `https://collectionapi.metmuseum.org/public/collection/v1/objects?departmentIds=6`, true);
objects.onload = function() {
let data2 = JSON.parse(this.response);
if (objects.status >= 200 && objects.status < 400) {
let first10 = data2.objectIDs.slice(0, 4);
intr = 0;
first10.forEach(objs => {
object.open('GET', `https://collectionapi.metmuseum.org/public/collection/v1/objects/${objs}`, true);
object.onload = function() {
let data3 = JSON.parse(this.response);
if (object.status >= 200 && object.status < 400) {
const card = document.createElement('div');
card.setAttribute('class', 'card');
const images = document.createElement('div');
images.innerHTML = `<img src="${data3['primaryImageSmall']}">`;
const h1 = document.createElement('h1');
h1.style.color = "black";
h1.textContent = data3['title'];
const p = document.createElement('p');
p.style.color = "black";
p.textContent = data3['artistDisplayName'];
resultsBody.appendChild(card);
card.appendChild(images);
card.appendChild(h1);
card.appendChild(p);
// }
}
}
object.send();
});
}
}
objects.send();
我一直在試圖弄清楚如何用每個objs. 我一直在研究與我相關的其他問題，但我并沒有真正理解它如何應用于我的問題，因為我仍然從 JavaScript 開始。
uj5u.com熱心網友回復：
我認為您應該new XMLHttpRequest();
在每次 forEach 迭代中宣告：
first10.forEach(objs => {
/*HERE*/ let object = new XMLHttpRequest();
object.open('GET', `https://collectionapi.metmuseum.org/public/collection/v1/objects/${objs}`, true);
否則，您將重新分配對同一物件的新呼叫，因此您只能獲得最后一個。
轉載請註明出處，本文鏈接：https://www.uj5u.com/shujuku/449701.html
標籤：javascript 数组 循环 前锋
下一篇：重構代碼以避免訓練回圈中的回圈？