[英]JavaScript - Push objects within object to global array
ORIGINAL QUESTION 原始问题
I'm trying to write a function in JavaScript that allows for articles from another source to be loaded on another page using an XMLHTTPRequest. 我正在尝试用JavaScript编写一个函数,该函数允许使用XMLHTTPRequest将来自另一个来源的文章加载到另一个页面上。
Each article is a JavaScript object containing the link, image, summary etc. 每篇文章都是一个JavaScript对象,其中包含链接,图像,摘要等。
Each request will retrieve 5 articles, but I only want to show 4 articles on each button click. 每个请求将检索5条文章,但是我只想在每次单击按钮时显示4条文章。 Because of this, I want to push the articles (objects) to a global array. 因此,我想将项目(对象)推送到全局数组。
Since I'm fairly new at using XMLHTTPRequests, I can't find how to do this. 由于我刚开始使用XMLHTTPRequests,所以找不到如何执行此操作。
Everything works except for: 一切正常,除了:
var i;
for (i = 0; i < newArticles.length; i++) {
articles.push(newArticles[i]);
}
newArticles is an object containing the 5 articles (objects) which I'm trying to push to the global array titled articles. newArticles是一个对象, 其中包含 5个文章(对象),我正尝试将它们推送到标题为articles的全局数组中。
My code: 我的代码:
var articles = [];
document.getElementById("fc-blog-button-loadmore").addEventListener("click", receiveNewArticles);
function receiveNewArticles() {
var http = new XMLHttpRequest();
var url = "thelinktothepagewith5newarticles.json";
http.onreadystatechange = function() {
if(http.readyState == 4 && http.status == 200) {
var newObj = JSON.parse(http.responseText);
var newArticles = (newObj.blog.articles);
console.log(newObj);
console.log(newArticles);
var i;
for (i = 0; i < newArticles.length; i++) {
articles.push(newArticles[i]);
}
console.log(articles);
}
}
http.open("GET", url, true);
http.send();
}
SOLVED 解决了
After the helpful comments my code currently looks like this: 在提供有用的注释之后,我的代码当前如下所示:
var articles = [];
document.getElementById("fc-blog-button-loadmore").addEventListener("click", receiveNewArticles);
function receiveNewArticles() {
var http = new XMLHttpRequest();
var url = "http://freshcotton-dev.webshopapp.com/nl/blogs/blog/page2.html?format=json";
http.onreadystatechange = function() {
if(http.readyState == 4 && http.status == 200) {
var newObj = JSON.parse(http.responseText);
var newArticles = (newObj.blog.articles);
console.log(newObj);
console.log(newArticles);
articles.push(...Object.values(newArticles))
console.log(articles);
}
}
http.open("GET", url, true);
http.send();
}
Problem has been solved! 问题已解决!
You can solve the issue simply by using [spread operator][1] ... 您可以简单地通过使用[spread operator] [1]解决问题。
articles.push(...Object.values(newArticles));
[1]: https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/Spread_syntax
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.