CN112241505B - 页面更新方法、页面更新装置、介质及电子设备 - Google Patents

Abstract

本公开提供一种页面更新方法、页面更新装置、计算机可读存储介质及电子设备；涉及计算机技术领域。该页面更新方法包括：根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径；根据至少一个第一文件路径确定出与至少一个第一文件路径对应的第二文件路径；对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容；其中，第二文件内容与第二文件路径对应，第二文件内容与所述引用文件内容对应；根据用户操作更新包含引用文件内容的第二文件内容中的变量，并根据变量更新所述当前页面。本公开中的页面更新方法能够一定程度上克服网页皮肤更新效率较低的问题，进而提升网页皮肤更新效率。

Description

页面更新方法、页面更新装置、介质及电子设备

技术领域

本公开涉及计算机技术领域，具体而言，涉及一种页面更新方法、页面更新装置、计算机可读存储介质及电子设备。

背景技术

层叠样式表(cascading style sheets，css)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。

设计师通常会为网页设计皮肤，以提升网页的整体美感。网页的皮肤包括网页整体的主色、按钮颜色以及底色等。基于用户的需求，有时需要对网页的皮肤进行更新。

目前，更换皮肤的方式为根据一些基于静态css的扩展程序对网页皮肤进行更换。但是，这种方式通常是替换整体皮肤文件，而这样的皮肤更新效率较低。

需要说明的是，在上述背景技术部分公开的信息仅用于加强对本公开的背景的理解，因此可以包括不构成对本领域普通技术人员已知的现有技术的信息。

发明内容

本公开的目的在于提供一种页面更新方法、页面更新装置、计算机可读存储介质及电子设备，进而在一定程度上克服网页皮肤更新效率较低的问题，进而提升网页皮肤更新效率。

本公开的其他特性和优点将通过下面的详细描述变得显然，或部分地通过本公开的实践而习得。

根据本公开的第一方面，提供一种页面更新方法，包括：

根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径；

根据至少一个第一文件路径确定出与至少一个第一文件路径对应的第二文件路径；

对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容；其中，第二文件内容与第二文件路径对应，第二文件内容与引用文件内容对应；

根据用户操作更新包含引用文件内容的第二文件内容中的变量，并根据变量更新所述当前页面。

在本公开的一种示例性实施例中，根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径，包括：

根据页面信息和用户信息调用文件获取接口；

根据文件获取接口确定当前页面中的标签信息；

根据标签信息获取至少一个第一文件路径。

在本公开的一种示例性实施例中，第一文件路径为css文件路径，第二文件路径为less文件路径。

在本公开的一种示例性实施例中，对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容，包括：

查询第二文件内容对应的引用文件内容以及引用文件内容对应的引用文件内容，并在第二文件内容中添加第二文件内容对应的引用文件内容和引用文件内容对应的引用文件内容。

在本公开的一种示例性实施例中，根据用户操作更新包含引用文件内容的第二文件内容中的变量，包括：

确定包含引用文件内容的第二文件内容中的变量；

根据用户操作更新包含引用文件内容的第二文件内容中的变量。

在本公开的一种示例性实施例中，根据变量更新当前页面，包括：

对更新变量后的第二文件内容进行编译，得到第三文件内容；

将第三文件内容插入所述当前页面。

在本公开的一种示例性实施例中，该页面更新方法还包括：

当检测到用户授权信息时，获取页面信息和用户信息。

根据本公开的第二方面，提供一种页面更新装置，包括文件路径确定单元、引用文件内容确定单元以及页面更新单元，其中：

文件路径确定单元，用于根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径；

文件路径确定单元，还用于根据至少一个第一文件路径确定出与至少一个第一文件路径对应的第二文件路径；

引用文件内容确定单元，用于对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容；其中，第二文件内容与第二文件路径对应，第二文件内容与引用文件内容对应；

页面更新单元，用于根据用户操作更新第二文件内容和引用文件内容中的变量，并根据变量更新所述当前页面。

在本公开的一种示例性实施例中，文件路径确定单元根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径的方式具体为：

文件路径确定单元根据页面信息和用户信息调用文件获取接口；

文件路径确定单元根据文件获取接口确定当前页面中的标签信息；

文件路径确定单元根据标签信息获取至少一个第一文件路径。

在本公开的一种示例性实施例中，第一文件路径为css文件路径，第二文件路径为less文件路径。

在本公开的一种示例性实施例中，引用文件内容确定单元对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容的方式具体为：

引用文件内容确定单元查询第二文件内容对应的引用文件内容以及引用文件内容对应的引用文件内容，并在第二文件内容中添加第二文件内容对应的引用文件内容和引用文件内容对应的引用文件内容。

在本公开的一种示例性实施例中，页面更新单元根据用户操作更新包含引用文件内容的第二文件内容中的变量的方式具体为：

