时间戳

首页 > 解决方案 > JavaScript - 从“for”循环中选择最后一项

javascript - JavaScript - 从“for”循环中选择最后一项

问题描述

假设我有一个包含三个元素的简单 HTML 标记和一个浏览所有元素的 javascript 循环。我需要做的是选择这些项目中的最后一项。

这堆代码将运行一个循环，选择所有具有类的元素some_div，并在其中粘贴一些文本......

如果我只想选择和更改列表中的最后一项怎么办？

有没有办法让我只从循环中选择最后一项，然后执行一些操作，比如向这个确切的元素添加一个特定的类？

var elements = document.getElementsByClassName('some_div');
for (var i=0; i<elements.length; i++) {

    elements[i].innerHTML = 'hello';
}
.some_div {
  height: 30px;
  width: 100px;
  border-bottom: solid 2px black;
}
<body>
 <div class="some_div"></div>
 <div class="some_div"></div>
 <div class="some_div"></div>
</body>

标签： javascripthtmlloops

解决方案

选择一个类的最后一个匹配项（例如，使用 CSS 选择器）很尴尬¹，但您可以轻松访问最后一个匹配项：

var elements = document.getElementsByClassName('some_div');
var last = elements[elements.length - 1];
if (last) {
    last.innerHTML = 'hello';
}

现场示例：

var elements = document.getElementsByClassName('some_div');
var last = elements[elements.length - 1];
if (last) {
    last.innerHTML = 'hello';
}
.some_div {
  height: 30px;
  width: 100px;
  border-bottom: solid 2px black;
}
<body>
 <div class="some_div"></div>
 <div class="some_div"></div>
 <div class="some_div"></div>
</body>

¹ （或不可能？:nth-last-of-type适用于元素类型，而不是类......）

推荐阅读