错误“无法在generateTable上读取属性'appendChild'为null”

时间:2017-11-30 18:00:48

标签: javascript

有人可以为我的这个错误发光吗?正确引用了outputTable,并且我的数组countries的JS文件格式正确。

我估计我错误地追加,但我已尽力而为。

PS,如果你要进行投票,至少请告诉我将来如何改进我的问题。我找不到与我的问题相符的不同问题。

window.onload = generateTable();

function generateTable() {
    // get the reference for the body
    var outputTable = document.getElementById('outputTable');
    // revoke existing Body element
    if (outputTable) {
        outputTable.removeChild(outputTable);
    }
    // creates a <tbody> element
    var tableBody = document.createElement('tbody');
    // creating all table rows
    for (var i = 0; i < countries.length; i++) {
        // creates a table row
        var row = document.createElement('tr');
        // create table column for flag
        var colFlag = document.createElement('td');
        //create image element in flag column
        var flag = document.createElement('img');
        flag.src = 'flags/' + countries[i].Code.toLowerCase() + '.png';
        flag.alt = countries[i].Code;
        row.appendChild(colFlag);
        //append flag to flag column
        colFlag.appendChild(flag);
        // create table column for Code
        var colCode = document.createElement('td');
        //append code to code column
        colCode.appendChild(document.createTextNode(countries[i].Code));
        row.appendChild(colCode);
        // create table column for country //**ENGLISH */
        var colCountry = document.createElement('td');
        colCountry.appendChild(document.createTextNode(countries[i].Name.English));
        row.appendChild(colCountry);
        // create table column for continent
        var colCont = document.createElement('td');
        colCont.appendChild(document.createTextNode(countries[i].Continent));
        row.appendChild(colCont);
        // create table column for area
        var colArea = document.createElement('td');
        colArea.appendChild(document.createTextNode(countries[i].AreaInKm2));
        row.appendChild(colArea);
        // create table column for population
        var colPop = document.createElement('td');
        colPop.appendChild(document.createTextNode(countries[i].Population));
        row.appendChild(colPop);
        // create table column for capital of country
        var colCap = document.createElement('td');
        colCap.appendChild(document.createTextNode(countries[i].Capital));
        row.appendChild(colCap);
        // attach columns to row
        tableBody.appendChild(row);
        outputTable.appendChild(tableBody);
    }
    // add the row to the end of the table body
    document.body.appendChild(outputTable);
}

0 个答案:

没有答案