页面更新单元确定包含引用文件内容的第二文件内容中的变量；

页面更新单元根据用户操作更新包含引用文件内容的第二文件内容中的变量。

在本公开的一种示例性实施例中，页面更新单元根据变量更新当前页面的方式具体为：

页面更新单元对更新变量后的第二文件内容进行编译，得到第三文件内容；

页面更新单元将第三文件内容插入所述当前页面。

在本公开的一种示例性实施例中，该页面更新装置还包括信息获取单元，其中：

信息获取单元，用于当检测到用户授权信息时，获取页面信息和用户信息。

根据本公开的第三方面，提供一种电子设备，包括：处理器；以及存储器，用于存储所述处理器的可执行指令；其中，所述处理器配置为经由执行所述可执行指令来执行上述任意一项所述的方法。

根据本公开的第四方面，提供一种计算机可读存储介质，其上存储有计算机程序，所述计算机程序被处理器执行时实现上述任意一项所述的方法。

本公开示例性实施例可以具有以下部分或全部有益效果：

在本公开的一示例实施方式所提供的页面更新方法中，根据页面信息（如，网页链接）和用户信息（如，用户名参数）可以确定与当前页面（如，web页面）对应的至少一个第一文件路径；进而，根据至少一个第一文件路径（如，css文件路径）确定出与至少一个第一文件路径对应的第二文件路径（如，less文件路径）；进而，对第二文件内容进行递归查询，以确定出第二文件内容的所有引用文件内容，再根据用户对于变量的更改操作更新当前页面，以实现页面换肤需求。依据上述方案描述，本公开一方面能够在一定程度上克服网页皮肤更新效率较低的问题，对页面中的变量进行针对性更改，相较传统的对整体皮肤文件的替换能够提升网页皮肤更新效率；另一方面能够提升页面换肤的自动化程度，减少手动换肤操作，降低了为页面更新皮肤的操作门槛，进一步提升网页的皮肤更新效率。

应当理解的是，以上的一般描述和后文的细节描述仅是示例性和解释性的，并不能限制本公开。

附图说明

此处的附图被并入说明书中并构成本说明书的一部分，示出了符合本公开的实施例，并与说明书一起用于解释本公开的原理。显而易见地，下面描述中的附图仅仅是本公开的一些实施例，对于本领域普通技术人员来讲，在不付出创造性劳动的前提下，还可以根据这些附图获得其他的附图。

图1示出了可以应用本公开实施例的一种页面更新方法及页面更新装置的示例性系统架构的示意图；

图2示出了适于用来实现本公开实施例的电子设备的计算机系统的结构示意图；

图3示意性示出了根据本公开的一个实施例的页面更新方法的流程图；

图4示意性示出了根据本公开的一个实施例中确定第一文件路径的流程图；

图5示意性示出了根据本公开的一个实施例中更新包含引用文件内容的第二文件内容中的变量的流程图；

图6示意性示出了根据本公开的一个实施例中根据变量更新当前页面的流程图；

图7示意性示出了根据本公开的另一个实施例的页面更新方法的流程图；

图8示意性示出了根据本公开的一个实施例的应用页面更新方法的流程图；

图9示意性示出了根据本公开的一个实施例中的页面更新装置的结构框图。

具体实施方式

现在将参考附图更全面地描述示例实施方式。然而，示例实施方式能够以多种形式实施，且不应被理解为限于在此阐述的范例；相反，提供这些实施方式使得本公开将更加全面和完整，并将示例实施方式的构思全面地传达给本领域的技术人员。所描述的特征、结构或特性可以以任何合适的方式结合在一个或更多实施方式中。在下面的描述中，提供许多具体细节从而给出对本公开的实施方式的充分理解。然而，本领域技术人员将意识到，可以实践本公开的技术方案而省略所述特定细节中的一个或更多，或者可以采用其它的方法、组元、装置、步骤等。在其它情况下，不详细示出或描述公知技术方案以避免喧宾夺主而使得本公开的各方面变得模糊。

此外，附图仅为本公开的示意性图解，并非一定是按比例绘制。图中相同的附图标记表示相同或类似的部分，因而将省略对它们的重复描述。附图中所示的一些方框图是功能实体，不一定必须与物理或逻辑上独立的实体相对应。可以采用软件形式来实现这些功能实体，或在至少一个硬件模块或集成电路中实现这些功能实体，或在不同网络和/或处理器装置和/或微控制器装置中实现这些功能实体。

图1示出了可以应用本公开实施例的一种页面更新方法及装置的示例性应用环境的系统架构的示意图。

