Не удается создать таблицу с помощью JS

Question

Вот ошибка:

Uncaught TypeError: Cannot read property 'appendChild' of null

Пример кода:

function MakeTable(Matrix){ 
    var newElem = document.createElement('table'); 
    newElem.border = "1px"; 
    for(var j = 0; j < Matrix.length; j++) { 
     var newRow = newElem.insertRow(j); 
     for(var n = 0; n < Matrix[j].length; n++) { 
      var newCell = newRow.insertCell(n); 
      newCell.innerText = Matrix[j][n]; 
     } 
    } 

    document.getElementById('table1').appendChild(newElem); 
} 

Answer 1

До тех пор, пока у вас есть элемент с table1 ID в DOM и до тех пор, пока скрипт не запускается до загрузки этого элемента, он будет работать.

function MakeTable(Matrix){ 
 
    var newElem = document.createElement('table'); 
 
    newElem.border = "1px"; 
 
    for(var j = 0; j < Matrix.length; j++) { 
 
     var newRow = newElem.insertRow(j); 
 
     for(var n = 0; n < Matrix[j].length; n++) { 
 
      var newCell = newRow.insertCell(n); 
 
      newCell.textContent = Matrix[j][n]; 
 
     } 
 
    } 
 

 
    document.getElementById('table1').appendChild(newElem); 
 
} 
 

 
MakeTable([["this", "is"], ["my", "table"]]);

<div id=table1></div>

Я также изменил .innerText к .textContent поскольку это соответствуют стандартам способ установки текста.

Answer 2

Он вернулся, что я связан сценарий не в теле, а в голове)

Answer 3

При создании элемента, вы должны добавить его. Здесь:

document.body.appendChild(table) 

Изменение последней строки:

function MakeTable(Matrix){ 
    var newElem = document.createElement('table'); 
    newElem.border = "1px"; 
    for(var j = 0; j < Matrix.length; j++) { 
     var newRow = newElem.insertRow(j); 
     for(var n = 0; n < Matrix[j].length; n++) { 
      var newCell = newRow.insertCell(n); 
      newCell.innerText = Matrix[j][n]; 
     } 
    } 
    document.body.appendChild(newElem); 
} 

По соглашению вы написать первую букву имени функции в нижнем регистре (за исключением имени класса).

Demo