Как исправить "Не удается прочитать свойство 'createDocumentFragment'"

Question

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

Невозможно прочитать свойство 'createDocumentFragment' из неопределенного - jquery-3.3.1.min.js: 2

Вот мой код:

   $.ajax({
        url: '/ajax/getPvaSession.php'
    }).done(function (data) {
        let content = data['content'];
        console.log(content);
        $('body').append('<table id="table"></table>');
        for (let i=0;i<content[i].length;++i) {
            $('table').append('<tr id="' + i + '"></tr>');
            for (let j=0; j<content.length; ++j){
                $(i).append('<td id="' + i + '_' + j + '">' + content[i][j] + '</td>')
            }
        }
    })

Мой console.log показывает это (это простая матрица):

(8) [Array(31), Array(31), Array(31), Array(31), Array(31), Array(31), Array(31), Array(31)]
0: (31) ["Projet", "1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12", "13", "14", "15", "16", "17", "18", "19", "20", "21", "22", "23", "24", "25", "26", "27", "28", "29", "30"]
1: (31) ["Administrateur Réseau", "1", "1", "1", "1", "1", "", "", "1", "1", "0.5", "", "", "", "", "1", "1", "1", "1", "1", "", "", "", "1", "1", "1", "1", "", "", "1", "1"]
2: (31) ["Intercontrat", "", "", "", "", "", "", "", "", "", "0.5", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""]
3: (31) ["Formation", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""]
4: (31) ["Congés payés", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""]
5: (31) ["Congés sans solde", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""]
6: (31) ["Incentive", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""]
7: (31) ["Maladie", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", "", ""]
length: 8

Я читал в Интернете, что многие люди сталкивались с этой ошибкой, используя this неправильно, но я нигде не использую ее.

Не могли бы вы уточнить это? И объясните ошибку, если это возможно, чтобы я не сделал ошибку в следующий раз. Спасибо!

Answer 1

Вы должны пройти через внешний массив как content.length, а не content[0].length. и используйте content[0].length во внутреннем массиве.

Как:

var content = [["Administrateur Réseau","1","1","1","1","1","","","1","1","0.5","","","","","1","1","1","1","1","","","","1","1","1","1","","","1","1"],["Intercontrat","","","","","","","","","","0.5","","","","","","","","","","","","","","","","","","","",""],["Formation","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""],["Congés payés","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""],["Congés sans solde","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""],["Incentive","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""],["Maladie","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""]]

$('body').append('<table id="table"></table>');
for (let i = 0; i < content.length; ++i) {                       //Remove the [i]. This will loop thru all contents   
  var tr = $('<tr id="' + i + '"></tr>');                        //Create a tr element and store on a variable
  $('table').append(tr);
  for (let j = 0; j < content[i].length; ++j) {                  //Add the [i]. This will loop thru the inner array
    tr.append('<td id="' + i + '_' + j + '">' + content[i][j] + '</td>'); //Append the td string on tr variable
  }
}

td {
  border: 1px solid #dddddd;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

Другой вариант - создать строку HTML. И использовать это, чтобы добавить в тело

var content = [["Administrateur Réseau","1","1","1","1","1","","","1","1","0.5","","","","","1","1","1","1","1","","","","1","1","1","1","","","1","1"],["Intercontrat","","","","","","","","","","0.5","","","","","","","","","","","","","","","","","","","",""],["Formation","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""],["Congés payés","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""],["Congés sans solde","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""],["Incentive","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""],["Maladie","","","","","","","","","","","","","","","","","","","","","","","","","","","","","",""]]


var html = "";

html += "<table>";
for (let i = 0; i < content.length; ++i) {
  html += "<tr id='" + i + "'>";
  for (let j = 0; j < content[i].length; ++j) {
    html += '<td id="' + i + '_' + j + '">' + content[i][j] + '</td>';
  }
  html += "</tr>";
}
html += "</table>";

$('body').append(html);

td {
  border: 1px solid #dddddd;
}

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>