无法调用 null 的 appendChild 方法答案

【问题标题】：Cannot call method appendChild of null无法调用 null 的 appendChild 方法
【发布时间】：2017-08-11 00:13:19
【问题描述】：

它发生在：

for(var i = 0; i<phoneNums.length; i++)
{
    var lines = document.createElement('tr');
    var number = document.createElement('td');
    number.innerHTML = phoneNums[i];
    var minutes = document.createElement('td');
    minutes.innerHTML = minutesUsed[i];
    var plan = document.createElement('td');
    plan.innerHTML = plans[i];
    var charges = document.createElement('td');
    charges.innerHTML = charge[i];
    document.getElementById('theTable').appendChild(lines);
    lines.appendChild(number);
    lines.appendChild(minutes);
    lines.appendChild(plan);
    lines.appendChild(charges);
}

具体在：

document.getElementById('theTable').appendChild(lines);

<table id = 'theTable'>
        </table>
        <script type = 'text/javascript'>
            populateTable();
        </script>

我正在尝试创建一个将tr 和td 以及值添加到表中的函数。

【问题讨论】：

文档中是否存在theTable html 元素？而且，您是否在页面加载完成后执行此脚本？
theTable 是我的表的 id，所有内容都被添加进去，脚本在加载时执行
尝试将脚本元素剪切/粘贴到 html 的末尾，如果仍然无法正常工作，则表示您可能有错字。
请贴出相关的HTML部分和上述JS的调用。
@Adi 请不要将用户引导到像 JSfiddle 这样的非现场工具。该问题需要包含一个完整的示例，并且不能是 JSFiddle 链接。

标签： javascript for-loop html-table appendchild

【解决方案1】：

您可能在文档中存在“theTable”之前运行此脚本。确保此脚本出现在您的表下方并带有id="theTable"，或者它在表存在后发生的事件处理程序中运行。

【讨论】：

【解决方案2】：

这意味着您的 DOM 中没有 id 为“theTable”的元素。在您的 html 中的某处，您应该有类似的内容：

<table id="theTable">...

或者，正如其他人也提到的那样，在您的脚本执行之前，此元素可能尚未加载到 DOM 中。

【讨论】：