MkDocs（Material）配置表格

记录mkdocs中实现（优化）表格排序和搜索。原先采用官方文档提供的tablesort.js，后来自己该用datatables库，可是实现排序，分页和搜索。整体改动不大。

表格：排序和搜索¶

Material for Mkdocs 文档参考：

从文件导入表格 Import table from file: 插件mkdocs-table-reader-plugin
可排序表格 Sortable tables: 通过tablesort.js 【功能比较有限】

改进方案：改用datatables 库，需要依赖jquery。其中的i18n/zh.json文件是语言翻译。

docs/assets/js/datatables.js mkdocs.yml

JavaScript

$(document).ready(function () {
  const tables = document.querySelectorAll("article table:not([class])");
  tables.forEach(function (table) {
    $(table).DataTable({
      language: {
          url: '//cdn.datatables.net/plug-ins/2.0.2/i18n/zh.json',
      },
    })
  });
});

YAML

extra_javascript:
  - https://code.jquery.com/jquery-3.7.1.min.js
  - https://cdn.datatables.net/2.0.2/js/dataTables.min.js
  - https://cdn.datatables.net/plug-ins/2.0.2/i18n/zh.json
  - assets/js/datatables.js

extra_css:
  - https://cdn.datatables.net/2.0.2/css/dataTables.dataTables.min.css

MkDocs（Material）配置表格

表格：排序和搜索¶

评论