我正在使用 AJAX 来显示帖子,我试图从返回的 JSON 对象中获取每个属性并创建 <article>
从标题开始,然后是后续的 <section>
从内容来看。我可以将标题添加到页面中,但是我不确定如何在同一个 for 循环中添加该部分。
JS:
function loadBlog(xhr) {
var mainText = document.querySelector('.main-text');
var result = JSON.parse(xhr.responseText);
for(var i = 0; i < countObject(result); i++) {
var title = document.createElement('article').appendChild(document.createTextNode(result[i].title));
var data = document.createElement('section').appendChild(document.createTextNode(result[i].content));
var output = mainText.appendChild(title)
}
}
最佳答案
您的问题是 .appendChild
返回子项(它是一个 TextNode),而不是父项(它是一个 Article)。
var article = document.createElement("article"),
title = document.createElement("h1"),
titleText = document.createTextNode(result[i].title),
content = document.createElement("section"),
contentText = document.createTextNode(result[i].content);
title.appendChild(titleText);
content.appendChild(contentText);
article.appendChild(title);
article.appendChild(content);
如果您真的想将它们链接在一起,那么您可以执行以下操作:
var article = document.createElement("article")
.appendChild(document.createElement("h1"))
.appendChild(document.createTextNode(result[i].title))
.parentNode.parentNode // out of the textNode, out of the H1
.appendChild(document.createElement("section"))
.appendChild(document.createTextNode(result[i].content))
// now you have to go up, out of the article-text
// and up out of the Section, to get back to the Article
.parentNode.parentNode;
关于javascript - 使用 javascript 附加文章和部分,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/21493308/