Почему он говорит «TypeError: Не удается прочитать свойство« appendChild »из неопределенного», когда оно определено?

Question

Я определил переменную и хочу добавить к ней дочерний элемент, но по какой-то причине я получаю сообщение об ошибке, в котором говорится, что значение не определено, поэтому я не могу использовать appendChild ().

Поскольку я обнаружил, что некоторые источники говорят, что это потому, что ресурсы еще не загружены, я попытался использовать window.onload, но я действительно хочу, чтобы моя функция запускалась при нажатии кнопки.

  document.getElementById("calc").onclick = function calculate(){
        var rate = +document.getElementById("rate").value/100;
        var years = +document.getElementById("years").value;
        var principal = +document.getElementById("principal").value;

        var i = 0;

        while(i < years){
          var afterRate = principal * rate;
          var totalAmount = principal += afterRate;
          var interestValue = document.createElement("div");
          var division = document.getElementById('divis');

          interestValue.style.color = "white";
          interestValue.style.fontFamily = "futura";
          interestValue.innerHTML = totalAmount;
          document.division.appendChild(interestValue);

          var lastButton = document.getElementById("last");
          var clearButton = document.getElementById("clear");
          var roundButton = document.getElementById("round");

          i++
        }
    }

Я подумал, что InterestValue в моей функции будет добавлено к определенному мной div, но вместо этого я получил сообщение 'TypeError: Невозможно прочитать свойство' appendChild 'из undefined.'

Answer 1

Публикация ответа для этого, так же, как объяснил @Jaromanda X в комментарии.

  document.getElementById("calc").onclick = function calculate(){
    var rate = +document.getElementById("rate").value/100;
    var years = +document.getElementById("years").value;
    var principal = +document.getElementById("principal").value;

    var i = 0;

    while(i < years){
      var afterRate = principal * rate;
      var totalAmount = principal += afterRate;
      var interestValue = document.createElement("div");
      var division = document.getElementById('divis');

      interestValue.style.color = "white";
      interestValue.style.fontFamily = "futura";
      interestValue.innerHTML = totalAmount;
      division.appendChild(interestValue); // Removed document

      var lastButton = document.getElementById("last");
      var clearButton = document.getElementById("clear");
      var roundButton = document.getElementById("round");

      i++
    }
}

document.division не определено нигде в вашем коде - возможно, вы означало division.appendChild(interestValue); не document.division.appendChild(interestValue);