Internet
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>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Indirekt.com</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<div class="container">
<h1>ScoreBoard</h1>
<div class="title-box">
<p>Local Team</p>
<p id="elapsed">45'</p>
<p>Visitor Team</p>
</div>
<div class="title-box">
<div class="team">
<img id="homeLogo">
<p id="homeName">Team name</p>
</div>
<p id="goals">3 - 1</p>
<div class="team">
<img id="awayLogo">
<p id="awayName">Team name</p>
</div>
<hr>
<div id="matchTable" class="matches-table">
</div>
<script src="script.js"></script>
</body>
</html>
*{
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(){
"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);
})
}
Imam klijenta kojemu na jednom računaru u Chrome pregledniku djelomično ne radi JS u administraciji cms-a, no recimo radi u Firefoxu, također uredno radi u bilo kojem chrome pregledniku na nekom drugom računaru.
Vjerojatno je slučajno tipkao neku kraticu sa kojom je onemogućio izvršavanja JS, a ja nemam pojma što je mogao uraditi.
Probali smo sa brisanjem cachea, anonimnom modu itd, ali ne ide.
Ima li neko ideju?