如图1所示，系统架构100可以包括终端设备101、102、103中的至少一个，网络104和服务器105。网络104用以在终端设备101、102、103和服务器105之间提供通信链路的介质。网络104可以包括各种连接类型，例如有线、无线通信链路或者光纤电缆等等。终端设备101、102、103可以是具有显示屏的各种电子设备，包括但不限于台式计算机、便携式计算机、智能手机和平板电脑等等。应该理解，图1中的终端设备、网络和服务器的数目仅仅是示意性的。根据实现需要，可以具有任意数目的终端设备、网络和服务器。比如服务器105可以是至少两个服务器组成的服务器集群等。

本公开实施例所提供的页面更新方法一般由服务器105执行，相应地，页面更新装置一般设置于服务器105中。但本领域技术人员容易理解的是，本公开实施例所提供的页面更新方法也可以由终端设备101、102、103执行，相应的，页面更新装置也可以设置于终端设备101、102、103中，本示例性实施例中对此不做特殊限定。举例而言，在一种示例性实施例中，服务器105可以根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径，以及根据至少一个第一文件路径确定出与至少一个第一文件路径对应的第二文件路径，以及对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容；进而，终端设备101、102或103根据用户操作更新包含引用文件内容的第二文件内容中的变量，并根据变量更新所述当前页面。

图2示出了适于用来实现本公开实施例的电子设备的计算机系统的结构示意图。

需要说明的是，图2示出的电子设备的计算机系统200仅是一个示例，不应对本公开实施例的功能和使用范围带来任何限制。

如图2所示，计算机系统200包括中央处理单元（CPU）201，其可以根据存储在只读存储器（ROM）202中的程序或者从存储部分208加载到随机访问存储器（RAM）203中的程序而执行各种适当的动作和处理。在RAM 203中，还存储有系统操作所需的各种程序和数据。CPU201、ROM 202以及RAM 203通过总线204彼此相连。输入/输出（I/O）接口205也连接至总线204。

以下部件连接至I/O接口205：包括键盘、鼠标等的输入部分206；包括诸如阴极射线管（CRT）、液晶显示器（LCD）等以及扬声器等的输出部分207；包括硬盘等的存储部分208；以及包括诸如LAN卡、调制解调器等的网络接口卡的通信部分209。通信部分209经由诸如因特网的网络执行通信处理。驱动器210也根据需要连接至I/O接口205。可拆卸介质211，诸如磁盘、光盘、磁光盘、半导体存储器等等，根据需要安装在驱动器210上，以便于从其上读出的计算机程序根据需要被安装入存储部分208。

特别地，根据本公开的实施例，下文参考流程图描述的过程可以被实现为计算机软件程序。例如，本公开的实施例包括一种计算机程序产品，其包括承载在计算机可读介质上的计算机程序，该计算机程序包含用于执行流程图所示的方法的程序代码。在这样的实施例中，该计算机程序可以通过通信部分209从网络上被下载和安装，和/或从可拆卸介质211被安装。在该计算机程序被中央处理单元（CPU）201执行时，执行本申请的方法和装置中限定的各种功能。在一些实施例中，计算机系统200还可以包括AI（ArtificialIntelligence，人工智能）处理器，该AI处理器用于处理有关机器学习的计算操作。

需要说明的是，本公开所示的计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质或者是上述两者的任意组合。计算机可读存储介质例如可以是——但不限于——电、磁、光、电磁、红外线、或半导体的系统、装置或器件，或者任意以上的组合。计算机可读存储介质的更具体的例子可以包括但不限于：具有至少一个导线的电连接、便携式计算机磁盘、硬盘、随机访问存储器（RAM）、只读存储器（ROM）、可擦式可编程只读存储器（EPROM或闪存）、光纤、便携式紧凑磁盘只读存储器（CD-ROM）、光存储器件、磁存储器件、或者上述的任意合适的组合。在本公开中，计算机可读存储介质可以是任何包含或存储程序的有形介质，该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。而在本公开中，计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号，其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式，包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质，该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。计算机可读介质上包含的程序代码可以用任何适当的介质传输，包括但不限于：无线、电线、光缆、RF等等，或者上述的任意合适的组合。

附图中的流程图和框图，图示了按照本公开各种实施例的系统、方法和计算机程序产品的可能实现的体系架构、功能和操作。在这点上，流程图或框图中的每个方框可以代表一个模块、程序段、或代码的一部分，上述模块、程序段、或代码的一部分包含至少一个用于实现规定的逻辑功能的可执行指令。也应当注意，在有些作为替换的实现中，方框中所标注的功能也可以以不同于附图中所标注的顺序发生。例如，两个接连地表示的方框实际上可以基本并行地执行，它们有时也可以按相反的顺序执行，这依所涉及的功能而定。也要注意的是，框图或流程图中的每个方框、以及框图或流程图中的方框的组合，可以用执行规定的功能或操作的专用的基于硬件的系统来实现，或者可以用专用硬件与计算机指令的组合来实现。

