CN115994523B - 一种富格式数字教材内容编号方法及系统 - Google Patents

Abstract

本发明提供了一种富格式数字教材内容编号方法及系统，该方法包括以下步骤：S1：获取页面数字教材内容，并生成JSON格式数据；S2：用户通过编辑器对数字教材内容进行编写，并将编写数据以JSON格式存储于浏览器以及服务器；S3：根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类，并对同一类数据按照文档中顺序进行添加题注或自动编号；S4：根据代码转换规则，将JSON格式的编写数据转化为DOM元素，并更新到浏览器上。本发明所提供的一种富格式数字教材内容编号方法及系统，通过JSON对文档式进行定义，并制定文档的结构，从而完成对浏览器数字教材内容的题注添加或者内容添加并自动添加编号的操作。

Description

一种富格式数字教材内容编号方法及系统

技术领域

本发明涉及信息数据化处理技术领域，具体涉及一种富格式数字教材内容编号方法及系统。

背景技术

常用的字处理软件例如Office Word、WPS等，都具有给图片、表格等自动编号的功能。而常见的基于浏览器的富格式内容编辑器都不具备此功能。如果仅仅是用来编写篇幅较短的文档，也不太需要这个功能。而教材的内容是比较多的，篇幅也较长，还需要按照章节组织内容，所以在数字教材编写工具中，增加图片、表格、公式的自动编号功能，是非常有必要的。

常见的基于浏览器的富格式内容编辑器都是通过将HTML中的DOM元素设置为可以编辑的，然后用户在浏览器中编写富格式内容。然而，现有的浏览器编辑器在数字教材编写场景的应用，仍然存在问题：当需要对数字教材进行内容添加或编辑时需要操作DOM来实现内容的变更，很难通过自动化程序将数据进行结构化存储，只能以一段HTML源代码以及其引用的富格式文件（例如：图片、音频、视频等）URL的形式混合在一起进行存储，这种存储形式将很难通过数据控制现有内容（图片、表格、公式等）实现插入题注及自动编号的功能。且在内容变更时需要全局进行大量DOM操作，再重新全部插入到内容中，这种操作不仅繁琐而且会因为对内容反复修改DOM结构产生卡顿不流畅的不好体验。

发明内容

本发明提供的一种富格式数字教材内容编号方法及系统，采用了数据化存储的编辑器，可以通过操作数据进行添加和修改，然后在页面中呈现内容的变化，从而能够解决上述过程中的技术问题。

本发明解决上述技术问题的技术方案如下：

第一方面，本发明提供了一种富格式数字教材内容编号方法，包括以下步骤：

S1：获取页面数字教材内容，并生成JSON格式数据；

S2：用户通过编辑器对数字教材内容进行编写，并将编写数据以JSON格式存储于浏览器以及服务器；

S3：根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类，并对同一类数据按照文档中顺序进行添加题注或自动编号；

S4：根据代码转换规则，将JSON格式的编写数据转化为DOM元素，并更新到浏览器上。

在一些实施例中，所述S2包括：

S21：通过JavaScript代码监听用户的键盘及鼠标事件，获取用户编写数据；

S22：将编写数据以JSON格式存储于浏览器以及服务器。

在一些实施例中，所述S3中“根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类”包括：

S31：创建题注分类编号节点、题注内容节点以及题注盒模型节点，并定义每一个题注盒模型节点包含一个题注分类编号节点和题注内容节点；

S32：将编写数据内容中同类别的题注数据，按照顺序存储在对应类别的题注盒模型节点之中。

在一些实施例中，所述S3还包括：

S33：创建内容添加节点以及内容添加盒模型节点，并定义每一个内容添加盒模型节点包含一个内容添加节点；

S34：将编写数据内容中同类别的新增内容数据，按照顺序存储在对应类别的内容添加盒模型节点之中。

在一些实施例中，所述S3中“自动编号”包括：

S35：在完成添加题注或新增内容数据操作后，对文档进行全文查找；

S36：对添加题注或新增内容数据中的每一类数据，按照在文档中的顺序，对全文中对应类别的JSON数据进行更新，完成自动编号。

第二方面，本发明提供了一种富格式数字教材内容编号系统，包括：

页面获取模块，用于获取页面数字教材内容，并生成JSON格式数据；

编写模块，用于使用户通过编辑器对数字教材内容进行编写，并将编写数据以JSON格式存储于浏览器以及服务器；

题注编号模块，用于根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类，并对同一类数据按照文档中顺序进行添加题注或自动编号；

转换更新模块，用于根据代码转换规则，将JSON格式的编写数据转化为DOM元素，并更新到浏览器上。

在一些实施例中，所述编写模块包括：

监听子模块，用于通过JavaScript代码监听用户的键盘及鼠标事件，获取用户编写数据；

