CN106886398A - 一种层叠样式表的提取方法和设备 - Google Patents

一种层叠样式表的提取方法和设备 Download PDF

Info

Publication number
CN106886398A
CN106886398A CN201610444207.7A CN201610444207A CN106886398A CN 106886398 A CN106886398 A CN 106886398A CN 201610444207 A CN201610444207 A CN 201610444207A CN 106886398 A CN106886398 A CN 106886398A
Authority
CN
China
Prior art keywords
json
code data
data
nodes
sub
Prior art date
Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
Granted
Application number
CN201610444207.7A
Other languages
English (en)
Other versions
CN106886398B (zh
Inventor
饶俊学
Current Assignee (The listed assignees may be inaccurate. Google has not performed a legal analysis and makes no representation or warranty as to the accuracy of the list.)
Advanced New Technologies Co Ltd
Advantageous New Technologies Co Ltd
Original Assignee
Alibaba Group Holding Ltd
Priority date (The priority date is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the date listed.)
Filing date
Publication date
Application filed by Alibaba Group Holding Ltd filed Critical Alibaba Group Holding Ltd
Priority to CN201610444207.7A priority Critical patent/CN106886398B/zh
Publication of CN106886398A publication Critical patent/CN106886398A/zh
Application granted granted Critical
Publication of CN106886398B publication Critical patent/CN106886398B/zh
Active legal-status Critical Current
Anticipated expiration legal-status Critical

Links

Classifications

    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/30—Creation or generation of source code
    • G06F8/38—Creation or generation of source code for implementing user interfaces
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F16/00—Information retrieval; Database structures therefor; File system structures therefor
    • G06F16/90—Details of database functions independent of the retrieved data types
    • G06F16/95—Retrieval from the web
    • G06F16/958—Organisation or management of web site content, e.g. publishing, maintaining pages or automatic linking
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F40/00—Handling natural language data
    • G06F40/10—Text processing
    • G06F40/12—Use of codes for handling textual entities
    • G06F40/151—Transformation
    • G—PHYSICS
    • G06—COMPUTING; CALCULATING OR COUNTING
    • G06F—ELECTRIC DIGITAL DATA PROCESSING
    • G06F8/00—Arrangements for software engineering
    • G06F8/70—Software maintenance or management
    • G06F8/75—Structural analysis for program understanding

Landscapes

  • Engineering & Computer Science (AREA)
  • Theoretical Computer Science (AREA)
  • General Engineering & Computer Science (AREA)
  • Physics & Mathematics (AREA)
  • Software Systems (AREA)
  • General Physics & Mathematics (AREA)
  • Databases & Information Systems (AREA)
  • General Health & Medical Sciences (AREA)
  • Computational Linguistics (AREA)
  • Audiology, Speech & Language Pathology (AREA)
  • Human Computer Interaction (AREA)
  • Artificial Intelligence (AREA)
  • Health & Medical Sciences (AREA)
  • Data Mining & Analysis (AREA)
  • Information Transfer Between Computers (AREA)
  • Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
  • Document Processing Apparatus (AREA)

Abstract

本申请公开了一种层叠样式表的提取方法和设备，包括：将待处理的HTML文件对应的代码数据转换成JSON数据，JSON数据包含至少一个JSON节点，JSON节点对应于代码数据中用于实现设定逻辑功能的子代码数据；遍历JSON数据中包含的JSON节点；提取JSON节点中包含的样式逻辑功能对应的子代码数据；将提取出的子代码数据存储在CSS文件中。在获取到待处理的HTML文件后，将HTML文件对应的代码数据转换成JSON数据，通过遍历JSON数据中的JSON节点，提取JSON节点中的CSS，有效实现CSS提取的自动化，有效避免人为因素影响造成提取耗时较长的问题，提升提取CSS的提取效率。

Description

一种层叠样式表的提取方法和设备
技术领域
本申请涉及计算机技术领域，尤其涉及一种层叠样式表的提取方法和设备。
背景技术
随着互联网技术的发展，在互联网平台中出现了多种多样的网站，这些网站能够为用户提供所需要的信息。网页作为构成网站的基本元素，通常被存储为超文本标记语言(Hyper Text Markup Language，HTML)文件。HTML文件中包含网页内容以及网页展示样式。
通常，一个网站包含多个网页，不同网页中所包含的网页内容不同，但不同网页所使用的网页展示样式大致相同，这就意味着，对于一个网站来讲，不同网页所使用的网页展示样式对应的代码数据大致相同。
在网页设计之初，网页代码编辑者根据网页设计需要，将网页内容对应的代码以及样式逻辑功能对应的代码编辑在一起。但是，一旦完成网页代码的编辑工作，为了后期对网页代码数据的维护，需要将网页源代码数据中包含的样式逻辑功能对应的代码数据从网页源代码数据中提取出来，存储在CSS文件中。通常CSS文件中包含样式逻辑功能对应的代码数据，这些代码数据能够用来控制网页中的字体、文字大小、颜色等内容。
目前，对于HTML文件中的CSS，主要通过人工提取方式实现。例如：采用人为方式查找HTML文件中包含的样式逻辑功能对应的代码数据，依次提取样式逻辑功能对应的代码数据，并存储在CSS文件中。受人为因素影响，使得查找并提取出的样式逻辑功能对应的代码数据容易出现遗漏和/或重复的问题，导致提取CSS耗时较久，且提取效率较低。
发明内容
有鉴于此，本申请实施例提供一种层叠样式表的提取方法和设备，用于解决现有技术中提取CSS方法存在的耗时较久引发的提取效率较低的问题。
本申请实施例提供一种CSS的提取方法，包括：
将待处理的HTML文件对应的代码数据转换成JSON数据，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
遍历所述JSON数据中包含的JSON节点；
提取所述JSON节点中包含的样式逻辑功能对应的子代码数据；
将提取出的所述子代码数据存储在层叠样式表CSS文件中。
本申请实施例提供一种生成HTML文件的方法，包括：
将待处理的第一HTML文件对应的代码数据转换成Java脚本对象，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
遍历所述JSON数据中包含的JSON节点，并提取所述JSON节点中包含的样式逻辑功能对应的子代码数据，将提取出的所述子代码数据存储在层叠样式表CSS文件中；
将提取后剩余的代码数据对应的JSON数据转换成第二HTML文件，所述第二HTML文件中包含被提取出的所述子代码数据对应的CSS名称。
本申请实施例还提供一种CSS的提取设备，包括：
转换单元，用于将待处理的HTML文件对应的代码数据转换成JSON数据，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
遍历单元，用于遍历所述JSON数据中包含的JSON节点；
提取单元，用于提取所述JSON节点中包含的样式逻辑功能对应的子代码数据；
存储单元，用于将提取出的所述子代码数据存储在CSS文件中。
本申请实施例还提供一种生成HTML文件的设备，包括：
第一转换单元，将待处理的第一HTML文件对应的代码数据转换成Java脚本对象，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
处理单元，遍历所述JSON数据中包含的JSON节点，并提取所述JSON节点中包含的样式逻辑功能对应的子代码数据，将提取出的所述子代码数据存储在层叠样式表CSS文件中；
第二转换单元，将提取后剩余的代码数据对应的JSON数据转换成第二HTML文件，所述第二HTML文件中包含被提取出的所述子代码数据对应的CSS名称。
本申请实施例采用的上述至少一个技术方案能够达到以下有益效果：
本申请实施例通过将待处理的HTML文件对应的代码数据转换成JSON数据，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据，转换之后的JSON数据与HTML文件对应的代码数据相比具有更高的序列性，通过遍历JSON数据中的JSON节点，提取所述JSON节点中的CSS并保存在CSS文件中，有效实现CSS提取的自动化，有效避免人为因素影响造成提取耗时较长的问题，提升提取CSS的提取效率。
附图说明
此处所说明的附图用来提供对本申请的进一步理解，构成本申请的一部分，本申请的示意性实施例及其说明用于解释本申请，并不构成对本申请的不当限定。在附图中：
图1为本申请实施例提供的一种CSS的提取方法的流程示意图；
图2为本申请实施例中HTML文件中的不同子代码数据之间的逻辑关系示意图；
图3为本申请实施例提供的一种生成HTML文件的方法的流程示意图；
图4为本申请实施例提供的一种CSS的提取设备的结构示意图；
图5为本申请实施例提供的一种生成HTML文件的设备的结构示意图。
具体实施方式
在网页设计之初，网页代码开发者可以根据网页设计需要，将网页内容对应的代码数据以及样式逻辑功能对应的代码数据编辑在一起，能够保证网页开发者的开发效率。对于一个网站来讲，不同网页所使用的网页展示样式对应的代码数据大致相同，为了方便后期对网页代码数据进行维护，可以将网页源代码数据中包含的样式逻辑功能对应的代码数据从网页源代码数据中提取出来，并存储在CSS文件中，这样，在更新网页展示样式时，对CSS文件中包含的代码数据进行修改即可，有效提升网页维护效率。
例如：网页代码开发者完成网页代码的编写工作之后，需要将网页内容的展示样式从所述网页对应的HTML文件中提取出来存储在CSS文件中，这样网页内容与网页内容的展示样式分开。此时，建立HTML文件与CSS文件的引用关系，可以为多个网页中不同网页内容提供相同的展示样式。当需要对网页内容进行更新和/或修改时，可以在HTML文件中对相关网页内容对应的代码进行更新和/或修改。同时，当CSS文件中某一样式属性被更新时，使用该样式属性的不同网页内容的展示样式自动更新，不必逐页修改。因此，将CSS从HTML文件中提取出来，便于对网页代码进行管理和维护。
现有技术中CSS提取所采用的人工提取方法，受人为因素影响，导致提取CSS耗时较久，且提取效率较低。
为了实现本申请的目的，本申请实施例提供了一种CSS的提取方法和设备，通过将待处理的HTML文件对应的代码数据转换成JSON数据，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据，转换之后的JSON数据与HTML文件对应的代码数据相比具有更高的序列性，根据JSON数据中包含的JSON节点之间的序列关系遍历JSON数据中的JSON节点，提取所述JSON节点中的CSS并保存在CSS文件中，有效实现CSS提取的自动化，有效避免人为因素影响造成提取耗时较长的问题，有效提升提取CSS的提取效率。
下面结合本申请具体实施例及相应的附图对本申请技术方案进行清楚、完整地描述。显然，所描述的实施例仅是本申请一部分实施例，而不是全部的实施例。基于本申请中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本申请保护的范围。
以下结合说明书附图，详细说明本申请各实施例提供的技术方案。
实施例1
图1为本申请提供的一种CSS的提取方法的流程示意图，所述方法可以如下所示。
步骤101：将待处理的HTML文件对应的代码数据转换成JSON数据。
其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据。
在步骤101中，对于每一个网站，网站中包含的网页可以分别对应一个或者多个HTML文件，这里所说的HTML文件是指网页代码编译完成后生成的HTML文件，该HTML文件中包含网页内容对应的代码数据和网页展示样式对应的代码数据，那么本申请实施例中所记载的待处理的HTML文件可以是指这里所说的HTML文件。
首先，获取待处理的HTML文件，所述待处理的HTML文件对应的代码数据中包含至少一个用于实现设定逻辑功能的子代码数据。
具体地，HTML文件是结构化的标签语言，由许多实现不同设定逻辑功能的标签构成。例如：<html>标签用于实现HTML文档功能，<div>标签用于实现文档中的段落功能，<img>标签用于实现图像功能，<video>标签用于实现视频功能，等。所述标签对应一段用于实现该标签的逻辑功能的子代码数据。
例如：<img>标签用于实现图像功能，在网页中实现图像功能，这里以图片为例进行说明，首先实现图片功能需要确定图片内容、图片在网页中展示的位置、图片大小等，那么在<img>标签对应的子代码数据中将包含用于说明图片内容的代码数据、用于说明图片在网页中展示的位置的代码数据、用于说明图片大小的代码数据等。
图2为本申请实施例中HTML文件中的不同子代码数据之间的逻辑关系示意图。
如图2所示，<html>、<div>、<img>和<video>是HTML文件中包含的四个标签。其中，<html>标签用于实现HTML文档功能，可以是HTML文件的根节点。根据<html>标签与<div>标签之间的逻辑关系，可以确定<html>标签中包含用于实现文档中的段落功能的<div>标签，那么可以确定所述<html>标签对应的子代码数据与所述<div>标签对应的子代码数据之间是包含关系。
根据<div>标签与<img>标签之间的逻辑关系，可以确定<div>标签中包含用于实现图像功能的<img>标签，那么可以确定所述<div>标签对应的子代码数据与所述<img>标签对应的子代码数据之间是包含关系。
根据<div>标签与<video>标签之间的逻辑关系，可以确定<div>标签中包含用于实现视频功能的<video>标签，那么可以确定所述<div>标签对应的子代码数据与所述<video>标签对应的子代码数据之间是包含关系。
根据<div>标签与<img>标签之间的逻辑关系以及<div>标签与<video>标签之间的逻辑关系，可以确定<div>标签中包含用于实现图像功能的<img>标签和用于实现视频功能的<video>标签，那么可以确定所述<img>标签对应的子代码数据与所述<video>标签对应的子代码数据之间是并列关系。
其次，为了有效快速的查找所述HTML文件中包含的样式逻辑功能对应的子代码数据，将所述代码数据转换成JSON数据。
需要说明的是，所述转换后的JSON数据与HTML文件中对应的代码数据相比，具有更高的可读性和序列性。
具体地，分析待处理的HTML文件对应的代码数据中包含的至少两个子代码数据之间的逻辑关系，若所述至少两个子代码数据之间的逻辑关系为包含关系，那么将所述至少两个子代码数据分别转换为JSON对象，所述JSON对象对应JSON节点。
若所述至少两个子代码数据之间的逻辑关系为并列关系，那么将所述至少两个子代码数据转换成一个JSON数组，所述JSON数组对应JSON节点。
仍以图2中所示的内容为例说明如何将所述代码数据转换成JSON数据。HTML文件中的<html>标签对应的子代码数据与<div>标签对应的子代码数据之间是包含关系，在转换为JSON数据时，所述<html>标签对应的子代码数据转换为一个JSON对象，所述<div>标签对应的子代码数据也转换为一个JSON对象，所述JSON对象对应JSON节点。
<div>标签对应的子代码数据与<img>标签对应的子代码数据之间是包含关系，在转换为JSON数据时，所述<div>标签对应的子代码数据转换为一个JSON对象，所述<img>标签对应的子代码数据也转换为一个JSON对象，所述JSON对象对应JSON节点。
<div>标签对应的子代码数据与<video>标签对应的子代码数据之间是包含关系，在转换为JSON数据时，所述<div>标签对应的子代码数据转换为一个JSON对象，所述<video>标签对应的子代码数据也转换为一个JSON对象，所述JSON对象对应JSON节点。
<img>标签对应的子代码数据与<video>标签对应的子代码数据之间是并列关系，在转换为JSON数据时，所述<img>标签对应的子代码数据与所述<video>标签对应的子代码数据转换为一个JSON数组，所述JSON数组对应JSON节点。
在本申请的另一实施例中，在将待处理的HTML文件对应的代码数据转换成JSON数据之后，所述方法还包括：
根据所述JSON节点在所述JSON数据中的位置关系确定所述JSON数据中JSON节点的名称。
具体地，首先，确定JSON数据的根节点，其次，确定根节点的子节点以及每个子节点对应的子节点，依此类推，最后，根据JSON数据中各个JSON节点之间的位置关系，确定所述JSON数据中所有JSON节点的名称。
例如：JSON数据的根节点为0，它的子节点分别为0_0和0_1，其中，0_1的子节点分别为0_1_0，0_1_1和0_1_2，依此类推，确定所述JSON数据中所有JSON节点的名称。
在本申请的另一实施例中，首先，确定JSON数据的根节点，其次，确定待命名的JSON节点是JSON根节点的几层子节点以及在该层的位置，最后，确定所述JSON节点的名称。
例如：JSON数据的根节点为A，根节点A包含两个子节点B、C，子节点B包含三个子节点D、E、F，对JSON节点E进行命名，首先确定根节点为0，所述JSON节点E是JSON根节点A的二层子节点，而且在三层节点中的位置为第二位，则所述JSON节点E为0_2_2。
在本申请的另一实施例中，首先，确定JSON数据的根节点，其次，确定根节点的子节点以及每个子节点对应的子节点，最后，按照JSON数据中各个JSON节点的位置顺序，确定所述JSON节点的名称。
例如：JSON数据的根节点为A，根节点A包含两个子节点B、C，子节点B包含三个子节点D、E、F，则所述JSON数据中JSON节点的命名为：所述JSON根节点A为0，所述JSON根节点B为1，所述JSON根节点C为2，所述JSON根节点D为3，所述JSON根节点E为4，所述JSON根节点F为5。
在本申请的另一实施例中，确定所述JSON数据中所有JSON节点的名称之后，所述方法还包括：
确定JSON节点中包含的样式逻辑功能对应的子代码数据的名称。
具体地，首先，确定样式逻辑功能对应的子代码数据所在的JSON节点的名称，其次，将所述JSON节点的名称作为所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的CSS名称。
例如：JSON数据的根节点为0，根节点中包含的样式逻辑功能对应的子代码数据的CSS名称是0；根节点的子节点分别为0_0和0_1，子节点0_0中包含的样式逻辑功能对应的子代码数据的CSS名称是0_0，子节点0_1中包含的样式逻辑功能对应的子代码数据的CSS名称是0_1；0_1的子节点分别为0_1_0，0_1_1和0_1_2，子节点0_1_0中包含的样式逻辑功能对应的子代码数据的CSS名称是0_1_0，子节点0_1_1中包含的样式逻辑功能对应的子代码数据的CSS名称是0_1_1，子节点0_1_2中包含的样式逻辑功能对应的子代码数据的CSS名称是0_1_2，依此类推，确定所述JSON数据中所有JSON节点中包含的样式逻辑功能对应的子代码数据的CSS名称。
在本申请的另一实施例中，首先，确定样式逻辑功能对应的子代码数据所在的JSON节点的名称，其次，在所述JSON节点的名称前面加上CSS标签作为所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的CSS名称。
例如：JSON数据的根节点为0，根节点中包含的样式逻辑功能对应的子代码数据的CSS名称是css:0；根节点的子节点分别为0_0和0_1，子节点0_0中包含的样式逻辑功能对应的子代码数据的CSS名称是css:0_0，子节点0_1中包含的样式逻辑功能对应的子代码数据的CSS名称是css:0_1；0_1的子节点分别为0_1_0，0_1_1和0_1_2，子节点0_1_0中包含的样式逻辑功能对应的子代码数据CSS名称是css:0_1_0，子节点0_1_1中包含的样式逻辑功能对应的子代码数据的CSS名称是css:0_1_1，子节点0_1_2中包含的样式逻辑功能对应的子代码数据的CSS名称是css:0_1_2，依此类推，确定所述JSON数据中所有JSON节点中包含的样式逻辑功能对应的子代码数据的CSS名称。
步骤102：遍历所述JSON数据中包含的JSON节点。
在步骤102中，根据JSON数据中JSON节点之间的序列关系，遍历所述JSON数据中的JSON节点。
步骤103：提取所述JSON节点中包含的样式逻辑功能对应的子代码数据。
在步骤103中，在遍历JSON节点的过程中，提取当前访问的JSON节点中包含的样式逻辑功能对应的子代码数据。
在本申请的另一实施例中，先遍历JSON节点，对访问到的JSON节点中包含的样式逻辑功能对应的子代码数据进行标记，遍历结束之后，提取所述被标记的样式逻辑功能对应的子代码数据。
在本申请的另一实施例中，在提取所述JSON节点中包含的样式逻辑功能对应的子代码数据之后，所述方法还包括：
在所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的位置上，写入所述子代码数据的CSS名称。
例如：JSON数据中用于实现文档中段落功能的<div>标签对应的JSON节点对应的子代码数据为：<div>{段落样式对应的代码数据}，所述样式逻辑功能对应的子代码数据的CSS名称为css:0_1_1，提取所述样式逻辑功能对应的子代码数据并在所述样式逻辑功能对应的子代码数据的位置上写入所述子代码数据的CSS名称之后，所述JSON节点对应的子代码数据为：<div>{css:0_1_1}。
步骤104：将提取出的所述子代码数据存储在CSS文件中。
在步骤104中，将步骤103中遍历JSON节点提取出的样式逻辑功能对应的子代码数据存储在CSS文件中。
具体地，在遍历JSON节点开始时，生成CSS文件，并在遍历JSON节点的过程中，将提取到的当前访问的JSON节点中包含的样式逻辑功能对应的子代码数据存储在所述CSS文件中。
在本申请的另一实施例中，先遍历JSON节点，对访问到的JSON节点中包含的样式逻辑功能对应的子代码数据进行标记，遍历结束后，生成CSS文件，将遍历过程中标记的样式逻辑功能对应的子代码数据提取并存储到所述CSS文件中。
在本申请的另一实施例中，在所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的位置上写入所述子代码数据的CSS名称后，所述方法还包括：
将变化后的所述JSON数据逆转换为HTML文件。
具体地，将变化后的所述JSON数据中的JSON对象与JSON子对象转换为HTML文件中逻辑关系为包含关系的代码数据，所述JSON子对象对应的代码数据是所述JSON对象对应的代码数据对应的子代码数据。
将JSON数据中的JSON数组中的至少两个JSON子对象转换为HTML文件中逻辑关系为并列关系的代码数据。
需要说明的是，逆转后得到的所述HTML文件对应的代码数据中包含被提取出的所述样式逻辑功能对应的子代码数据对应的CSS名称。
通过本申请实施例提供的技术方案，将待处理的HTML文件对应的代码数据转换成JSON数据，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据，转换之后的JSON数据与HTML文件对应的代码数据相比具有更高的序列性，通过遍历JSON数据中的JSON节点，提取所述JSON节点中的CSS并保存在CSS文件中，有效实现CSS提取的自动化，有效避免人为因素影响造成提取耗时较长的问题，提升提取CSS的提取效率。
实施例2
图3为本申请实施例提供的一种生成HTML文件的方法的流程示意图。所述方法可以如下所示。
步骤301：将待处理的第一HTML文件对应的代码数据转换成JSON数据。
其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据。
在步骤301中，将待处理的第一HTML文件对应的代码数据转换成JSON数据的方法与实施例1中的步骤101中所使用的方法相同。
步骤302：遍历所述JSON数据中包含的JSON节点，并提取所述JSON节点中包含的样式逻辑功能对应的子代码数据，将提取出的所述子代码数据存储在层叠样式表CSS文件中。
在步骤302中，遍历所述JSON数据中包含的JSON节点的方法与实施例1中的步骤102中所使用的方法相同。
在步骤302中，提取所述JSON节点中包含的样式逻辑功能对应的子代码数据的方法与实施例1中的步骤103中所使用的方法相同。
在步骤302中，将提取出的所述子代码数据存储在层叠样式表CSS文件中的方法与实施例1中的步骤104中所使用的方法相同。
步骤303：将提取后剩余的代码数据对应的JSON数据转换成第二HTML文件。
其中，所述第二HTML文件中包含被提取出的所述子代码数据对应的CSS名称。
在步骤303中，将提取后剩余的代码数据对应的JSON数据转换成第二HTML文件的方法与实施例1中步骤104中包含的将变化后的所述JSON数据逆转换为HTML文件的方法相同。
实施例3
图4为本申请提供的一种CSS的提取设备的结构示意图，所述CSS的提取设备包括：转换单元401、遍历单元402、提取单元403、存储单元404，其中：
转换单元401，用于将待处理的HTML文件对应的代码数据转换成JSON数据，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
遍历单元402，用于遍历所述JSON数据中包含的JSON节点；
提取单元403，用于提取所述JSON节点中包含的样式逻辑功能对应的子代码数据；
存储单元404，用于将提取出的所述子代码数据存储在CSS文件中。
在本申请的另一实施例中，所述转换单元401将待处理的HTML文件对应的代码数据转换成JSON数据，包括：
分析待处理的HTML文件对应的代码数据中包含的至少两个子代码数据之间的逻辑关系；
若所述至少两个子代码数据之间的逻辑关系为包含关系，那么将所述至少两个子代码数据分别转换为JSON对象，所述JSON对象对应JSON节点。
若所述至少两个子代码数据之间的逻辑关系为并列关系，那么将所述至少两个子代码数据转换成一个JSON数组，所述JSON数组对应JSON节点。
在本申请的另一实施例中，所述提取设备还包括：命名单元405和写入单元406，其中：
所述命名单元405，用于在所述转换单元将待处理的HTML文件对应的代码数据转换成JSON数据之后，根据所述JSON节点在所述JSON数据中的位置，确定所述JSON节点的名称，根据所述JSON节点的名称，生成所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的CSS名称；
所述写入单元406，用于在所述提取单元提取所述JSON节点中包含的样式逻辑功能对应的子代码数据之后，在所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的位置上，写入所述子代码数据的CSS名称。
在本申请的另一实施例中，所述命名单元405根据所述JSON节点在所述JSON数据中的位置，确定所述JSON节点的名称，包括：
确定所述JSON节点的根节点；
根据所述JSON节点的根节点和所述JSON节点在所述根节点中的位置，确定所述JSON节点的名称。
在本申请的另一实施例中，所述提取设备还包括：逆转换单元407，其中：
所述逆转换单元407，用于当所述写入单元在所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的位置上写入所述子代码数据的CSS名称后，将变化后的所述JSON数据逆转换为HTML文件。
通过所述CSS的提取设备，所述转换单元将待处理的HTML文件对应的代码数据转换成JSON数据，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据，转换之后的JSON数据与HTML文件对应的代码数据相比具有更高的序列性，所述遍历单元遍历JSON数据中的JSON节点，所述提取单元提取所述节点中的CSS，所述存储单元将提取出的CSS存储在CSS文件中，有效实现了CSS提取的自动化，有效避免人为因素影响造成提取耗时较长的问题，提升提取CSS的提取效率。
实施例4
基于同一个发明构思，图5为本申请实施例提供的一种生成HTML文件的设备的结构示意图，所述生成HTML文件的设备包括：第一转换单元501、处理单元502、第二转换单元503，其中：
第一转换单元501，将待处理的第一HTML文件对应的代码数据转换成Java脚本对象，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
处理单元502，遍历所述JSON数据中包含的JSON节点，并提取所述JSON节点中包含的样式逻辑功能对应的子代码数据，将提取出的所述子代码数据存储在层叠样式表CSS文件中；
第二转换单元503，将提取后剩余的代码数据对应的JSON数据转换成第二HTML文件，所述第二HTML文件中包含被提取出的所述子代码数据对应的CSS名称。
需要说明的是，本申请实施例中做记载的HTML文件生成设备可以具备实施例3中所记载的CSS提取设备的功能，这里不再详细赘述。
本领域内的技术人员应明白，本发明的实施例可提供为方法、系统、或计算机程序产品。因此，本发明可采用完全硬件实施例、完全软件实施例、或结合软件和硬件方面的实施例的形式。而且，本发明可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
本发明是参照根据本发明实施例的方法、设备(系统)、和计算机程序产品的流程图和/或方框图来描述的。应理解可由计算机程序指令实现流程图和/或方框图中的每一流程和/或方框、以及流程图和/或方框图中的流程和/或方框的结合。可提供这些计算机程序指令到通用计算机、专用计算机、嵌入式处理机或其他可编程数据处理设备的处理器以产生一个机器，使得通过计算机或其他可编程数据处理设备的处理器执行的指令产生用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的装置。
这些计算机程序指令也可存储在能引导计算机或其他可编程数据处理设备以特定方式工作的计算机可读存储器中，使得存储在该计算机可读存储器中的指令产生包括指令装置的制造品，该指令装置实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能。
这些计算机程序指令也可装载到计算机或其他可编程数据处理设备上，使得在计算机或其他可编程设备上执行一系列操作步骤以产生计算机实现的处理，从而在计算机或其他可编程设备上执行的指令提供用于实现在流程图一个流程或多个流程和/或方框图一个方框或多个方框中指定的功能的步骤。
在一个典型的配置中，计算设备包括一个或多个处理器(CPU)、输入/输出接口、网络接口和内存。
内存可能包括计算机可读介质中的非永久性存储器，随机存取存储器(RAM)和/或非易失性内存等形式，如只读存储器(ROM)或闪存(flash RAM)。内存是计算机可读介质的示例。
计算机可读介质包括永久性和非永久性、可移动和非可移动媒体可以由任何方法或技术来实现信息存储。信息可以是计算机可读指令、数据结构、程序的模块或其他数据。计算机的存储介质的例子包括，但不限于相变内存(PRAM)、静态随机存取存储器(SRAM)、动态随机存取存储器(DRAM)、其他类型的随机存取存储器(RAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、快闪记忆体或其他内存技术、只读光盘只读存储器(CD-ROM)、数字多功能光盘(DVD)或其他光学存储、磁盒式磁带，磁带磁磁盘存储或其他磁性存储设备或任何其他非传输介质，可用于存储可以被计算设备访问的信息。按照本文中的界定，计算机可读介质不包括暂存电脑可读媒体(transitory media)，如调制的数据信号和载波。
还需要说明的是，术语“包括”、“包含”或者其任何其他变体意在涵盖非排他性的包含，从而使得包括一系列要素的过程、方法、商品或者设备不仅包括那些要素，而且还包括没有明确列出的其他要素，或者是还包括为这种过程、方法、商品或者设备所固有的要素。在没有更多限制的情况下，由语句“包括一个……”限定的要素，并不排除在包括所述要素的过程、方法、商品或者设备中还存在另外的相同要素。
本领域技术人员应明白，本申请的实施例可提供为方法、系统或计算机程序产品。因此，本申请可采用完全硬件实施例、完全软件实施例或结合软件和硬件方面的实施例的形式。而且，本申请可采用在一个或多个其中包含有计算机可用程序代码的计算机可用存储介质(包括但不限于磁盘存储器、CD-ROM、光学存储器等)上实施的计算机程序产品的形式。
以上所述仅为本申请的实施例而已，并不用于限制本申请。对于本领域技术人员来说，本申请可以有各种更改和变化。凡在本申请的精神和原理之内所作的任何修改、等同替换、改进等，均应包含在本申请的权利要求范围之内。

Claims (14)

1.一种层叠样式表的提取方法，其特征在于，包括：
将待处理的超文本标记语言HTML文件对应的代码数据转换成Java脚本对象JSON数据，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
遍历所述JSON数据中包含的JSON节点；
提取所述JSON节点中包含的样式逻辑功能对应的子代码数据；
将提取出的所述子代码数据存储在层叠样式表CSS文件中。
2.如权利要求1所述的提取方法，其特征在于，将待处理的HTML文件对应的代码数据转换成JSON数据，包括：
分析待处理的HTML文件对应的代码数据中包含的至少两个子代码数据之间的逻辑关系；
若所述至少两个子代码数据之间的逻辑关系为包含关系，那么将所述至少两个子代码数据分别转换为JSON对象，所述JSON对象对应JSON节点。
3.如权利要求2所述的提取方法，其特征在于，将待处理的HTML文件对应的代码数据转换成JSON数据，包括：
若所述至少两个子代码数据之间的逻辑关系为并列关系，那么将所述至少两个子代码数据转换成一个JSON数组，所述JSON数组对应JSON节点。
4.如权利要求1所述的提取方法，其特征在于，在将待处理的HTML文件对应的代码数据转换成JSON数据之后，所述方法还包括：
根据所述JSON节点在所述JSON数据中的位置，确定所述JSON节点的名称；
根据所述JSON节点的名称，生成所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的CSS名称；
在提取所述JSON节点中包含的样式逻辑功能对应的子代码数据之后，所述方法还包括：
在所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的位置上，写入所述子代码数据的CSS名称。
5.如权利要求4所述的提取方法，其特征在于，根据所述JSON节点在所述JSON数据中的位置，确定所述JSON节点的名称，包括：
确定所述JSON节点的根节点；
根据所述JSON节点的根节点和所述JSON节点在所述根节点中的位置，确定所述JSON节点的名称。
6.如权利要求4所述的提取方法，其特征在于，在所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的位置上写入所述子代码数据的CSS名称后，所述方法还包括：
将变化后的所述JSON数据逆转换为HTML文件。
7.一种生成超文本标记语言HTML文件的方法，其特征在于，包括：
将待处理的第一HTML文件对应的代码数据转换成Java脚本对象，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
遍历所述JSON数据中包含的JSON节点，并提取所述JSON节点中包含的样式逻辑功能对应的子代码数据，将提取出的所述子代码数据存储在层叠样式表CSS文件中；
将提取后剩余的代码数据对应的JSON数据转换成第二HTML文件，所述第二HTML文件中包含被提取出的所述子代码数据对应的CSS名称。
8.一种层叠样式表的提取设备，其特征在于，包括：
转换单元，用于将待处理的HTML文件对应的代码数据转换成JSON数据，其中，所述JSON数据至少包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
遍历单元，用于遍历所述JSON数据中包含的JSON节点；
提取单元，用于提取所述JSON节点中包含的样式逻辑功能对应的子代码数据；
存储单元，用于将提取出的所述子代码数据存储在CSS文件中。
9.如权利要求8所述的提取设备，其特征在于，所述转换单元将待处理的HTML文件对应的代码数据转换成JSON数据，包括：
分析待处理的HTML文件对应的代码数据中包含的至少两个子代码数据之间的逻辑关系；
若所述至少两个子代码数据之间的逻辑关系为包含关系，那么将所述至少两个子代码数据分别转换为JSON对象，所述JSON对象对应JSON节点。
10.如权利要求9所述的提取设备，其特征在于，所述转换单元将待处理的HTML文件对应的代码数据转换成JSON数据，包括：
若所述至少两个子代码数据之间的逻辑关系为并列关系，那么将所述至少两个子代码数据转换成一个JSON数组，所述JSON数组对应JSON节点。
11.如权利要求8所述的提取设备，其特征在于，所述提取设备还包括：，命名单元和写入单元，其中：
所述命名单元，用于在所述转换单元将待处理的HTML文件对应的代码数据转换成JSON数据之后，根据所述JSON节点在所述JSON数据中的位置，确定所述JSON节点的名称，根据所述JSON节点的名称，生成所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的CSS名称；
所述写入单元，用于在所述提取单元提取所述JSON节点中包含的样式逻辑功能对应的子代码数据之后，在所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的位置上，写入所述子代码数据的CSS名称。
12.如权利要求11所述的提取设备，其特征在于，所述命名单元根据所述JSON节点在所述JSON数据中的位置，确定所述JSON节点的名称，包括：
确定所述JSON节点的根节点；
根据所述JSON节点的根节点和所述JSON节点在所述根节点中的位置，确定所述JSON节点的名称。
13.如权利要求11所述的提取设备，其特征在于，所述提取设备还包括：逆转换单元，其中：
所述逆转换单元，用于当所述写入单元在所述JSON节点中包含的所述样式逻辑功能对应的子代码数据的位置上写入所述子代码数据的CSS名称后，将变化后的所述JSON数据逆转换为HTML文件。
14.一种生成超文本标记语言HTML文件的设备，其特征在于，包括：
第一转换单元，将待处理的第一HTML文件对应的代码数据转换成Java脚本对象，其中，所述JSON数据包含至少一个JSON节点，所述JSON节点对应于所述代码数据中用于实现设定逻辑功能的子代码数据；
处理单元，遍历所述JSON数据中包含的JSON节点，并提取所述JSON节点中包含的样式逻辑功能对应的子代码数据，将提取出的所述子代码数据存储在层叠样式表CSS文件中；
第二转换单元，将提取后剩余的代码数据对应的JSON数据转换成第二HTML文件，所述第二HTML文件中包含被提取出的所述子代码数据对应的CSS名称。
CN201610444207.7A 2016-06-20 2016-06-20 一种层叠样式表的提取方法和设备 Active CN106886398B (zh)

Priority Applications (1)

Application Number Priority Date Filing Date Title
CN201610444207.7A CN106886398B (zh) 2016-06-20 2016-06-20 一种层叠样式表的提取方法和设备

Applications Claiming Priority (1)

Application Number Priority Date Filing Date Title
CN201610444207.7A CN106886398B (zh) 2016-06-20 2016-06-20 一种层叠样式表的提取方法和设备

Publications (2)

Publication Number Publication Date
CN106886398A true CN106886398A (zh) 2017-06-23
CN106886398B CN106886398B (zh) 2020-09-15

Family

ID=59176720

Family Applications (1)

Application Number Title Priority Date Filing Date
CN201610444207.7A Active CN106886398B (zh) 2016-06-20 2016-06-20 一种层叠样式表的提取方法和设备

Country Status (1)

Country Link
CN (1) CN106886398B (zh)

Cited By (6)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108446136A (zh) * 2018-03-22 2018-08-24 北京焦点新干线信息技术有限公司 一种元素代码的提取方法及系统
CN110231935A (zh) * 2019-06-12 2019-09-13 上海达梦数据库有限公司 一种脚本执行和更新的方法、装置、设备和存储介质
CN111259631A (zh) * 2020-01-15 2020-06-09 中科鼎富（北京）科技发展有限公司 一种裁判文书结构化方法及装置
CN111984262A (zh) * 2020-07-14 2020-11-24 微民保险代理有限公司 微信层叠样式表文件的处理方法、装置、设备及存储介质
CN112527444A (zh) * 2020-12-29 2021-03-19 天翼阅读文化传播有限公司 应用于虚拟现实客户端用户界面的自定义页面实现方法
CN112650479A (zh) * 2019-10-10 2021-04-13 上海哔哩哔哩科技有限公司 网页css结构自动生成方法及存储介质

Citations (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103425466A (zh) * 2012-05-17 2013-12-04 腾讯科技（深圳）有限公司 配色处理方法和装置

Patent Citations (1)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN103425466A (zh) * 2012-05-17 2013-12-04 腾讯科技（深圳）有限公司 配色处理方法和装置

Non-Patent Citations (2)

* Cited by examiner, † Cited by third party
Title
ALLENSON933: "Java实现从html中提取css", 《HTTPS://ALLENSON933.ITEYE.COM/BLOG/2024681》 *
李成银: "html2json&json2html的实现", 《HTTP://WWW.WELEFEN.COM/POST/HTML2JSON-AND-JSON2HTML-2.HTML》 *

Cited By (9)

* Cited by examiner, † Cited by third party
Publication number Priority date Publication date Assignee Title
CN108446136A (zh) * 2018-03-22 2018-08-24 北京焦点新干线信息技术有限公司 一种元素代码的提取方法及系统
CN108446136B (zh) * 2018-03-22 2021-10-15 北京焦点新干线信息技术有限公司 一种元素代码的提取方法及系统
CN110231935A (zh) * 2019-06-12 2019-09-13 上海达梦数据库有限公司 一种脚本执行和更新的方法、装置、设备和存储介质
CN110231935B (zh) * 2019-06-12 2023-06-30 上海达梦数据库有限公司 一种脚本执行和更新的方法、装置、设备和存储介质
CN112650479A (zh) * 2019-10-10 2021-04-13 上海哔哩哔哩科技有限公司 网页css结构自动生成方法及存储介质
CN111259631A (zh) * 2020-01-15 2020-06-09 中科鼎富（北京）科技发展有限公司 一种裁判文书结构化方法及装置
CN111259631B (zh) * 2020-01-15 2023-08-25 鼎富智能科技有限公司 一种裁判文书结构化方法及装置
CN111984262A (zh) * 2020-07-14 2020-11-24 微民保险代理有限公司 微信层叠样式表文件的处理方法、装置、设备及存储介质
CN112527444A (zh) * 2020-12-29 2021-03-19 天翼阅读文化传播有限公司 应用于虚拟现实客户端用户界面的自定义页面实现方法

Also Published As

Publication number Publication date
CN106886398B (zh) 2020-09-15

Similar Documents

Publication Publication Date Title
CN106886398A (zh) 一种层叠样式表的提取方法和设备
US10671251B2 (en) Interactive eReader interface generation based on synchronization of textual and audial descriptors
US20150206444A1 (en) System and method for authoring animated content for web viewable textbook data object
US10713429B2 (en) Joining web data with spreadsheet data using examples
US20150113388A1 (en) Method and apparatus for performing topic-relevance highlighting of electronic text
CN104823158B (zh) 用于简化的知识工程的方法与系统
US20160117307A1 (en) Recursive extraction and narration of nested tables
CN103377039B (zh) 一种网页游戏开发、解析方法、一种编辑器以及解析装置
CN104516727B (zh) 更改资源文件中的资源的方法和系统
CN108170435A (zh) 一种源代码转换方法、装置及设备
US20140215306A1 (en) In-Context Editing of Output Presentations via Automatic Pattern Detection
GB2572234A (en) Interactive tutorial integration
CN103176785A (zh) Widget 应用在线实现系统及方法
CN107015839A (zh) 一种实现前端事件代理的方法及装置
CN105745644A (zh) 表示在网页浏览器中的网页的状态表示的建立
CN106933887A (zh) 一种数据可视化方法及装置
CN106886530A (zh) 一种动态数据分别编辑更新方法及系统
CN106446139A (zh) 一种提取网页内容的方法及装置
Heydt Python Web Scraping Cookbook: Over 90 proven recipes to get you scraping with Python, microservices, Docker, and AWS
CN108228181A (zh) 在html页面中嵌入html页面的方法及装置
CN107609175A (zh) Dom树生成方法以及相关设备
CN104462157B (zh) 一种文本数据二次结构化的方法及装置
US20200257507A1 (en) Integration of workflow and logical data objects using visual programming
Benson et al. Cascading tree sheets and recombinant HTML: better encapsulation and retargeting of web content
CN106033348A (zh) 一种制作网页的方法、装置及电子设备

Legal Events

Date Code Title Description
PB01 Publication
PB01 Publication
SE01 Entry into force of request for substantive examination
SE01 Entry into force of request for substantive examination
GR01 Patent grant
GR01 Patent grant
TR01 Transfer of patent right

Effective date of registration: 20200925

Address after: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman, British Islands

Patentee after: Innovative advanced technology Co.,Ltd.

Address before: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman, British Islands

Patentee before: Advanced innovation technology Co.,Ltd.

Effective date of registration: 20200925

Address after: Cayman Enterprise Centre, 27 Hospital Road, George Town, Grand Cayman, British Islands

Patentee after: Advanced innovation technology Co.,Ltd.

Address before: A four-storey 847 mailbox in Grand Cayman Capital Building, British Cayman Islands

Patentee before: Alibaba Group Holding Ltd.

TR01 Transfer of patent right