描述于本公开实施例中所涉及到的单元可以通过软件的方式实现，也可以通过硬件的方式来实现，所描述的单元也可以设置在处理器中。其中，这些单元的名称在某种情况下并不构成对该单元本身的限定。

作为另一方面，本申请还提供了一种计算机可读介质，该计算机可读介质可以是上述实施例中描述的电子设备中所包含的；也可以是单独存在，而未装配入该电子设备中。上述计算机可读介质承载有至少一个程序，当上述至少一个程序被一个该电子设备执行时，使得该电子设备实现如下述实施例中所述的方法。例如，所述的电子设备可以实现如图3~图8所示的各个步骤等。

以下对本公开实施例的技术方案进行详细阐述：

设计师通常会为网页设计皮肤，以提升网页的整体美感。网页的皮肤包括网页整体的主色、按钮颜色以及底色等。基于用户的需求，有时需要对网页的皮肤进行更新。

目前，更换皮肤的方式为根据一些基于静态css的扩展程序对网页皮肤进行更换。但是，这种方式通常是替换整体皮肤文件，而这样的皮肤更新效率较低。

基于上述问题，本示例实施方式提供了一种页面更新方法。该页面更新方法可以应用于上述服务器105，也可以应用于上述终端设备101、102、103中的至少一个，本示例性实施例中对此不做特殊限定。参考图3所示，该页面更新方法可以包括以下步骤S310至步骤S340：

步骤S310： 根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径。

步骤S320：根据至少一个第一文件路径确定出与至少一个第一文件路径对应的第二文件路径。

步骤S330：对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容；其中，第二文件内容与第二文件路径对应，第二文件内容与引用文件内容对应。

步骤S340：根据用户操作更新包含引用文件内容的第二文件内容中的变量，并根据变量更新所述当前页面。

在本公开的一示例实施方式所提供的页面更新方法中，根据页面信息（如，网页链接）和用户信息（如，用户名参数）可以确定与当前页面（如，web页面）对应的至少一个第一文件路径；进而，根据至少一个第一文件路径（如，css文件路径）可以确定出与至少一个第一文件路径对应的第二文件路径（如，less文件路径）；进而，对第二文件内容进行递归查询，以确定出第二文件内容的所有引用文件内容，再根据用户对于变量的更改操作更新当前页面，以实现页面换肤需求。依据上述方案描述，本公开一方面能够在一定程度上克服网页皮肤更新效率较低的问题，对页面中的变量进行针对性更改，相较传统的对整体皮肤文件的替换能够提升网页皮肤更新效率；另一方面能够提升页面换肤的自动化程度，减少手动换肤操作，降低了为页面更新皮肤的操作门槛，进一步提升网页的皮肤更新效率。

下面，对于本示例实施方式的上述步骤进行更加详细的说明。

在步骤S310中，根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径。

本示例实施方式中，页面信息用于标识当前页面，页面信息包括当前页面的链接；用户信息用于标识当前用户，用户信息包括用户名参数；当前页面可以为web页面；第一文件路径可以为css路径。

本示例实施方式中，根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径可以理解为：根据页面信息和用户信息将html页面中引用的所有css文件路径通过cheerio库爬取为数组，即，得到至少一个第一文件路径。

其中，html是超文本标记语言(hyper text markup language)，是标准通用标记语言下的一个应用。html通常用于网页制作。上述的超文本是指页面内可以包含图片、链接、音乐、程序等非文字元素。超文本标记语言(或超文本标签语言)的结构包括头部分、和主体部分；其中，头部提供关于网页的信息，主体部分提供网页的具体内容。另外，上述的cheerio是nodejs的抓取页面模块，为服务器特别定制的快速、灵活、可实施的jQuery核心实现，适用于多种Web爬虫程序。

本示例实施方式中，上述的根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径可以由服务器执行。

本示例实施方式中，可选的，请参阅图4，图4示意性示出了根据本公开的一个实施例中确定第一文件路径的流程图。如图4所示，根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径，可以包括步骤S410~步骤S430，其中：

步骤S410：根据页面信息和用户信息调用文件获取接口。

步骤S420：根据文件获取接口确定当前页面中的标签信息。

步骤S430：根据标签信息获取至少一个第一文件路径。

本示例实施方式中，文件获取接口用于供服务器调用，以获取less文件内容；标签信息可以为当前页面的link标签；link标签通常放置在一个网页的头部标签，即head标签内，用于链接外部css文件以及收藏夹图标（favicon.ico）等，其最常见的用途是链接外部样式表以及外部资源。

本示例实施方式中，上述的步骤S410可以由客户端执行，上述的步骤S420和步骤S430可以由服务器执行。

本示例实施方式中，根据文件获取接口确定当前页面中的标签信息的方式具体为：遍历当前页面以获取当前页面中所有的link标签。

