У меня есть такой код для getElementsByClassName








Но это просто не работает. Он работает только тогда, когда я вручную подставляю число вместо переменной

document.getElementsByClassName("lala")[2].innerHTML = "etc";

Мне нужно вставить его после последнего класса, который генерируется динамически, поэтому я не знаю точного числа. Что я делаю не так?

user4817258

Ответов: 4

Ответы (4)

Я немного запутался в вашем вопросе.

Я могу понять вопрос двумя способами:

Путь 1:

Вы хотите вставить последний тег li класса lala с содержимым "etc".

Вы ошибаетесь в строке:

var num = document.getElementsByClassName('lala').length+1;

Это должно быть:

var num = document.getElementsByClassName('lala').length-1;

И вы должны установить переменную, содержащую селектор:

var selectors = document.getElementsByClassName ('lala');
var num = selectors.length - 1;
selectors[num].innerHTML = "etc";

Способ 2:

Вы хотите автоматически создать новый тег li класса lala и его содержимое "etc".

Код для этого выглядит следующим образом:

функция myFunction () {
    var selectors = document.getElementsByClassName('lala');
    var num = selectors.length - 1;
    var newDiv = document.createElement('div');
    newDiv.classList.add('lala');
    newDiv.innerHTML = "etc";
    selectors[0].parentNode.insertBefore(newDiv, selectors[num].nextSibling);
}

Тогда индекс массива начинается с 0. Тогда, если у вас есть 3 элемента, это будет индекс: 0 1 2

А document.getElementsByClassName('lala').length возвращает количество элементов : 3. Тогда вам следует обновить:

var last_index = document.getElementsByClassName('lala').length - 1;

Попробуйте это

document.getElementsByClassName("lala")[document.getElementsByClassName("lala").length - 2].innerHTML = "etc";

Вы можете сделать следующее:

function myFunction() {
    var lalaElementsLength = document.getElementsByClassName('lala').length;
    document.getElementsByClassName("lala")[lalaElementsLength - 1].innerHTML = "etc";
}

Помещая [lalaElementsLength - 1] в качестве номера индекса, вы гарантируете, что всегда будете получать последний элемент в списке.

Вы даже можете сократить код, опустив второй запрос для элементов lala с помощью следующего кода:

function myFunction() {
    var lalaElements = document.getElementsByClassName('lala');
    lalaElements[lalaElements.length - 1].innerHTML = "etc";
}

2022 WebDevInsider