使用innerHtml无法向表格表头插入指定文本的技术问题

你的代码逻辑没问题，卡壳的原因就是一个大小写拼写错误——把innerHTML写成了innerHtml（JavaScript是区分大小写的语言，属性名里的H必须大写）。

修正后的完整代码如下：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Stack Overflow Don't Judge Me!</title>
</head>
<body>
    <table id="table1">

    </table>
    <script>
        function writeHeaderToTable() {
            var tsTable = document.querySelector("#table1");    //找到id为table1的表格
            var tsHeader = tsTable.createTHead();               //为表格创建表头
            var tsHeaderRow = tsHeader.insertRow(0);            //在表头插入一行
            var tsCell = tsHeaderRow.insertCell(0);             //在该行插入一个单元格
            tsCell.innerHTML = "<b>This is a header</b>";       //给单元格插入带格式的文本
        }
        writeHeaderToTable();
    </script>
</body>
</html>

如果只是需要插入纯文本，也可以用tsCell.textContent = "This is a header";，这个属性不需要处理HTML标签，更适合纯文本场景。

内容的提问来源于stack exchange，提问作者Gabriel Pierce