Google Chrome javascript problem (Internet) @ Bug.hr Forum

jarpe94

9 godina

neaktivan

offline

sri 8.9.2021 15:04

Odgovori Citiraj

Google Chrome javascript problem

pozz! Trebala bi mi pomoć

razvijam livescore aplikaciju u html/css i js tehnologijama.

javio mi se error u chrome konzoli

Uncaught ReferenceError: matchTile is not defined

<!DOCTYPE html>

<head>

<title>Indirekt.com</title>

</head>

<body>

<h1>ScoreBoard</h1>

<p>Local Team</p>

<p>Visitor Team</p>

</div>

</div>

</div>

<hr>

</div>

</body>

</html>

@import url('https://fonts.googleapis.com/css2?family=Roboto');

margin: 0;

padding: 0;

outline: 0;

font-family: 'Roboto',sans-serif;

text-align:center;

}

body{

height: 100vh;

background-image: url(background.jpg);

background-size: cover;

background-repeat: no-repeat;

background-position: center;

}

.container{

position: absolute;

padding: 16px;

top: 50%;

left: 50%;

transform: translate(-50%,-50%);

width: 50%;

background-color: #fafafa;

border-radius: 8px;

text-transform: uppercase;

text-align: center;

}

.title-box{

margin: 25px 0;

display: flex;

flex-direction: row;

flex-wrap: nowrap;

justify-content: space-around;

align-items: center;

width: 100%;

font-size: 1.5rem;

}

.title-box #goals{

font-size:1.8rem;

}

.team{

width: 100px;

}

.team img{

height: 54px;

width: 54px;

}

.matches table{

margin-top: 50px;

display: flex;

flex-direction: column;

}

.match-tile{

position: relative;

left: 50%;

transform: translate(-50%);

margin: 10px 0;

display: flex;

flex-direction: row;

justify-content: space-around;

align-items: center;

}

.match-tile img{

width: 52px;

height: 52px;

}

.match-tile p{

font-size: 1.2rem;

}

.match-tile #goals{

font-size: 1.8rem;

}

.match-tile .team{

width: 100px;

}

var elapsedTime= document.querySelector("#elapsed");

var homeTeamLogo= document.querySelector("#homeLogo");

var homeTeamName= document.querySelector("#homeName");

var awayTeamLogo= document.querySelector("#awayLogo");

var awayTeamName= document.querySelector("#awayName");

var lastMatchGoals= document.querySelector("#goals");

var matchTable= document.querySelector("#matchTable");

var matchTable = document.querySelector("#matchTable");

function addMatchTile(data){

var matchTile = document.createElement('div');

matchTile.classList.add("match-tile");

var homeTeam = document.createElement('div');

homeTeam.classList.add("team");

var homeTileLogo = document.createElement('img');

var homeTileName = document.createElement('p');

homeTileTeamName.innerHTML = data ['team']['home']['name']

homeTileTeamLogo.src=data['teams']['home']['logo'];

homeTeam.appendChild(homeTileTeamLogo);

homeTeam.appendChild(homeTileTeamName);

var awayTeam = document.createElement('div');

awayTeam.classList.add("team");

var awayTileTeamName = document.createElement('p');

awayTileTeamName.innerHTML = data['teams']['away']['name'];

var awayTileTeamLogo = document.createElement['img'];

awayTileTeamLogo.src=data['teams']['away']['logo'];

awayTeam.appendChild(awayTileTeamLogo);

awayTeam.appendChild(awayTileTeamName);

var score = document.createElement('p');

score.innerHTML = data ['goals']['home'] + " : " + data['goals']['away'];

}

matchTile.appendChild(homeTeam);

matchTile.appendChild(score);

matchTile.appendChild(awayTeam);

matchTable.appendChild(matchTable);

function getData(){

fetch("https://api-football-beta.p.rapidapi.com/countries", {

"method": "GET",

"headers": {

"x-rapidapi-host": "api-football-beta.p.rapidapi.com",

"x-rapidapi-key": "ccbf0095e2msh9bcd55ca074ac9bp15dec4jsn501bd3fc7336"

}

})

.then(response => response.json().then(data =>{

var matchesList = data ['response'];

var fixture = matchesList[0]['fixture'];

var goals = matchesList[0]['goals'];

var teams = matchesList[0]['teams'];

console.log(matchesList.length);

elapsedTime.innerHTML= fixture['status']['elapsed'] + "'";

homeTeamLogo.src = teams ['home']['logo'];

homeTeamName.innerHTML = teams ['home']['name'];

awayTeamLogo.src = teams ['away']['logo'];

awayTeamLogo.innerHTML = teams ['away']['name'];

lastMatchGoals.innerHTML = goals['home'] + " - " + goals['away'];

for(var i = 5; i<matchesList.length;i++){

addMatchTile(matchesList[i]);

}

}))

.catch(err => {

console.log(err);

})

}

trajni link

0 0 hvala 0