进一步地，根据标签信息获取至少一个第一文件路径的方式具体为：根据link标签获取当前页面的至少一个css文件路径。

可见，实施该可选的实施方式，能够根据当前页面中的标签获取css文件路径，以便根据css文件路径确定出less文件路径，并根据less文件路径确定出less内容以供用户更新变量，进而提升当前页面的更新效率。

在步骤S320中，根据至少一个第一文件路径确定出与至少一个第一文件路径对应的第二文件路径。

本示例实施方式中，第二文件路径可以为less文件路径、sass文件路径或stylus文件路径，本公开的实施例不作限定；其中，less是一种 css预处理语言，它扩展了css语言，增加了变量、Mixin、函数等特性，使得css 更易维护和扩展；其中，Mixin意为允许将一个类嵌入另一个类中，被嵌入的类也可以被看做变量，也就是说，如果通过一个类定义样式并将其作为变量，那么，在另一个类中，只要引用变量的名字就能够使用其所有特性。此外，less可以运行在节点（Node）或浏览器端。

本示例实施方式中，less文件路径可以应用于svn；其中，svn是一个开源的版本控制系统，svn可以管理随时间改变的数据，这些数据放置在中央资料档案库中，该档案库可以理解为文件服务器，用于记录每一次文件的改动。

本示例实施方式中，上述的根据至少一个第一文件路径确定出与至少一个第一文件路径对应的第二文件路径可以由服务器执行。此外，至少一个第一文件路径与第二文件路径一一对应，可以理解为，存在的第一文件路径的数量与第二文件路径的数量相同，即，如果存在5个第一文件路径，那么，确定出的与第一文件路径对应的第二文件路径也存在5个。此外，可选的，存在的第一文件路径的数量与第二文件路径的数量也可以不相同。举例来说，如果存在5个第一文件路径，确定出的与第一文件路径对应的第二文件路径可以为4个。再举例来说，如果存在5个第一文件路径，确定出的与第一文件路径对应的第二文件路径可以为6个，本公开的实施例不作限定。

在步骤S330中，对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容；其中，第二文件内容与第二文件路径对应，第二文件内容与引用文件内容对应。

本示例实施方式中，递归最少包括两个查询，一个查询为定点成员，定点成员用于返回有效表的查询，用于递归的基础或定位点；另一个查询被称为递归成员，使该查询成为递归成员的是对递归引用时触发递归表。在逻辑上，可以将其理解为是前一个查询语句的子集。递归查询没有显式的递归终止条件，只有当第二个递归查询返回空结果为集或是超出了递归次数的最大限制时才停止递归。

本示例实施方式中，第一文件路径对应第一文件内容（如，css文件内容），第二文件路径对应第二文件内容（如，less文件内容），由于less文件存在引用文件链接，因此，确定出引用文件内容的方式可以为：通过对第二文件内容进行递归查询确定出引用文件链接，根据引用文件链接确定出引用文件内容。另外，在第二文件内容中添加引用文件内容可以理解为，将第二文件内容中的引用文件链接替换为引用文件内容。其中，引用文件内容也可以为一种less文件内容。

本示例实施方式中，上述的对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容可以由服务器执行。

本示例实施方式中，可选的，对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容，包括：

查询第二文件内容对应的引用文件内容以及引用文件内容对应的引用文件内容，并在第二文件内容中添加第二文件内容对应的引用文件内容和引用文件内容对应的引用文件内容。

本示例实施方式中，第二文件内容可以对应至少一个引用文件内容，而每个引用文件内容也可以分别对应至少一个引用文件内容。

可见，通过上述的查询第二文件内容对应的引用文件内容以及引用文件内容对应的引用文件内容，能够确定出关于第二文件内容的所有引用文件内容，以便确定出全部变量，进而提升对于页面更新的效率。

在步骤S340中，根据用户操作更新包含引用文件内容的第二文件内容中的变量，并根据变量更新所述当前页面。

本示例实施方式中，可选的，请参阅图5，图5示意性示出了根据本公开的一个实施例中更新包含引用文件内容的第二文件内容中的变量的流程图。如图5所示，根据用户操作更新包含引用文件内容的第二文件内容中的变量，包括步骤S510和步骤S520，其中：

步骤S510：确定包含引用文件内容的第二文件内容中的变量。

步骤S520：根据用户操作更新包含引用文件内容的第二文件内容中的变量。

本示例实施方式中，变量是计算机语言中能储存计算结果或能表示值的抽象概念。变量可以通过变量名进行访问。在指令式语言中，变量通常是可变的；但在纯函数式语言（如Haskell）中，变量可能是不可变的。在Java和Visual Basic中，变量可能被明确为是能表示可变状态、具有存储空间的抽象概念。

本示例实施方式中，用户操作可以为用于修改变量的操作。

本示例实施方式中，确定包含引用文件内容的第二文件内容中的变量的方式具体为：

