javascript
// script.js 中的代碼，用于實時更新比分// 創建 WebSocket 連接
let websocket = new WebSoc到的 JSON 數據解析為對象let data = JSON.parse(event.data);// 根據數據類型更新相應部分switch (data.type) {case "scoreboard":updateScoreboard(data.scores);break;case "fixtures":updateFixtures(data.fixtures);break;case "standings":updateStandings(data.standings);break;}
};// 當 WebSocket 連接關閉時
websocket.onclose = function() {console.log("WebSocket 已關閉。");
};// 更新比分表
function updateScoreboard(scores) {// 清空比分表document.getElementById("scoreboard").tBodies[0].innerHTML = "";// 遍歷比分數據并更新行for (let score of scores) {let row = document.createElement("tr");let team1Col = document.createElement("td");team1Col.innerText = score.team1;let scoreCol = document.createElement("td");scoreCol.innerText = score.score1 + " : " + score.score2;let team2Col = document.createElement("td");team2Col.innerText = score.team2;let timeCol = document.createElement("td");timeCol.innerText = score.time;row.appendChild(team1Col);row.appendChild(scoreCol);row.appendChild(team2Col);row.appendChild(timeCol);document.getElementById("scoreboard").tBodies[0].appendChild(row);}
}// 更新賽程表
function updateFixtures(fixtures) {// 清空賽程表document.getElementById("fixtures").tBodies[0].innerHTML = "";// 遍歷賽程數據并更新行for (let fixture of fixtures) {let row = document.createElement("tr");let dateCol = document.createElement("td");dateCol.innerText = fixture.date;let timeCol = document.createElement("td");timeCol.innerText = fixture.time;let team1Col = document.createElement("td");team1Col.innerText = fixture.team1;let team2Col = document.createElement("td");team2Col.innerText = fixture.team2;let scoreCol = document.createElement("td");scoreCol.innerText = fixture.score1 + " : " + fixture.score2;row.appendChild(dateCol);row.appendChild(timeCol);row.appendChild(team1Col);row.appendChild(team2Col);row.appendChild(scoreCol);document.getElementById("fixtures").tBodies[0].appendChild(row);}
}// 更新積分榜
function updateStandings(standings) {// 清空積分榜document.getElementById("standings").tBodies[0].innerHTML = "";// 遍歷積分榜數據并更新行for (let standing of standings) {let row = document.createElement("tr");let rankCol = document.createElement("td");rankCol.innerText = standing.rank;let teamCol = document.createElement("td");teamCol.innerText = standing.team;let pointsCol = document.createElement("td");pointsCol.innerText = standing.points;let winsCol = document.createElement("td");winsCol.innerText = standing.wins;let drawsCol = document.createElement("td");drawsCol.innerText = standing.draws;let lossesCol = document.createElement("td");lossesCol.innerText = standing.losses;let gfCol = document.createElement("td");gfCol.innerText = standing.goalsFor;let gaCol = document.createElement("td");gaCol.innerText = standing.goalsAgainst;let gdCol = document.createElement("td");gdCol.innerText = standing.goalDifference;row.appendChild(rankCol);row.appendChild(teamCol);row.appendChild(pointsCol);row.appendChild(winsCol);row.appendChild(drawsCol);row.appendChild(lossesCol);row.appendChild(gfCol);row.appendChild(gaCol);row.appendChild(gdCol);document.getElementById("standings").tBodies[0].appendChild(row);}
}