希望有人能帮忙。这个小项目的目标是搜索电影数据库 OMDB，并将获取的结果显示在搜索栏下方。我有一种感觉，当我尝试对返回的结果使用 forEach 循环时，代码会中断，但我找不到错误。感谢您的每一次帮助!谢谢!
var httpRequest = new XMLHttpRequest();
httpRequest.onload = function() {
if (httpRequest.readyState === XMLHttpRequest.DONE) {
if (httpRequest.status === 200) {
var response = JSON.parse(httpRequest.responseText).Search;
var body = document.getElementsByTagName("body");
response.forEach(function (element, index) {
body.appendChild(" <img src="+element[index].Poster+"/>" +
"<p>Title: <a href = 'https://www.imdb.com/title/"+element[index].imdbID+"' >" +element[index].Title+ "</a></p>" +
"<p>Year: "+ element[index].Year+"</p>" +
"<p>Type: "+element[index].Type+"</p>");
});
} else {
console.log(httpRequest.statusText);
}
}
};
httpRequest.onerror = function() {
console.log(httpRequest.statusText);
};
var searchMovie = function () {
var input = document.querySelector('input').value;
if (input) {
httpRequest.open('GET', 'https://www.omdbapi.com/?s=' + input + '&plot=short&apikey=b7da8d63');
httpRequest.send(null);
}
};
最佳答案
这是一个工作示例，假设您要取回一系列电影。
const response = JSON.parse('{"Search":[{"Title":"The Town","Year":"2010","imdbID":"tt0840361","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMTcyNzcxODg3Nl5BMl5BanBnXkFtZTcwMTUyNjQ3Mw@@._V1_SX300.jpg"},{"Title":"Ghost Town","Year":"2008","imdbID":"tt0995039","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMTQyODQ4MzYxN15BMl5BanBnXkFtZTcwOTQ1MDczMw@@._V1_SX300.jpg"},{"Title":"Cougar Town","Year":"2009–2015","imdbID":"tt1441109","Type":"series","Poster":"https://m.media-amazon.com/images/M/MV5BMTQyMDI2MDM5NF5BMl5BanBnXkFtZTgwOTcyNDE5MDE@._V1_SX300.jpg"},{"Title":"New in Town","Year":"2009","imdbID":"tt1095174","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMzAxNzU4MDE1Nl5BMl5BanBnXkFtZTcwOTQ0NDcwMg@@._V1_SX300.jpg"},{"Title":"Mr. Deeds Goes to Town","Year":"1936","imdbID":"tt0027996","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BNzdiMDVkNmMtNDI0Ny00MTQ5LWEwNjAtODQxOGNjOTZmMGVmL2ltYWdlXkEyXkFqcGdeQXVyMDI2NDg0NQ@@._V1_SX300.jpg"},{"Title":"On the Town","Year":"1949","imdbID":"tt0041716","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BNjk0YmVlNTQtZDg0NC00MGYyLWFhYTMtMTBlMzFkYjczMDMyXkEyXkFqcGdeQXVyMDI2NDg0NQ@@._V1_SX300.jpg"},{"Title":"The Town That Dreaded Sundown","Year":"2014","imdbID":"tt2561546","Type":"movie","Poster":"https://m.media-amazon.com/images/M/MV5BMTUwNzUyNjEwM15BMl5BanBnXkFtZTgwOTk3MTc2MjE@._V1_SX300.jpg"}],"totalResults":"1588","Response":"True"}');
// Get the body, which is the first element in the array
// returned by document.getElementsByTagName()
var body = document.getElementsByTagName("body")[0];
var movie;
response.Search.forEach(function (element) {
// Create a new element to append
movie = document.createElement('div');
// Add HTML contents to new element
movie.innerHTML =
"<img src="+element.Poster+"/>" +
"<p>Title: <a href = 'https://www.imdb.com/title/"+element.imdbID+"' >"+element.Title+ "</a></p>" +
"<p>Year: "+element.Year+"</p>" +
"<p>Type: "+element.Type+"</p>";
// Append new element
body.appendChild(movie);
});<html>
<head></head>
<body>
</body>
</html>关于javascript - 在 forEach 循环后显示 HTML 时出现问题，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/61543067/