TypeError: textContent を使用してプロパティ 'textContent' を null に設定できません

Question

let firstCard = 10;
let secondCard = 4;
let sum = firstCard + secondCard;
let hasBlackJack = false;
let isAlive = true;
let message = ""
let messageEl = document.getElementById("message-el");
let sumEl = document.querySelector("#sum-el");
let cardsEl = document.getElementById("cards-el");
messageEl.textContent = "Do you want to draw a new card?";

function startGame() {
    cardsEl.textContent = "Cards : " + firstCard + " " + secondCard;
    sumEl.textContent = "Sum :" + sum;
    if (sum <= 20) {
        message = "Do you want to draw a new card?";
    } else if (sum === 21) {
        message = "You have got blackjack!";
        hasBlackJack = ture;
    } else {
        message = "You are out of the game!";
        isAlive = false;
    }
    messageEl.textContent = message;
}

Answer 1

この行:

リーリー

要素は返されません。

これは、コードの実行時に要素が DOM に存在しないためです。これは、その ID を持つ要素がないか、要素を解析した後に実行するコードを DOM に移動する必要があることが考えられます。