数据存储子模块，用于将编写数据以JSON格式存储于浏览器以及服务器。

在一些实施例中，所述题注编号模块包括：

题注节点创建子模块，用于创建题注分类编号节点、题注内容节点以及题注盒模型节点，并定义每一个题注盒模型节点包含一个题注分类编号节点和题注内容节点；

题注数据存储子模块，用于将编写数据内容中同类别的题注数据，按照顺序存储在对应类别的题注盒模型节点之中。

在一些实施例中，所述题注编号模块还包括：

内容节点创建子模块，用于创建内容添加节点以及内容添加盒模型节点，并定义每一个内容添加盒模型节点包含一个内容添加节点；

内容数据存储子模块，用于将编写数据内容中同类别的新增内容数据，按照顺序存储在对应类别的内容添加盒模型节点之中。

在一些实施例中，所述题注编号模块还包括：

全文查找子模块，用于在完成添加题注或新增内容数据操作后，对文档进行全文查找；

自动编号子模块，用于对添加题注或新增内容数据中的每一类数据，按照在文档中的顺序，对全文中对应类别的JSON数据进行更新，完成自动编号。

本申请的有益效果是：

本申请提供的一种富格式数字教材内容编号方法及系统，通过JSON对文档式进行定义，从而制定文档的结构，采用JSON方式存储数据，将文档中的内容分为不同的模块，并通过JSON设定每个模块独特的属性、解析、转化行为，从而完成对浏览器数字教材内容的题注添加或者内容添加并自动添加编号的操作。

附图说明

图1为本申请的一种富格式数字教材内容编号方法流程图；

图2为本申请步骤S2的子流程图；

图3为本申请步骤S3的子流程图。

具体实施方式

以下结合附图对本发明的原理和特征进行描述，所举实例只用于解释本发明，并非用于限定本发明的范围。

为了能够更清楚地理解本申请的上述目的、特征和优点，下面结合附图和实施例对本申请作进一步的详细说明。可以理解的是，所描述的实施例是本申请的一部分实施例，而不是全部的实施例。此处所描述的具体实施例仅仅用于解释本申请，而非对本申请的限定。基于所描述的本申请的实施例，本领域普通技术人员所获得的所有其他实施例，都属于本申请保护的范围。

需要说明的是，在本文中，诸如“第一”和“第二”等之类的关系术语仅仅用来将一个实体或者操作与另一个实体或操作区分开来，而不一定要求或者暗示这些实体或操作之间存在任何这种实际的关系或者顺序。

图1为本申请的一种富格式数字教材内容编号方法流程图。

一种富格式数字教材内容编号方法，结合图1，包括以下步骤：

S1：获取页面数字教材内容，并生成JSON格式数据；

具体的，本方案是基于开源组件ProseMirror扩展而来，ProseMirror作为一个富文本编辑器，能够提供基本的文本编写能力，而本方案在ProseMirror基础上，针对文档模式进行了扩展和自定义，以及增加其他的内容及交互组件，例如，增加对LaTeX公式和WIRIS公式的支持，增加插入画廊的能力，例如：增加插入交互练习题目的能力，增加对表格、图片、公式等内容进行自动编号和插入题注的能力等。因此，我们能够对页面的数字教材内容，并生成结构化的JSON格式数据。

S2：用户通过编辑器对数字教材内容进行编写，并将编写数据以JSON格式存储于浏览器以及服务器；

在一些实施例中，结合图2即本申请步骤S2的子流程图，所述S2包括：

S21：通过JavaScript代码监听用户的键盘及鼠标事件，获取用户编写数据；

S22：将编写数据以JSON格式存储于浏览器以及服务器。

具体的，编者在编写教材内容的时候，程序通过使用JavaScript代码监听浏览器的键盘及鼠标事件，得知用户所编写的内容。这部分内容以JSON格式存储，包括浏览器侧有一份，同时，在内容发生变动的时候，也会通过服务器侧代码在服务器的存储里面保留一份。用户插入图片、表格、公式之后，JSON数据中就会进行相应的存储，能够记录这段数据是一个图片、表格或者公式。

S3：根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类，并对同一类数据按照文档中顺序进行添加题注或自动编号；

具体的，在结构化的JSON存储中，很容易找出来本段内容总共有多少图片、表格、公式；而在服务器端可以知道其他章节（非当前编写章节）有多少图片、表格、公式。然后根据顺序，给JSON数据进行编号。

在一些实施例中，结合图3即本申请步骤S3的子流程图，所述S3中“根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类”包括：

S31：创建题注分类编号节点、题注内容节点以及题注盒模型节点，并定义每一个题注盒模型节点包含一个题注分类编号节点和题注内容节点；

S32：将编写数据内容中同类别的题注数据，按照顺序存储在对应类别的题注盒模型节点之中。

