Javascript 未捕获类型错误：对象[对象对象]没有方法'；getElementsByTagName'；在高图表中

我试图显示一个简单的图表，并导入以下文件（我使用的是Highcharts 3.0.7）：

我正试图根据一张表格画一张图表。这是表格：

<table id="datatable">
    <thead>
        <tr>
            <th></th>
            <th>Jane</th>
            <th>John</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <th>Apples</th>
            <td>3</td>
            <td>4</td>
        </tr>
        <tr>
            <th>Pears</th>
            <td>2</td>
            <td>0</td>
        </tr>
        <tr>
            <th>Plums</th>
            <td>5</td>
            <td>11</td>
        </tr>
        <tr>
            <th>Bananas</th>
            <td>1</td>
            <td>1</td>
        </tr>
        <tr>
            <th>Oranges</th>
            <td>2</td>
            <td>4</td>
        </tr>
    </tbody>
</table>

如您所见，它与此处的示例几乎相同：

但是，我从

data.js

中得到以下错误：

Uncaught TypeError: Object [object Object] has no method 'getElementsByTagName'

不显示任何栏，但绘制画布。我怎样才能解决这个问题？谢谢

从

data: {
  table: $("#datatable")
},

到

---

将代码更改为，

    data: {
        table: $('#datatable')[0]
    },

---

可能要等待文档加载？我已经等待了，但没有任何更改。否，我的意思是将代码包装在

document.onload=function（）中。

它包装在jQuery（document）.ready语句中

data: {
  table: $("#datatable")
},

data: {
  table: document.getElementById('datatable')
},

    data: {
        table: $('#datatable')[0]
    },