javascript - 类型错误 : Cannot set property 'textContent' of null

Question

这个问题已经有答案了:

Why does jQuery or a DOM method such as getElementById not find the element? (7 个回答)

已关闭 4 年前。

目前此代码存在一段时间的问题，无论我检查多少次，我都会不断收到错误。

错误都是一样的:

类型错误:无法将属性“textContent”设置为 null

当我使用 querySelector 或当我使用 getElementById 时。我不知道这是我的 HTML 还是我输入错误。

我感到困惑的是它在这里工作......但是当我使用我的 VSC(Visual Studio 代码)并在 chrome 上运行它时，会弹出错误，错误显示。是我的代码还是 VSC？

var dice = Math.floor(Math.random()* 6) +1;

document.querySelector("#current-0").textContent = dice;

<div class="wrapper clear-fix">
    <div class="player1-panel active">
        <div class="player-name" id="player-1">Player 1</div>
        <div class="player-score" id="score-1">100</div>
        <div class="player-current-box">
            <div class="player-current-label">Current</div>
            <div class="player-current-score" id="current-0">11</div>
         </div>
    </div>

        <div class="player2-panel">
            <div class="player-name" id="player-2">Player 2</div>
            <div class="player-score" id="score-2">00</div>

            <div class="player-current-box">
                <div class="player-current-label">Current</div>
                <div class="player-current-score" id="currentScore-2">00</div>
            </div>
        </div>
        <button class="btn-rules"><i class="material-icons">
                help</i>Rules</button>
        <button class="btn-newGame"><i class="material-icons">
                add_circle_outline
            </i>New Game</button>
        <button class="btn-rollDice"><i class="material-icons">
                autorenew</i>Roll dice</button>
        <button class="btn-hold"><i class="material-icons">
                play_for_work</i>Hold</button>

        <input type="text" placeholder="Goal" class="finalScore">
        <img src="images/dice5.png" atl="dice" class="dice" id="dice1">
        <img src="images/dice5.png" atl="dice" class="dice" id="dice2">

</div>

Answer 1

我认为，您有一些东西最初调用它并获取空值，然后稍后解析。所以试试这个...

var element = document.querySelector("#current-0")
if (element) {
    element.textContent = dice
}