Question

在javascript代码中，有人可以在下面的代码行中向我解释[0]的目的/含义吗？：var contactSpan = document.getElementsByClassName（“close”）[0];

我理解除了该部分之外所有代码的工作原理。为了清楚起见，我已经包含了链接到我的js代码部分的相关html代码。

我是网络编码的新手，所以如果可以避免，请不要使用过于技术性的语言。谢谢:)）

<div class="collapse navbar-collapse" id="bs-nav-demo">
          <ul class="nav navbar-nav navbar-right">
            <li><a href="#" id="contact">Contact</a></li>
          </ul>
        </div>

<div id="contactModal" class="modal">
  <div class="modal-content">
    <span class="close">&times;</span>
      <p>Contact details here</p>
  </div>
</div>

的javascript：

// Get the button that opens the modal
var contact = document.getElementById('contact');

// Get the modal
var contactModal = document.getElementById('contactModal');

// Get the <span> element that closes the modal
var contactSpan = document.getElementsByClassName("close")[0];

Answer 1

根据{{1}}形式的getElementsByClassName

plural会返回Elements个对象。类array-like可能有多个元素，因此它返回close对象的原因。

可以使用从array-like开始的项目索引访问

Array或array-like个对象项。

页面中只有一个元素，而0对象只包含一个项目，无论如何它会返回一个带有一个项目的array-like对象。

之后，您尝试使用array-like索引表示法获取第一个项目，该表示法是当前[]元素。

您的代码的最后一行等同于这两个语句

span

Answer 2

这就是为什么可能有多个元素包含相同的类，但ID是唯一的。因此，在圆顶中，您必须准确定义要访问的元素。就像有两个元素使用相同的类，如

<div class="sample">Bla Bla Bla</div>

并且

<div class="sample">No Bla Bla</div>

然后document.getElementsByClassName("sample")[0];是第一个拥有该类和

的元素

document.getElementsByClassName("sample")[1]; is the second element having that class.

需要解释getElementsByClassName（“className”）[0];

2 个答案: