简单的 DataTables 示例初始化答案

【问题标题】：Simple DataTables example initialization简单的 DataTables 示例初始化
【发布时间】：2015-12-02 20:58:34
【问题描述】：

我有一个 Python 编写的应用程序，它正在为报告生成 HTML 文件，我希望让一些输出看起来更好，我正在尝试使用 DataTables。

在测试中，我什至无法让一个简单的 DataTables 示例正常工作，我认为这只是由于我对 CSS/Javascript/Web 设计整体缺乏了解。出于示例的目的，我有一个非常简单的 HTML 表，我只想使用本地 DataTables 文件。

我已经完成了本地文件的推荐设置，可以在此处找到：https://datatables.net/download/

将大多数选项保留为默认值，但根据需要选择包含 JQuery。我下载了提供的包并按照说明解压，留下的目录结构如下：

- root
    - test.html
    - DataTables\
        - DataTables-1.10.10
            - css\
                - ...
            - images\
                - ...
            - js\
                - ...
        - datatables.css
        - datatables.js
        - datatables.min.css
        - datatables.min.js

这里是 test.html：

<html>
<head>
<link rel="stylesheet" type="text/css" href="/DataTables/datatables.css">

<script type="text/javascript" charset="utf8" src="/DataTables/datatables.js"></script>

    <script type="text/javascript">


$(document).ready(function() {
    $('#example').DataTable();
} );


    </script>
</head>
<body>
<table id="example" class="display" cellspacing="0" width="100%">
    <thead>
        <tr>
            <th>Name</th>
            <th>Position</th>
        </tr>
    </thead>
    <tbody>
        <tr>
            <td>Tiger Nixon</td>
            <td>System Architect</td>
        </tr>
        <tr>
            <td>Garrett Winters</td>
            <td>Accountant</td>
        </tr>
    </tbody>
</table>
</body>
</html>

我认为我遗漏了一些明显的东西，但我认为这会起作用。有什么问题？提前感谢您的任何建议！

【问题讨论】：

标签： html datatables

【解决方案1】：

jQuery DataTables 是一个 jQuery 插件，因此在包含 jQuery DataTables 之前需要先包含 jQuery，如下所示：

<script type="text/javascript" src="//code.jquery.com/jquery-1.11.3.min.js"></script>
<script type="text/javascript" charset="utf8" src="/DataTables/datatables.js"></script>

【讨论】：

感谢您的回复！我也添加了 JQuery 包含，但该表仍显示为常规格式的 HTML 表。还有什么我可能会丢失的吗？非常感谢您的帮助！
@DJMcCarthy12，在浏览器中按F12，转到Console，看看有没有错误。