想要更改div.main1中的文本，但内部文本不起作用

问题描述

想要更改div.main1中的文本，但innerText不起作用。尽管在控制台中它给了我随机数，但我仍然无法更改div.main1中的内部文本

enter code here


<HTML>
<div class="container">
      <h3 class="text">Good Luck!</h3>
      <div class="numbers">
        <div class="number-main">
          <div class="main main1">0</div>
          <div class="main main2">0</div>
          <div class="main main3">0</div>
          <div class="main main4">0</div>
          <div class="main main5">0</div>
        </div>
        <div class="number-secondary">
          <div class="secondary">0</div>
          <div class="secondary">0</div>
        </div>
      </div>
    </div>

</html>

enter code here


<script>
    const main1 = document.getElementsByClassName("main1");

   function randomNumber() {
      return Math.floor(Math.random() * 50);
    }

   main1.innerText = randomNumber();
</script>

解决方法

getElementsByClassName返回一个列表。您需要添加ID以选择特定的DOM，或使用其索引：

main1[0].innerText = randomNumber(); <- the first main1 it finds

document.getElementsByClassName返回元素的集合，而不是单个元素。即使仅返回一个元素，它仍将作为一个集合返回。

您需要像使用数组一样使用它并获取它返回的第一个元素

const main1 = document.getElementsByClassName("main1")[0];

function randomNumber() {
    return Math.floor(Math.random() * 50);
}

main1.innerText = randomNumber();

javascript

想要更改div.main1中的文本，但内部文本不起作用

问题描述

解决方法

相关问答