如何按类名正确定位？

4回答

智慧大石

我要补充一点，如果选择器仅由一个元素使用，最好分配一个 id 并使用 getElementById。let boxOne = document.getElementById("one");let allBoxes = document.getElementsByClassName("square");boxOne.onclick = function() {  alert("Clicked via ID");}const arr = [1, 2, 3];arr.forEach(i => {  allBoxes[i].onclick = function() {    alert("Clicked via Class");  }}).square {  width: 100px;  height: 100px;  background: blue;  margin: 20px;  font-size: 50px;  color: white;  text-align: center;  display: flex;  flex-direction: column;  justify-content: center;  cursor: pointer;}<body>  <div class="container">    <div class="square" id="one">      1    </div>    <div class="square" id="two">      2    </div>    <div class="square" id="three">      3    </div>    <div class="square" id="four">      4    </div>  </div></body>

PIPIONE

文档。getElementsByClassName 返回具有该类名的元素数组（不带点）querySelector 用于 css 选择器（例如“.one”、“div.one”）querySelectorAll 像 2. 但返回数组

料青山看我应如是

let boxOne = document.getElementsByClassName("one")[0]boxOne.onclick = function() {    alert("Clicked!")}div {  width: 100px;  height: 100px;  margin: 30px;  background: blue}<body>    <div class="container">        <div class="one">        </div>        <div class="two">        </div>        <div class="three">        </div>        <div class="four">        </div>    </div>    <script src="script.js"></script></body>

扬帆大鱼

使用此行：document.getElementsByClassName(".one")[0] 您已经针对 div，因此将其更改 boxOne[0].onclick = 为： boxOne.onclick =