[英]javascript data not appending to html webpage?
I have this simple code with 5 paramaters taken from an API that logs data:我有这个简单的代码,其中包含来自记录数据的 API 的 5 个参数:
for (i = 0; i < arr.length-1; i++) {
console.log('For Calls')
console.log(arr[i].league.name)
console.log(arr[i].teams.home.name, arr[i].goals.home)
console.log(arr[i].teams.away.name, arr[i].goals.away)
}
it logs this data to the console (2 sets of data shown): Logged Data它将这些数据记录到控制台(显示了 2 组数据): Logged Data
The issue I am having is trying to display this looped content to the website, I haven't even been able to get it on the screen so far using the .append methods.我遇到的问题是尝试将此循环内容显示到网站,到目前为止,我什至无法使用 .append 方法将其显示在屏幕上。
Here is the format I am trying to create:这是我要创建的格式:
<div class="parentDiv">
<div class="league">Data goes here</div>
<div class="team1">Data goes here</div>
<div class="score1">Data goes here</div>
<div class="team2">Data goes here</div>
<div class="score2">Data goes here</div>
</div>
I am aware I can give each div a class and append that way but I need this in a loop so those methods do not work for me in this circumstance.我知道我可以给每个 div 一个类并以这种方式附加,但我需要循环使用,所以这些方法在这种情况下对我不起作用。
Any Tips are Appreciated.感谢任何提示。
My current attempt:我目前的尝试:
for (i = 0; i < filtered.length-1; i++) {
let parent = document.createElement("div")
parent.className = 'parentDiv'
let homeTeamName = document.createElement("div")
homeTeamName.className = 'league'
homeTeamName.innerHTML = filtered[i].league.name
parent.appendChild(homeTeamName)
let homeTeamScore = document.createElement("div")
homeTeamScore.className = 'team1'
homeTeamScore.innerHTML = filtered[i].teams.home.name
parent.appendChild(homeTeamScore)
let awayTeamName = document.createElement("div")
awayTeamName.className = 'score1'
awayTeamName.innerHTML = filtered[i].teams.home.name
parent.appendChild(awayTeamName)
let awayTeamScore = document.createElement("div")
awayTeamScore.className = 'team2'
awayTeamScore.innerHTML = filtered[i].teams.home.name
parent.appendChild(awayTeamScore)
}
It prints nothing to the dom, blank page.它不向 dom 打印任何内容,空白页。 You can use the web console at footballify.net/test
您可以在 footballify.net/test 上使用 Web 控制台
You never Attach the "parent" variable to your body您永远不会将“父”变量附加到您的身体
Try:尝试:
document.body.append(parent) at the end
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.