通过正则表达式获取到包含引用文件内容的第二文件内容中的注释；

根据注释获取变量和值对注释进行替换，或生成json配置保存在js变量中。

其中，正则表达式，即规则表达式（Regular Expression，在代码中常简写为regex、regexp或RE），通常被用来检索、替换那些符合某个模式(规则)的文本。此外，json(javaScript object notation, js对象简谱) 是一种轻量级的数据交换格式。它基于ECMAScript (欧洲计算机协会制定的js规范)的一个子集，采用完全独立于编程语言的文本格式来存储和表示数据。js（JavaScript）是一种直译式脚本语言，也是一种动态类型、弱类型、基于原型的语言。

本示例实施方式中，在步骤S510之后，还可以包括：

在devtools中展示上述变量。其中，devtools是一个开放调试工具，隐藏在安卓模拟器中。

可见，实施该可选的实施方式，能够通过用户修改变量的操作对原有变量进行更新，即针对性的对页面皮肤进行更改，以提升页面更新的效率。

本示例实施方式中，可选的，请参阅图6，图6示意性示出了根据本公开的一个实施例中根据变量更新当前页面的流程图。如图6所示，根据变量更新当前页面，包括步骤S610和步骤S620，其中：

步骤S610：对更新变量后的第二文件内容进行编译，得到第三文件内容。

步骤S620：将第三文件内容插入当前页面。

本示例实施方式中，第三文件内容也可以为css文件内容。

本示例实施方式中，在步骤S620之后，还可以包括：下载第三文件内容以供设计人员调用。

可见，实施该可选的实施方式，能够提升页面更新效率，即，页面换肤效率，减少手动操作的工作量，降低页面换肤的技术门槛。

本示例实施方式中，可选的，该页面更新方法还包括：

当检测到用户授权信息时，获取页面信息和用户信息。

本示例实施方式中，如果未检测到用户授权信息，则通过用户名向管理员要求授权，以获取页面信息和用户信息。

可见，实施该可选的实施方式，能够通过用户授权信息提高本实施方式的运行安全性。

可见，图3所示的页面更新方法，能够一定程度上克服网页皮肤更新效率较低的问题，对页面中的变量进行针对性更改，相较传统的对整体皮肤文件的替换能够提升网页皮肤更新效率；以及，提升页面换肤的自动化程度，减少手动换肤操作，降低了为页面更新皮肤的操作门槛，进一步提升网页的皮肤更新效率。

请参阅图7，图7示意性示出了根据本公开的另一个实施例的页面更新方法的流程图。如图7所示，另一个实施例的页面更新方法包括步骤S700~步骤S730，其中：

步骤S700：判断用户是否已授权使用，如果是，则执行步骤S704，如果否，则执行步骤S702。

步骤S702：通过用户名向管理员要求授权，以获取页面信息和用户信息。

步骤S704：传递页面信息和用户信息，以调用文件获取接口。

步骤S706：遍历当前页面以获取当前页面中所有的link标签。

步骤S708：根据link标签获取当前页面的至少一个css文件路径。

步骤S710：根据至少一个css文件路径确定出与至少一个css文件路径对应的less文件路径。

步骤S712：通过less文件路径获取less文件内容。

步骤S714：查询第二文件内容对应的引用文件内容以及引用文件内容对应的引用文件内容。

步骤S716：将所有引用文件路径替换为引用文件内容。

步骤S718：返回包含引用文件内容的第二文件内容。

步骤S720：通过包含引用文件内容的第二文件内容中的注释获取变量。

步骤S722：在devtools中展示变量。

步骤S724：根据用户操作更新包含引用文件内容的第二文件内容中的变量。

步骤S726：对更新变量后的less文件内容进行编译，得到css文件内容。

步骤S728：将css文件内容插入当前页面。

步骤S730：下载css文件。

具体地，服务器执行步骤S706~步骤S718，客户端执行步骤S700~步骤S704以及步骤S720~步骤S730。此外，客户端还可以进行构建稿服务器代理（即，web服务器），这样是为了使设计师可以直接在本地看到构建稿服务器的页面，以便其在扩展程序上配置代理。如果设计师需要登录外网，则可以在目标文件（如，proxy_devnet.pac文件）上添加所需的代理，进而提升对于页面更新的效率。

需要说明的是，上述步骤为可选的实施方式和步骤S310~步骤S340的结合，故，步骤S700~步骤S730在前述步骤中均对其进行了说明，请参见前述步骤，此处不再赘述。

可见，图7所示的页面更新方法，能够一定程度上克服网页皮肤更新效率较低的问题，对页面中的变量进行针对性更改，相较传统的对整体皮肤文件的替换能够提升网页皮肤更新效率；以及，提升页面换肤的自动化程度，减少手动换肤操作，降低了为页面更新皮肤的操作门槛，进一步提升网页的皮肤更新效率。

