CETEIcean 使用教程

2025-04-16 10:44:28作者：滑思眉Philip

1. 项目目录结构及介绍

CETEIcean 是一个允许在网页浏览器中显示未经修改的 TEI (Text Encoding Initiative) 文档的 JavaScript 库。项目目录结构如下：

CETEIcean/
├── src/                        # 源代码目录
│   ├── CETEI.js                # 核心JavaScript文件
│   ├── ...                     # 其他源代码文件
├── test/                       # 测试目录
│   ├── simpleTest.html         # 简单使用示例
│   ├── ...                     # 其他测试文件
├── tutorial_en/                # 英文教程
│   ├── ...
├── tutorial_es/                # 西班牙文教程
│   ├── ...
├── tutorial_ja/                # 日文教程
│   ├── ...
├── xslt/                       # XSLT转换文件
├── .gitignore                  # Git忽略文件
├── .travis.yml                 # Travis CI配置文件
├── LICENSE.md                  # 许可证文件
├── README.md                   # 项目说明文件
├── package-lock.json           # 包锁定文件
├── package.json                # 包管理文件
├── rollup.config.js            # Rollup配置文件

src/: 包含 CETEIcean 的 JavaScript 源文件。
test/: 包含用于展示如何使用 CETEIcean 的 HTML 文件。
tutorial_*: 包含不同语言的教程文件。
xslt/: 包含 XSLT 文件，用于可能的服务器端转换。
.gitignore: 定义了 Git 应该忽略的文件和目录。
.travis.yml: 用于配置持续集成服务 Travis CI。
LICENSE.md: 包含项目的许可证信息。
README.md: 提供项目的基本信息和如何使用它。
package-lock.json 和 package.json: 用于管理项目依赖。
rollup.config.js: Rollup 打包工具的配置文件。

2. 项目的启动文件介绍

项目的启动主要依赖于 test/ 目录下的 simpleTest.html 文件，这是一个简单的 HTML 文件，用于展示如何引入 CETEIcean 库，并使用它来显示 TEI 文档。

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>CETEIcean 简单示例</title>
    <!-- 引入 CETEIcean 库 -->
    <script src="path_to_CETEI.js"></script>
</head>
<body>

<div id="TEI">这里将显示 TEI 文档内容</div>

<script>
    // 初始化 CETEIcean 对象
    var CETEIcean = new CETEI();
    // 加载 TEI 文档
    CETEIcean.getHTML5("path_to_your_TEI.xml", function(data) {
        document.getElementById("TEI").appendChild(data);
    });
</script>

</body>
</html>

在这个文件中，你需要将 path_to_CETEI.js 替换为 CETEI.js 文件的实际路径，同时将 path_to_your_TEI.xml 替换为你想要显示的 TEI 文件的路径。

3. 项目的配置文件介绍

CETEIcean 的配置主要通过其初始化时的选项进行，例如在 simpleTest.html 中，你可以设置 ignoreFragmentId 选项来控制是否忽略 URL 片段标识。

new CETEI({
    ignoreFragmentId: true // 忽略 URL 片段标识
});

此外，如果你需要在服务器端使用 CETEIcean，你可以通过传递一个 DOM 对象作为选项来实例化 CETEIcean。

import { JSDOM } from 'jsdom';
import CETEI from 'CETEIcean';

const jdom = new JSDOM(`<TEI xmlns="http://www.tei-c.org/ns/1.0" />`, { contentType: 'text/xml' });
new CETEI({
    documentObject: jdom.window.document
});