具体的，本方案通过JSON对每个模式进行定义，来制定文档的结构，也就是在什么内容中允许插入哪些内容，也定义了JSON和HTML之间的转换规则，即代码完全能感知到用户在什么地方做了什么操作。以添加题注为例，通过JSON创建题注分类编号节点、题注内容节点以及题注盒模型节点，其中题注分类编号节点用于定义对文档数据进行题注的文档格式类型，即保证用户在图片、表格或公式类型文档进行题注添加时，对进行的题注数据区分开来，且在对同一类文档数据进行题注添加后，还会对其进行编号。而每一个题注盒模型节点包含一个题注分类编号节点和题注内容节点，其中题注内容节点用于存储题注内容。同时，每一个节点还对应了一个DOM元素，从而能够根据JOSN节点生成对应的DOM，从而更新到浏览器上。完成上面的定义以后，用户在每次在添加题注时都会对此JOSN数据产生影响，JSON数据发生变化之后，会根据编译规则生成对应的题注DOM元素，然后更新到浏览器上，用户就可以看到添加题注后的效果。

在一些实施例中，所述S3还包括：

S33：创建内容添加节点以及内容添加盒模型节点，并定义每一个内容添加盒模型节点包含一个内容添加节点；

S34：将编写数据内容中同类别的新增内容数据，按照顺序存储在对应类别的内容添加盒模型节点之中。

具体的，本方案不仅能够对文档内容进行分类题注添加，还能够在原文档的基础上插入新的内容。同样的，首先需要创建内容添加节点以及内容添加盒模型节点，并定义每一个内容添加盒模型节点包含一个内容添加节点，其中内容添加节点用于存储添加的数据。完成上面的定义以后，用户即可通过给新添加数据插入题注的操作，对内容添加盒模型的JSON数据产生影响，此处会对题注（题注分类和编号节点、题注内容节点、题注盒模型节点）的JSON数据进行一系列的处理，JSON数据发生变化之后，使得用户插入的题注可以自动生成正确的编号、正确的分类标签以及一个对应的可编辑题注内容的编辑区域节点，然后根据编译规则将对应的题注DOM元素插入到对应的内容添加盒模型的DOM元素中，最后更新到浏览器上，这时候用户就可以看到新增加内容在添加题注后的整体效果。

在一些实施例中，所述S3中“自动编号”包括：

S35：在完成添加题注或新增内容数据操作后，对文档进行全文查找；

S36：对添加题注或新增内容数据中的每一类数据，按照在文档中的顺序，对全文中对应类别的JSON数据进行更新，完成自动编号。

具体的，。

S4：根据代码转换规则，将JSON格式的编写数据转化为DOM元素，并更新到浏览器上。

具体的，在完成题注添加或者新增内容操作之后，会对整个文档进行全文查找，并根据已添加题注的图片在内容中的顺序对所有JSON数据中的图片节点操作JSON数据进行更新，最后转化为正确的DOM，最终呈现到浏览器上即为用户最终看到的正确分类及编号。

除了在插入时进行自动编号处理外，还将提供一个刷新编号功能，对已有题注中的编号进行重新计算和刷新。

本发明第二方面还提供了一种富格式数字教材内容编号系统，包括：

页面获取模块，用于获取页面数字教材内容，并生成JSON格式数据；

编写模块，用于使用户通过编辑器对数字教材内容进行编写，并将编写数据以JSON格式存储于浏览器以及服务器；

题注编号模块，用于根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类，并对同一类数据按照文档中顺序进行添加题注或自动编号；

转换更新模块，用于根据代码转换规则，将JSON格式的编写数据转化为DOM元素，并更新到浏览器上。

在一些实施例中，所述编写模块包括：

监听子模块，用于通过JavaScript代码监听用户的键盘及鼠标事件，获取用户编写数据；

数据存储子模块，用于将编写数据以JSON格式存储于浏览器以及服务器。

在一些实施例中，所述题注编号模块包括：

题注节点创建子模块，用于创建题注分类编号节点、题注内容节点以及题注盒模型节点，并定义每一个题注盒模型节点包含一个题注分类编号节点和题注内容节点；

题注数据存储子模块，用于将编写数据内容中同类别的题注数据，按照顺序存储在对应类别的题注盒模型节点之中。

在一些实施例中，所述题注编号模块还包括：

内容节点创建子模块，用于创建内容添加节点以及内容添加盒模型节点，并定义每一个内容添加盒模型节点包含一个内容添加节点；

内容数据存储子模块，用于将编写数据内容中同类别的新增内容数据，按照顺序存储在对应类别的内容添加盒模型节点之中。

在一些实施例中，所述题注编号模块还包括：

全文查找子模块，用于在完成添加题注或新增内容数据操作后，对文档进行全文查找；