请参阅图8，图8示意性示出了根据本公开的一个实施例的应用页面更新方法的流程图。如图8所示，应用页面更新方法包括步骤S810~步骤S830，其中：

步骤S810：设计师根据产品需求修改原有设计稿颜色并做出色卡图。

步骤S820：设计师根据色卡图并基于Xthemes修改变量值。

步骤S830：Xthemes根据修改变量值生成对应皮肤文件，以便于前端调用皮肤文件。

具体地，在对于页面更新方法的应用过程中，设计师可以根据产品需求修改原有设计稿颜色并做出色卡图，进而根据色卡图并基于Xthemes修改变量值，Xthemes可以根据修改变量值生成对应皮肤文件，以便于前端调用皮肤文件。其中，Xthemes为页面换肤扩展程序。

在传统应用页面更新方法中，设计师需要先根据产品需求修改原有设计稿颜色并做出色卡图，UI重构工程师再根据色卡对照变量逐个修改变量值，进而，将替换皮肤后的重构稿和设计稿进行对照修改，以生成对应的皮肤文件方便前端调用。

其中，传统应用页面更新方法需要设计师和UI重构工程师共同完成应用页面更新，即换肤，历时3到4天。而图8所示的应用页面更新方法只需要设计师或产品经理，历时不到1天就可以完成页面的更新。

可见，图8所示的应用页面更新方法的流程图，相较传统应用页面更新方法，能够一定程度上克服网页皮肤更新效率较低的问题，对页面中的变量进行针对性更改，相较传统的对整体皮肤文件的替换能够提升网页皮肤更新效率；以及，提升页面换肤的自动化程度，减少手动换肤操作，降低了为页面更新皮肤的操作门槛，进一步提升网页的皮肤更新效率。

进一步的，本示例实施方式中，还提供了一种页面更新装置。该页面更新装置可以应用于一服务器或终端设备。参考图9所示，该页面更新装置可以包括文件路径确定单元901、引用文件内容确定单元902以及页面更新单元903，其中：

文件路径确定单元901，用于根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径；

文件路径确定单元901，还用于根据至少一个第一文件路径确定出与至少一个第一文件路径对应的第二文件路径；

引用文件内容确定单元902，用于对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容；其中，第二文件内容与第二文件路径对应，第二文件内容与引用文件内容对应；

页面更新单元903，用于根据用户操作更新第二文件内容和引用文件内容中的变量，并根据变量更新所述当前页面。

可见，实施图9所示的页面更新装置，能够一定程度上克服网页皮肤更新效率较低的问题，对页面中的变量进行针对性更改，相较传统的对整体皮肤文件的替换能够提升网页皮肤更新效率；以及，提升页面换肤的自动化程度，减少手动换肤操作，降低了为页面更新皮肤的操作门槛，进一步提升网页的皮肤更新效率。

在本公开的一种示例性实施例中，文件路径确定单元901根据页面信息和用户信息确定与当前页面对应的至少一个第一文件路径的方式具体为：

文件路径确定单元901根据页面信息和用户信息调用文件获取接口；

文件路径确定单元901根据文件获取接口确定当前页面中的标签信息；

文件路径确定单元901根据标签信息获取至少一个第一文件路径。

进一步地，第一文件路径为css文件路径，第二文件路径为less文件路径。

可见，实施该示例性实施例，能够根据当前页面中的标签获取css文件路径，以便根据css文件路径确定出less文件路径，并根据less文件路径确定出less内容以供用户更新变量，进而提升当前页面的更新效率。

在本公开的一种示例性实施例中，引用文件内容确定单元902对第二文件内容进行递归查询，以确定出引用文件内容并在第二文件内容中添加引用文件内容的方式具体为：

引用文件内容确定单元902查询第二文件内容对应的引用文件内容以及引用文件内容对应的引用文件内容，并在第二文件内容中添加第二文件内容对应的引用文件内容和引用文件内容对应的引用文件内容。

可见，实施该示例性实施例，通过上述的查询第二文件内容对应的引用文件内容以及引用文件内容对应的引用文件内容，能够确定出关于第二文件内容的所有引用文件内容，以便确定出全部变量，进而提升对于页面更新的效率。

在本公开的一种示例性实施例中，页面更新单元903根据用户操作更新包含引用文件内容的第二文件内容中的变量的方式具体为：

页面更新单元903确定包含引用文件内容的第二文件内容中的变量；

页面更新单元903根据用户操作更新包含引用文件内容的第二文件内容中的变量。

可见，实施该示例性实施例，能够通过用户修改变量的操作对原有变量进行更新，即针对性的对页面皮肤进行更改，以提升页面更新的效率。

在本公开的一种示例性实施例中，页面更新单元903根据变量更新当前页面的方式具体为：

