无法读取 null 的属性 'insertBefore' - handsontable.full.js:3714

Question

我尝试运行快速入门中提到的示例 link(Quick Start)。通过 Git 集线器下载了所有文件。尝试运行快速入门中提到的示例时出现以下错误 "cannot read property 'insertBefore' of null - handsontable.full.js:3714"。请帮助我运行设置基本示例。

使用的版本 - v0.16.1

代码：

<!DOCTYPE html>
<html>
<head>
     <script src="dist/handsontable.full.js"></script>
     <link rel="stylesheet" media="screen" href="dist/handsontable.full.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.3/jquery.min.js"></script>

<script>
    var data = [
    ["", "Ford", "Volvo", "Toyota", "Honda"],
    ["2014", 10, 11, 12, 13],
    ["2015", 20, 11, 14, 13],
    ["2016", 30, 15, 12, 13]
    ];

  var container = document.getElementById('example');
  var hot = new Handsontable(container, {
            data: data,
            minSpareRows: 1,
            rowHeaders: true,
            colHeaders: true,
            contextMenu: true
          });

</script>
<style>
body {
background-color: white;
margin: 20px;
}

h2 {
  margin: 20px 0;
}
</style>
</head>

 <body>


    <h2>Default Handsontable Demo</h2>

     <div id="example"></div>

 </body>

Answer 1

尝试将 3 个脚本节点放在 body 而不是头部。感觉你加载模块的方式有问题。

Answer 2

我遇到了同样的错误，至少对我来说，错误的发生是因为我使用了不存在的元素 ID。

这一行：

var container = document.getElementById("example");

确保您的 div ID 具有相同的名称。在这种情况下，它是 "example":

<div id="example"></div>

加载Handsontable时如果容器是undefined，会显示此错误信息。

Answer 3

有时甚至 space 导致此错误。

// example 
var container = document.querySelector('header .container');
//in this i made mistake of space between header and container class so  he can't find and show me error
var container = document.querySelector('header .container');

无法读取 null 的 属性 'insertBefore' - handsontable.full.js:3714

cannot read property 'insertBefore' of null - handsontable.full.js:3714

html

javascript

handsontable

无法读取 null 的属性 'insertBefore' - handsontable.full.js:3714