自动编号子模块，用于对添加题注或新增内容数据中的每一类数据，按照在文档中的顺序，对全文中对应类别的JSON数据进行更新，完成自动编号。

本领域的技术人员能够理解，尽管在此所述的一些实施例包括其它实施例中所包括的某些特征而不是其它特征，但是不同实施例的特征的组合意味着处于本申请的范围之内并且形成不同的实施例。

本领域的技术人员能够理解，对各个实施例的描述都各有侧重，某个实施例中没有详述的部分，可以参见其他实施例的相关描述。

虽然结合附图描述了本申请的实施方式，但是本领域技术人员可以在不脱离本申请的精神和范围的情况下做出各种修改和变型，这样的修改和变型均落入由所附权利要求所限定的范围之内以上，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到各种等效的修改或替换，这些修改或替换都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以权利要求的保护范围为准。

以上，仅为本发明的具体实施方式，但本发明的保护范围并不局限于此，任何熟悉本技术领域的技术人员在本发明揭露的技术范围内，可轻易想到各种等效的修改或替换，这些修改或替换都应涵盖在本发明的保护范围之内。因此，本发明的保护范围应以权利要求的保护范围为准。

Claims (6)

1.一种富格式数字教材内容编号方法，其特征在于，包括以下步骤：

S1：获取页面数字教材内容，并生成JSON格式数据；

S2：用户通过编辑器对数字教材内容进行编写，并将编写数据以JSON格式存储于浏览器以及服务器；

S3：根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类，并对同一类数据按照文档中顺序进行添加题注或自动编号；

所述S3中“根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类”包括：

S31：创建题注分类编号节点、题注内容节点以及题注盒模型节点，并定义每一个题注盒模型节点包含一个题注分类编号节点和题注内容节点；

S32：将编写数据内容中同类别的题注数据，按照顺序存储在对应类别的题注盒模型节点之中；

所述S3还包括：

S33：创建内容添加节点以及内容添加盒模型节点，并定义每一个内容添加盒模型节点包含一个内容添加节点；

S34：将编写数据内容中同类别的新增内容数据，按照顺序存储在对应类别的内容添加盒模型节点之中；

S4：根据代码转换规则，将JSON格式的编写数据转化为DOM元素，并更新到浏览器上。

2.根据权利要求1所述的一种富格式数字教材内容编号方法，其特征在于，所述S2包括：

S21：通过JavaScript代码监听用户的键盘及鼠标事件，获取用户编写数据；

S22：将编写数据以JSON格式存储于浏览器以及服务器。

3.根据权利要求1所述的一种富格式数字教材内容编号方法，其特征在于，所述S3中“自动编号”包括：

S35：在完成添加题注或新增内容数据操作后，对文档进行全文查找；

S36：对添加题注或新增内容数据中的每一类数据，按照在文档中的顺序，对全文中对应类别的JSON数据进行更新，完成自动编号。

4.一种富格式数字教材内容编号系统，其特征在于，包括：

页面获取模块，用于获取页面数字教材内容，并生成JSON格式数据；

编写模块，用于使用户通过编辑器对数字教材内容进行编写，并将编写数据以JSON格式存储于浏览器以及服务器；

题注编号模块，用于根据预定义的文档结构，对编写数据以及原页面数字教材内容数据进行分类，并对同一类数据按照文档中顺序进行添加题注或自动编号；

所述题注编号模块包括：

题注节点创建子模块，用于创建题注分类编号节点、题注内容节点以及题注盒模型节点，并定义每一个题注盒模型节点包含一个题注分类编号节点和题注内容节点；

题注数据存储子模块，用于将编写数据内容中同类别的题注数据，按照顺序存储在对应类别的题注盒模型节点之中；

所述题注编号模块还包括：

内容节点创建子模块，用于创建内容添加节点以及内容添加盒模型节点，并定义每一个内容添加盒模型节点包含一个内容添加节点；

内容数据存储子模块，用于将编写数据内容中同类别的新增内容数据，按照顺序存储在对应类别的内容添加盒模型节点之中；

转换更新模块，用于根据代码转换规则，将JSON格式的编写数据转化为DOM元素，并更新到浏览器上。

5.根据权利要求4所述的一种富格式数字教材内容编号系统，其特征在于，所述编写模块包括：

监听子模块，用于通过JavaScript代码监听用户的键盘及鼠标事件，获取用户编写数据；

数据存储子模块，用于将编写数据以JSON格式存储于浏览器以及服务器。

6.根据权利要求4所述的一种富格式数字教材内容编号系统，其特征在于，所述题注编号模块还包括：

全文查找子模块，用于在完成添加题注或新增内容数据操作后，对文档进行全文查找；

自动编号子模块，用于对添加题注或新增内容数据中的每一类数据，按照在文档中的顺序，对全文中对应类别的JSON数据进行更新，完成自动编号。

Images