JavaScript - выберите последний элемент из цикла «для» - PullRequest
Новая
       7

JavaScript - выберите последний элемент из цикла «для»

0 голосов
/ 30 марта 2019

Допустим, у меня есть простая разметка 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>

Ответы [ 2 ]

2 голосов
/ 30 марта 2019

, поскольку elements является массивоподобным объектом, вы можете легко проиндексировать последний элемент 

const elements = document.getElementsByClassName('some_div');
if(elements.length > 0){
     const lastElement = elements[elements.length-1]
}
2 голосов
/ 30 марта 2019

Выбор последнего соответствия для класса (например, с помощью селектора CSS) неудобен¹, но вы можете легко получить доступ к последнему совпадению: 

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

Live Пример: 

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 относится к типу элемента, а не к классу ...)

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...