页面更新单元903对更新变量后的第二文件内容进行编译，得到第三文件内容；

页面更新单元903将第三文件内容插入所述当前页面。

可见，实施该示例性实施例，能够提升页面更新效率，即，页面换肤效率，减少手动操作的工作量，降低页面换肤的技术门槛。

在本公开的一种示例性实施例中，该页面更新装置还包括信息获取单元（未图示），其中：

信息获取单元，用于当检测到用户授权信息时，获取页面信息和用户信息。

可见，实施该示例性实施例，能够通过用户授权信息提高本实施方式的运行安全性。

应当注意，尽管在上文详细描述中提及了用于动作执行的设备的若干模块或者单元，但是这种划分并非强制性的。实际上，根据本公开的实施方式，上文描述的两个或更多模块或者单元的特征和功能可以在一个模块或者单元中具体化。反之，上文描述的一个模块或者单元的特征和功能可以进一步划分为由至少两个模块或者单元来具体化。

由于本公开的示例实施例的页面更新装置的各个功能模块与上述页面更新方法的示例实施例的步骤对应，因此对于本公开装置实施例中未披露的细节，请参照本公开上述的页面更新方法的实施例。

本领域技术人员在考虑说明书及实践这里公开的发明后，将容易想到本公开的其它实施方案。本申请旨在涵盖本公开的任何变型、用途或者适应性变化，这些变型、用途或者适应性变化遵循本公开的一般性原理并包括本公开未公开的本技术领域中的公知常识或惯用技术手段。说明书和实施例仅被视为示例性的，本公开的真正范围和精神由下面的权利要求指出。

应当理解的是，本公开并不局限于上面已经描述并在附图中示出的精确结构，并且可以在不脱离其范围进行各种修改和改变。本公开的范围仅由所附的权利要求来限制。

Claims (9)

1.一种页面更新方法，其特征在于，包括：

根据页面信息和用户信息调用文件获取接口；

根据所述文件获取接口确定当前页面中的标签信息；

根据所述标签信息获取至少一个第一文件路径；

根据所述至少一个第一文件路径确定出与所述至少一个第一文件路径对应的第二文件路径；

对第二文件内容进行递归查询，以确定出引用文件内容并在所述第二文件内容中添加所述引用文件内容；其中，所述第二文件内容与所述第二文件路径对应，所述第二文件内容与所述引用文件内容对应；

根据用户操作更新包含所述引用文件内容的第二文件内容中的变量，并根据所述变量更新所述当前页面。

2.根据权利要求1所述的方法，其特征在于，所述第一文件路径为css文件路径，所述第二文件路径为less文件路径。

3.根据权利要求1所述的方法，其特征在于，对第二文件内容进行递归查询，以确定出引用文件内容并在所述第二文件内容中添加所述引用文件内容，包括：

查询第二文件内容对应的引用文件内容以及所述引用文件内容对应的引用文件内容，并在所述第二文件内容中添加所述第二文件内容对应的引用文件内容和所述引用文件内容对应的引用文件内容。

4.根据权利要求1所述的方法，其特征在于，根据用户操作更新包含所述引用文件内容的第二文件内容中的变量，包括：

确定包含所述引用文件内容的第二文件内容中的变量；

根据用户操作更新包含所述引用文件内容的第二文件内容中的变量。

5.根据权利要求4所述的方法，其特征在于，根据所述变量更新所述当前页面，包括：

对更新变量后的第二文件内容进行编译，得到第三文件内容；

将所述第三文件内容插入所述当前页面。

6.根据权利要求1所述的方法，其特征在于，还包括：

当检测到用户授权信息时，获取所述页面信息和所述用户信息。

7.一种页面更新装置，其特征在于，包括：

文件路径确定单元，用于根据页面信息和用户信息调用文件获取接口；根据所述文件获取接口确定当前页面中的标签信息；根据所述标签信息获取至少一个第一文件路径；

所述文件路径确定单元，还用于根据所述至少一个第一文件路径确定出与所述至少一个第一文件路径对应的第二文件路径；

引用文件内容确定单元，用于对第二文件内容进行递归查询，以确定出引用文件内容并在所述第二文件内容中添加所述引用文件内容；其中，所述第二文件内容与所述第二文件路径对应，所述第二文件内容与所述引用文件内容对应；

页面更新单元，用于根据用户操作更新所述第二文件内容和所述引用文件内容中的变量，并根据所述变量更新所述当前页面。

8.一种计算机可读存储介质，其上存储有计算机程序，其特征在于，所述计算机程序被处理器执行时实现权利要求1-6任一项所述的方法。

9.一种电子设备，其特征在于，包括：

处理器；以及

存储器，用于存储所述处理器的可执行指令；

其中，所述处理器配置为经由执行所述可执行指令来执行权利要求1-6任一项所述的方法。