insertAfter JavaScript

150

28 декабря 2018, 03:40

Такой вопрос у меня сегодня появился.

У меня есть функция, которая создает строки в таблице, используя цикл. То-есть в функцию приходит количество строк, и функция циклом создает строки. Но эти строки нужно добавить, так же по очереди уже в существующую таблицу, в середину. Вот код функции.

function genTr(count) { 
    for (var i = 0; i < count; i++) {
        var tr = document.createElement('tr');
        tr.setAttribute('id', 'tr' + i + '_');
        if (i == 0) {
            $('#tr' + i + '_').insertAfter("#oldtr");
        } else {
            $('#tr' + i + '_').insertAfter('#tr' + (i-1) + '_');
        }
    }

id - #oldtr - строка в таблице, после которой нужно цыклом вставлять строки.

В инспекторе ничего нет, строки не вставляються! Может есть решение? Спасибо большое!

Answer 1

Проблема заключается в том, что при получении селектора в виде строки, jQuery ищет элементы, которые уже есть на странице.

Так как создаваемый элемент с id='tr' + i + '_' еще не добавлен на страницу. селектор $('#tr' + i + '_') ничего не найдет, и следовательно ничего никуда не добавит.

Для решения, достаточно заменить строку, на сам созданный элемент:

if (i == 0) {
    $(tr).insertAfter("#oldtr");
} else {
    $(tr).insertAfter('#tr' + (i-1) + '_');
}

Answer 2

const genTr = count => {
    let newTrs = []
    let elAfter = document.getElementById('oldTr')
    for (let i = 0; i < count; i++) {
      let nt = document.createElement('tr');
      nt.setAttribute('id', `id-${i}`)
      newTrs.push(nt)
    }
    newTrs.forEach((el) => {
      elAfter.after(el)
      elAfter = el
    })
  }

ПОСЛЕДНИЕ ВОПРОСЫ

Все вопросы

ТОП-10

Все популярные вопросы

Sublime Text 3. Не получается закомментировать код

В Sublime Text 3 не могу закомментировать кодПробую CTRL + / не реагирует

193

HTML

SPA с 2 страницами

170

HTML

Обратный отсчет таймера от переменной в миллисекундах JS на лету

На странице сайта выводится обратный таймер ЧЧ:ММ:ССИз этих данных я отсекаю только СС

130

jQuery

Помогите с JQuery

я не могу сделать так, чтобы при нажатии на блок, цвет его краёв менялся на другой цвет, используяanimate(), ничего не выходит! (2 строка с данного...

146