JavaScript INDEX_SIZE_ERR: исключение DOM 1

Question

В следующем коде я получаю указанную ошибку и не совсем уверен, почему.Я рассмотрел другие темы здесь, но, похоже, не могу найти ошибку.

Цель сценария - сохранить массивы строк в локальном хранилище.Эти строковые массивы затем загружаются в таблицу.

Следующая функция получает значения из полей моей веб-формы: -

function saveContact() {
        var contact = [nameDOM.value, addDOM.value, townDOM.value, postalDOM.value, mobDOM.value];
        localStorage.setItem(window.localStorage.length, contact);
        showContacts();
  }

Эта функция помещает эту информацию в таблицу: -

 function showContacts() {
        for(i=0; i<window.localStorage.length; i++) {
          var contactRow = cTableDOM.insertRow(i);
          var contactCell = contactRow.insertCell(i);
          var text = document.createTextNode(localStorage.getItem(i));
          contactCell.appendChild(text);
        }
  }

Я получаю такое поведение;когда я пытаюсь ввести разные «контакты» в мою таблицу, первый «контакт» повторяется вместо последних «контактов».

Answer 1

Проблема в том, что вы создаете новую строку и вызываете insertCell(2). Потому что это больше, чем число, которое вы получаете INDEX_SIZE_ERR.

С Mozilla (выделение добавлено):

Если индекс равен -1 или равен номеру ячейки, ячейка добавляется как последняя ячейка в строке. Если индекс опущен или превышает количество строк, то возникнет ошибка.

Вы также можете просто позвонить appendChild на только что созданном td.

var contactCell = contactRow.appendChild(document.createElement("td"));