CN113569171A - 网页主题更换方法及装置、存储介质、计算机设备 - Google Patents
网页主题更换方法及装置、存储介质、计算机设备 Download PDFInfo
- Publication number
- CN113569171A CN113569171A CN202111127709.4A CN202111127709A CN113569171A CN 113569171 A CN113569171 A CN 113569171A CN 202111127709 A CN202111127709 A CN 202111127709A CN 113569171 A CN113569171 A CN 113569171A
- Authority
- CN
- China
- Prior art keywords
- theme
- target
- variable
- file
- webpage
- 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.)
- Pending
Links
Images
Classifications
-
- 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/957—Browsing optimisation, e.g. caching or content distillation
-
- 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
Landscapes
- Engineering & Computer Science (AREA)
- Databases & Information Systems (AREA)
- Theoretical Computer Science (AREA)
- Data Mining & Analysis (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Information Transfer Between Computers (AREA)
Abstract
本申请公开了一种网页主题更换方法及装置、存储介质、计算机设备,该方法包括:响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题;读取所述目标主题对应的目标变量文件,其中,所述目标变量文件包括待更换的目标变量种类以及与所述目标变量种类对应的变更值;通过浏览器原生程序对已加载的网页样式文件进行编译,将已加载的网页样式文件中与所述目标变量种类对应的参数值更新为对应的所述变更值,以使所述网页样式文件与所述目标主题匹配;加载所述网页样式文件中与所述目标变量种类对应的参数值,以将所述目标主题应用于所述目标网页上。本申请无需创建全量样式文件,减少了资源占用量,同时提高了页面刷新效率。
Description
技术领域
本申请涉及互联网技术领域,尤其是涉及到一种网页主题更换方法及装置、存储介质、计算机设备。
背景技术
随着互联网技术的不断发展和普及,目前的web应用中,用户对个性化的要求不断攀升,个性化的用户界面设计方案首当其冲,有大量的web应用中提供了“换肤”功能,对页面主题进行个性化切换。目前主要的实现方式为定制多套主题变量方案,然后使用sass、less等预处理器生成多套样式文件,在用户界面通过切换样式文件来实现“换肤”的功能。
上述“换肤”方式,每次切换主题时均需要通过预编译器生成与主题相应的样式文件,进而依据样式文件进行渲染生成与相应主题匹配的页面。样式文件资源量较大,且需要预编译器配合使用,给前端系统造成了编译和渲染压力。
发明内容
有鉴于此,本申请提供了一种网页主题更换方法及装置、存储介质、计算机设备。
根据本申请的一个方面,提供了一种网页主题更换方法,包括:
响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题;
读取所述目标主题对应的目标变量文件,其中,所述目标变量文件包括待更换的目标变量种类以及与所述目标变量种类对应的变更值;
通过浏览器原生程序对已加载的网页样式文件进行编译,将已加载的网页样式文件中与所述目标变量种类对应的参数值更新为对应的所述变更值,以使所述网页样式文件与所述目标主题匹配;
加载所述网页样式文件中与所述目标变量种类对应的参数值,以将所述目标主题应用于所述目标网页上。
可选地,所述响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题之前,所述方法还包括:
基于对所述目标网页的请求指令,读取并加载所述网页样式文件,其中,所述网页样式文件包括初始主题文件以及至少一个主题变量文件;
通过浏览器渲染所述初始主题文件,以展示与初始主题风格匹配的目标网页;
相应地,所述读取所述目标主题对应的目标变量文件,具体包括:
从所述至少一个主题变量文件中,读取所述目标主题对应的目标变量文件。
可选地,所述初始主题文件为CSS文件,所述初始主题文件包括至少一个初始主题对应的主题模块,任一主题模块中存储相应初始主题对应的模板参数值以及可更换变量的第一参数值;所述主题变量文件为CSS文件,所述主题变量文件包括至少一个可更换主题对应的变量模块,任一变量模块中存储相应可更换主题对应的可更换变量的第二参数值;
相应地,所述从所述至少一个主题变量文件中,读取所述目标主题对应的目标变量文件,具体包括:
在所述变量模块中确定所述目标主题对应的目标变量模块,并从所述目标变量模块中读取所述可更换变量作为所述目标变量种类以及读取所述可更换变量的第二参数值作为所述变更值。
可选地,在所述初始主题文件包括多个主题模块的情况下,所述通过浏览器渲染所述初始主题文件,具体包括:
依据所述目标网页对应的历史设定主题或标准设定主题,在多个主题模块中选择一个作为目标主题模块;
通过所述浏览器渲染所述目标主题模块中的模板参数值以及可更换变量的第一参数值,以展示与所述历史设定主题或标准设定主题的风格匹配的目标网页。
可选地,所述响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题,具体包括:
响应于对目标网页的主题更换指令,展示所述目标网页对应的可更换主题选择界面,其中,所述可更换主题选择界面包括所述至少一个可更换主题对应的触发选项以及主题预览图;
当任一触发选项被选择时,将被选择的触发选项对应的可更换主题确定为所述目标主题。
可选地,所述变量模块中相应可更换主题对应的可更换变量的第二参数值包括多个固定值或所述第二参数值支持的取值范围;
所述读取所述目标主题对应的目标变量文件之后,所述方法还包括:
依据所述目标变量文件,展示所述目标主题对应的变量配置界面,其中,所述变量配置界面包括所述目标主题对应的第二参数值以及所述第二参数值对应的变量预览图;
基于接收到的对所述第二参数值的选择数据,确定所述目标变量文件对应的所述目标变量种类及其对应的所述变更值。
可选地,所述可更换变量包括所述目标网页的主题颜色、背景颜色、字体颜色、字体型号、字体大小、图标形状中至少一种。
根据本申请的另一方面,提供了一种网页主题更换装置,包括:
主题确定单元,用于响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题;
文件读取单元,用于读取所述目标主题对应的目标变量文件,其中,所述目标变量文件包括待更换的目标变量种类以及与所述目标变量种类对应的变更值;
变量编译单元,用于通过浏览器原生程序对已加载的网页样式文件进行编译,将已加载的网页样式文件中与所述目标变量种类对应的参数值更新为对应的所述变更值,以使所述网页样式文件与所述目标主题匹配;
变量加载单元,用于加载所述网页样式文件中与所述目标变量种类对应的参数值,以将所述目标主题应用于所述目标网页上。
可选地,所述装置还包括:
主题加载单元,用于所述响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题之前,基于对所述目标网页的请求指令,读取并加载所述网页样式文件,其中,所述网页样式文件包括初始主题文件以及至少一个主题变量文件;通过浏览器渲染所述初始主题文件,以展示与初始主题风格匹配的目标网页;
相应地,所述文件读取单元,具体用于:
从所述至少一个主题变量文件中,读取所述目标主题对应的目标变量文件。
可选地,所述初始主题文件为CSS文件,所述初始主题文件包括至少一个初始主题对应的主题模块,任一主题模块中存储相应初始主题对应的模板参数值以及可更换变量的第一参数值;所述主题变量文件为CSS文件,所述主题变量文件包括至少一个可更换主题对应的变量模块,任一变量模块中存储相应可更换主题对应的可更换变量的第二参数值;
相应地,所述文件读取单元,具体用于:
在所述变量模块中确定所述目标主题对应的目标变量模块,并从所述目标变量模块中读取所述可更换变量作为所述目标变量种类以及读取所述可更换变量的第二参数值作为所述变更值。
可选地,在所述初始主题文件包括多个主题模块的情况下,所述主题加载单元,具体用于:
依据所述目标网页对应的历史设定主题或标准设定主题,在多个主题模块中选择一个作为目标主题模块;通过所述浏览器渲染所述目标主题模块中的模板参数值以及可更换变量的第一参数值,以展示与所述历史设定主题或标准设定主题的风格匹配的目标网页。
可选地,所述主题确定单元,具体用于:
响应于对目标网页的主题更换指令,展示所述目标网页对应的可更换主题选择界面,其中,所述可更换主题选择界面包括所述至少一个可更换主题对应的触发选项以及主题预览图;当任一触发选项被选择时,将被选择的触发选项对应的可更换主题确定为所述目标主题。
可选地,所述变量模块中相应可更换主题对应的可更换变量的第二参数值包括多个固定值或所述第二参数值支持的取值范围;
所述装置还包括:
变量配置单元,用于所述读取所述目标主题对应的目标变量文件之后,依据所述目标变量文件,展示所述目标主题对应的变量配置界面,其中,所述变量配置界面包括所述目标主题对应的第二参数值以及所述第二参数值对应的变量预览图;基于接收到的对所述第二参数值的选择数据,确定所述目标变量文件对应的所述目标变量种类及其对应的所述变更值。
可选地,所述可更换变量包括所述目标网页的主题颜色、背景颜色、字体颜色、字体型号、字体大小、图标形状中至少一种。
依据本申请又一个方面,提供了一种存储介质,其上存储有计算机程序,所述程序被处理器执行时实现上述网页主题更换方法。
依据本申请再一个方面,提供了一种计算机设备,包括存储介质、处理器及存储在存储介质上并可在处理器上运行的计算机程序,所述处理器执行所述程序时实现上述网页主题更换方法。
借由上述技术方案,本申请提供的一种网页主题更换方法及装置、存储介质、计算机设备,响应于对目标网页的主题更换指令,确定需要进行更换的目标主题,并读取与目标主题对应的目标变量文件,从而依据目标变量文件中的目标变量种类及其对应的变更值,直接对已经加载的目标网页的网页样式文件相关程序字段进行修改,将目标变量种类的参数值更新为目标变量文件中规定的变更值,进而对更新后的目标变量种类参数值进行加载,实现在目标网页上应用目标主题。相比于现有技术中通过预编译器进行主题文件编译以生成整套目标主题的样式文件的方式,本申请实施例在“换肤”时直接对网页样式文件中的变量值进行更新,无需创建全量样式文件,减少了资源占用量,同时提高了页面刷新效率,缩短了“换肤”时间,有助于提升用户体验。
上述说明仅是本申请技术方案的概述,为了能够更清楚了解本申请的技术手段,而可依照说明书的内容予以实施,并且为了让本申请的上述和其它目的、特征和优点能够更明显易懂,以下特举本申请的具体实施方式。
附图说明
此处所说明的附图用来提供对本申请的进一步理解,构成本申请的一部分,本申请的示意性实施例及其说明用于解释本申请,并不构成对本申请的不当限定。在附图中:
图1示出了本申请实施例提供的一种网页主题更换方法的流程示意图;
图2示出了本申请实施例提供的另一种网页主题更换方法的流程示意图;
图3示出了本申请实施例提供的一种主题变更方法的示意图;
图4示出了本申请实施例提供的一种网页主题更换装置的结构示意图。
具体实施方式
下文中将参考附图并结合实施例来详细说明本申请。需要说明的是,在不冲突的情况下,本申请中的实施例及实施例中的特征可以相互组合。
在本实施例中提供了一种网页主题更换方法,如图1所示,该方法包括:
步骤101,响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题;
步骤102,读取所述目标主题对应的目标变量文件,其中,所述目标变量文件包括待更换的目标变量种类以及与所述目标变量种类对应的变更值;
步骤103,通过浏览器原生程序对已加载的网页样式文件进行编译,将已加载的网页样式文件中与所述目标变量种类对应的参数值变更为对应的所述变更值,以使所述网页样式文件与所述目标主题匹配;
步骤104,加载所述网页样式文件中与所述目标变量种类对应的参数值,以将所述目标主题应用于所述目标网页上。
本申请实施例提供了一种切换网页主题皮肤(主题风格)的方法,该方法可以应用于客户端中,例如手机、台式电脑、笔记本电脑、平板电脑等前端设备。在具体应用场景中,在客户端中打开目标网页时,目标网页可以按预定的初始主题进行展示,用户可以通过触发主题更换功能主动向客户端下发主题更换指令,也可以在目标网页的某些功能、或者下级页面被触发时产生主题更换指令。客户端响应于该指令,首先,确定预计对该目标网页进行更换的目标主题。然后,在预定的目录下读取与该目标主题对应的目标变量文件。其中,该目录下预先存储有与各可更换主题对应的变量文件,每个变量文件中具体包含与可更换主题匹配的变量种类以及各变量种类对应的变更值。例如目录下预存可更换主题的变更文件A和变量文件B,变量文件A中包含切换至主题A需要变更的变量种类以及每个变量种类对应的变更值,假设不同主题对应的主题颜色、字体型号不同,那么变量文件A中可以包含主题A对应的主题颜色值以及字体型号标识。
进一步,根据读取出来的目标变量文件中包含的目标变量种类以及对应的变更值,对已加载的网页样式文件中的相应参数进行更新。其中,网页样式文件为与目标网页匹配的主题配置文件,一般来说,网页样式文件为预先指定的目标网页初始主题的配置文件,网页样式文件中包含该目标网页对应的固定参数以及可配置参数(各可更换变量对应的参数),利用该初始主题文件即可实现对目标网页的主题配置,也即通过加载、渲染初始主题文件可以将目标网页配置成该初始主题的样式。读取目标变量种类以及对应的变更值以后,可以通过浏览器原生程序直接对网页样式文件进行编译,将文件中的目标变量种类对应的参数值修改为上述的变更值,例如网页样式文件中主题色变量原来为红色,将其更新为蓝色,以便实现对目标网页主题色的变更。相比于现有技术中通过预编译器对网页的样式文件进行重新编译的方式,本申请不必生成目标网页的全量样式文件,只需要对原有网页样式文件中部分变量的参数值进行修改即可,占用资源量小。最后加载该编译后的网页样式文件中目标变量种类的参数值,即可实现对目标网页的主题修改,将目标主题应用在目标网页上,以实现目标网页的“换肤”功能。
可选地,所述可更换变量包括所述目标网页的主题颜色、背景颜色、字体颜色、字体型号、字体大小、图标形状中至少一种。用户可根据实际需要选择对网页的主题颜色、背景颜色、字体颜色、字体型号、字体大小、图标形状等主题特征进行更改,本领域技术人员还可以配置更多的可更换变量,在此不做限定。
通过应用本实施例的技术方案,响应于对目标网页的主题更换指令,确定需要进行更换的目标主题,并读取与目标主题对应的目标变量文件,从而依据目标变量文件中的目标变量种类及其对应的变更值,直接对已经加载的目标网页的网页样式文件相关程序字段进行修改,将目标变量种类的参数值更新为目标变量文件中规定的变更值,进而对更新后的目标变量种类参数值进行加载,实现在目标网页上应用目标主题。本申请实施例相比于现有技术中通过预编译器进行主题文件编译以生成整套目标主题的样式文件的方式,“换肤”时直接对网页样式文件中的变量值进行更新,无需创建全量样式文件,减少了资源占用量,同时提高了页面刷新效率,缩短了“换肤”时间,有助于提升用户体验。
进一步的,作为上述实施例具体实施方式的细化和扩展,为了完整说明本实施例的具体实施过程,提供了另一种网页主题更换方法,如图2所示,该方法包括:
步骤201,基于对所述目标网页的请求指令,读取并加载所述网页样式文件,其中,所述网页样式文件包括初始主题文件以及至少一个主题变量文件;
在本申请实施例中,用户请求打开目标网页时,读取与该网页对应的预先配置好的网页样式文件,并加载网页样式文件,网页样式文件中包含初始主题文件以及主题变量文件,初始主题文件中包含目标网页对应的初始主题的完整主题文件,而主题变量文件仅包含目标网页的可更换主题对应的变量参数,例如网页主题中的变量包括主题颜色和背景颜色,那么主题变量文件包含相应的可更换主题的主题颜色参数和背景颜色参数。
可选地,所述初始主题文件为CSS文件,所述初始主题文件包括至少一个初始主题对应的主题模块,任一主题模块中存储相应初始主题对应的模板参数值以及可更换变量的第一参数值;所述主题变量文件为CSS文件,所述主题变量文件包括至少一个可更换主题对应的变量模块,任一变量模块中存储相应可更换主题对应的可更换变量的第二参数值;
在上述实施例中,初始主题可以包括多个,每个初始主题对应一个特定的主题模块,每个主题模块中存储相应初始主题中不可变更的模板部分即模板参数值,每个主题模块中还存储相应初始主题中可变更部分的参数值即第一参数值。另外,可更换主题也可以包括多个,每个可更换主题对应一个特定的变量模块,不同可更换主题对应的可更换变量的参数即第二参数值存储在对应的变量模块中。
步骤202,通过浏览器渲染所述初始主题文件,以展示与初始主题风格匹配的目标网页;
在步骤202中,可选地,依据所述目标网页对应的历史设定主题或标准设定主题,在多个主题模块中选择一个作为目标主题模块;通过所述浏览器渲染所述目标主题模块中的模板参数值以及可更换变量的第一参数值,以展示与所述历史设定主题或标准设定主题的风格匹配的目标网页。
在上述实施例中,依据预设的标准设定主题、或者用户对该目标网页的历史设定习惯,在多个主题模块中选择一个作为目标主题模块,并依据该目标主题模块进行渲染,通过浏览器渲染其中的目标参数值和可更换变量的第一参数值,以得到与目标主题模块的主题风格匹配的目标网页。
步骤203,响应于对目标网页的主题更换指令,展示所述目标网页对应的可更换主题选择界面,其中,所述可更换主题选择界面包括所述至少一个可更换主题对应的触发选项以及主题预览图;当任一触发选项被选择时,将被选择的触发选项对应的可更换主题确定为所述目标主题;
步骤204,读取所述目标主题对应的目标变量文件,依据所述目标变量文件,展示所述目标主题对应的变量配置界面,其中,所述变量配置界面包括所述目标主题对应的第二参数值以及所述第二参数值对应的变量预览图;基于接收到的对所述第二参数值的选择数据,确定所述目标变量文件对应的所述目标变量种类及其对应的所述变更值;
在本申请实施例中,可选地,所述变量模块中相应可更换主题对应的可更换变量的第二参数值包括多个固定值或所述第二参数值支持的取值范围。其中,每个变量模块中存储的每种可更换变量的第二参数值具体可以包括多个固定大小的可选参数值,也可以为第二参数值支持的取值范围,例如字体大小的参数值为10,对应的取值范围为5~15,以供用户个性化选择和配置。
在步骤203和步骤204中,当需要对目标网页的主题进行更换时,例如在网页上设置“换肤”功能按钮,用户点击按钮即生成主题更换指令,响应于该指令展示可更换主题选择界面,界面中可以包括预先设置好的多个可更换主题的触发选项以及相应的可更换主题的主题预览图,用户可以通过触发选项来选择其中一个作为要更换的目标主题。进一步,用户选择目标主题后,还可以展示对该目标主题的变量配置界面,界面中包括该目标主题中各变量的多种可选参数值以及与每种可选参数值各自对应的变量预览图,例如变量配置界面中包含多种可选的主题颜色参数值即多个第二参数值(或者可选范围即第二参数值支持的范围)以及对应的多种主题颜色预览图(或者可选范围内的多种预览效果图),相应的,用户可以通过选择其中的任意一个固定的第二参数值作为相应目标变量种类的变更值(或在范围内配置任意值作为变更值)。
需要说明的是,若目标变量模块中的可更换变量只对应一个第二参数值,那么步骤204可替换为:在所述变量模块中确定所述目标主题对应的目标变量模块,并从所述目标变量模块中读取所述可更换变量作为所述目标变量种类以及读取所述可更换变量的第二参数值作为所述变更值。
步骤205,通过浏览器原生程序对已加载的网页样式文件进行编译,将已加载的网页样式文件中与所述目标变量种类对应的参数值更新为对应的所述变更值,以使所述网页样式文件与所述目标主题匹配;
在步骤205中,对于目标变量模块中每个可更换变量只对应一个第二参数值的情况,直接依据读取的目标变量文件对网页样式文件进行编译。对于目标变量模块中可更换变量对应多个第二参数值或对应一个取值范围的情况,依据用户的选择、配置结果确定更新目标变量文件后,再对网页样式文件进行编译。图3示出了本申请实施例提供的一种主题变更方法的示意图,其中,主题文件即上文中的初始主题文件,主题文件具体包括多个主题模块(例如主题A模块、主题B模块)和配置项,主题模块中包含每种初始主题的模板参数值和可更换变量的第一参数值,配置项用于在“换肤”时对主题模块中的第一参数值进行配置。样式文件即上文中的主题变量文件,包括多个变量模块,每个变量模块中包括一种可更换主题的可更换变量的第二参数值。
在对目标网页进行“换肤”时,只需依据目标主题对应的变量模块中存储的第二参数值,直接对主题文件中的相关参数进行修改、更新即可,无需重新编译与目标主题对应的全量主题文件,工作量大大减小,且不需要针对不同主题生成各自的全量主题文件,也减小的资源占用量,同时,不同主题切换时,由于修改量小,也有助于缩短浏览器加载、渲染的时间,加快了“换肤”速度,提升用户体验。
步骤206,加载所述网页样式文件中与所述目标变量种类对应的参数值,以将所述目标主题应用于所述目标网页上。
在步骤206中,将编译后的网页样式文件中相应种类目标变量的参数值进行加载,并利用浏览器进行渲染,最终将目标主题应用到目标网页上得到用户需要的“换肤”效果。
进一步的,作为图1方法的具体实现,本申请实施例提供了一种网页主题更换装置,如图4所示,该装置包括:
主题确定单元,用于响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题;
文件读取单元,用于读取所述目标主题对应的目标变量文件,其中,所述目标变量文件包括待更换的目标变量种类以及与所述目标变量种类对应的变更值;
变量编译单元,用于通过浏览器原生程序对已加载的网页样式文件进行编译,将已加载的网页样式文件中与所述目标变量种类对应的参数值更新为对应的所述变更值,以使所述网页样式文件与所述目标主题匹配;
变量加载单元,用于加载所述网页样式文件中与所述目标变量种类对应的参数值,以将所述目标主题应用于所述目标网页上。
可选地,所述装置还包括:
主题加载单元,用于所述响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题之前,基于对所述目标网页的请求指令,读取并加载所述网页样式文件,其中,所述网页样式文件包括初始主题文件以及至少一个主题变量文件;通过浏览器渲染所述初始主题文件,以展示与初始主题风格匹配的目标网页;
相应地,所述文件读取单元,具体用于:
从所述至少一个主题变量文件中,读取所述目标主题对应的目标变量文件。
可选地,所述初始主题文件为CSS文件,所述初始主题文件包括至少一个初始主题对应的主题模块,任一主题模块中存储相应初始主题对应的模板参数值以及可更换变量的第一参数值;所述主题变量文件为CSS文件,所述主题变量文件包括至少一个可更换主题对应的变量模块,任一变量模块中存储相应可更换主题对应的可更换变量的第二参数值;
相应地,所述文件读取单元,具体用于:
在所述变量模块中确定所述目标主题对应的目标变量模块,并从所述目标变量模块中读取所述可更换变量作为所述目标变量种类以及读取所述可更换变量的第二参数值作为所述变更值。
可选地,在所述初始主题文件包括多个主题模块的情况下,所述主题加载单元,具体用于:
依据所述目标网页对应的历史设定主题或标准设定主题,在多个主题模块中选择一个作为目标主题模块;通过所述浏览器渲染所述目标主题模块中的模板参数值以及可更换变量的第一参数值,以展示与所述历史设定主题或标准设定主题的风格匹配的目标网页。
可选地,所述主题确定单元,具体用于:
响应于对目标网页的主题更换指令,展示所述目标网页对应的可更换主题选择界面,其中,所述可更换主题选择界面包括所述至少一个可更换主题对应的触发选项以及主题预览图;当任一触发选项被选择时,将被选择的触发选项对应的可更换主题确定为所述目标主题。
可选地,所述变量模块中相应可更换主题对应的可更换变量的第二参数值包括多个固定值或所述第二参数值支持的取值范围;
所述装置还包括:
变量配置单元,用于所述读取所述目标主题对应的目标变量文件之后,依据所述目标变量文件,展示所述目标主题对应的变量配置界面,其中,所述变量配置界面包括所述目标主题对应的第二参数值以及所述第二参数值对应的变量预览图;基于接收到的对所述第二参数值的选择数据,确定所述目标变量文件对应的所述目标变量种类及其对应的所述变更值。
可选地,所述可更换变量包括所述目标网页的主题颜色、背景颜色、字体颜色、字体型号、字体大小、图标形状中至少一种。
需要说明的是,本申请实施例提供的一种网页主题更换装置所涉及各功能单元的其他相应描述,可以参考图1至图2方法中的对应描述,在此不再赘述。
基于上述如图1至图2所示方法,相应的,本申请实施例还提供了一种存储介质,其上存储有计算机程序,该计算机程序被处理器执行时实现上述如图1至图2所示的网页主题更换方法。
基于这样的理解,本申请的技术方案可以以软件产品的形式体现出来,该软件产品可以存储在一个非易失性存储介质(可以是CD-ROM,U盘,移动硬盘等)中,包括若干指令用以使得一台计算机设备(可以是个人计算机,服务器,或者网络设备等)执行本申请各个实施场景所述的方法。
基于上述如图1至图2所示的方法,以及图4所示的虚拟装置实施例,为了实现上述目的,本申请实施例还提供了一种计算机设备,具体可以为个人计算机、服务器、网络设备等,该计算机设备包括存储介质和处理器;存储介质,用于存储计算机程序;处理器,用于执行计算机程序以实现上述如图1至图2所示的网页主题更换方法。
可选地,该计算机设备还可以包括用户接口、网络接口、摄像头、射频(RadioFrequency,RF)电路,传感器、音频电路、WI-FI模块等等。用户接口可以包括显示屏(Display)、输入单元比如键盘(Keyboard)等,可选用户接口还可以包括USB接口、读卡器接口等。网络接口可选的可以包括标准的有线接口、无线接口(如蓝牙接口、WI-FI接口)等。
本领域技术人员可以理解,本实施例提供的一种计算机设备结构并不构成对该计算机设备的限定,可以包括更多或更少的部件,或者组合某些部件,或者不同的部件布置。
存储介质中还可以包括操作系统、网络通信模块。操作系统是管理和保存计算机设备硬件和软件资源的程序,支持信息处理程序以及其它软件和/或程序的运行。网络通信模块用于实现存储介质内部各组件之间的通信,以及与该实体设备中其它硬件和软件之间通信。
通过以上的实施方式的描述,本领域的技术人员可以清楚地了解到本申请可以借助软件加必要的通用硬件平台的方式来实现,也可以通过硬件实现响应于对目标网页的主题更换指令,确定需要进行更换的目标主题,并读取与目标主题对应的目标变量文件,从而依据目标变量文件中的目标变量种类及其对应的变更值,直接对已经加载的目标网页的网页样式文件相关程序字段进行修改,将目标变量种类的参数值更新为目标变量文件中规定的变更值,进而对更新后的目标变量种类参数值进行加载,实现在目标网页上应用目标主题。本申请实施例相比于现有技术中,通过预编译器进行主题文件编译以生成整套目标主题的样式文件的方式,“换肤”时直接对网页样式文件中的变量值进行更新,无需创建全量样式文件,减少了资源占用量,同时提高了页面刷新效率,缩短了“换肤”时间,有助于提升用户体验。
本领域技术人员可以理解附图只是一个优选实施场景的示意图,附图中的模块或流程并不一定是实施本申请所必须的。本领域技术人员可以理解实施场景中的装置中的模块可以按照实施场景描述进行分布于实施场景的装置中,也可以进行相应变化位于不同于本实施场景的一个或多个装置中。上述实施场景的模块可以合并为一个模块,也可以进一步拆分成多个子模块。
上述本申请序号仅仅为了描述,不代表实施场景的优劣。以上公开的仅为本申请的几个具体实施场景,但是,本申请并非局限于此,任何本领域的技术人员能思之的变化都应落入本申请的保护范围。
Claims (10)
1.一种网页主题更换方法,其特征在于,包括:
响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题;
读取所述目标主题对应的目标变量文件,其中,所述目标变量文件包括待更换的目标变量种类以及与所述目标变量种类对应的变更值;
通过浏览器原生程序对已加载的网页样式文件进行编译,将已加载的网页样式文件中与所述目标变量种类对应的参数值更新为对应的所述变更值,以使所述网页样式文件与所述目标主题匹配;
加载所述网页样式文件中与所述目标变量种类对应的参数值,以将所述目标主题应用于所述目标网页上。
2.根据权利要求1所述的方法,其特征在于,所述响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题之前,所述方法还包括:
基于对所述目标网页的请求指令,读取并加载所述网页样式文件,其中,所述网页样式文件包括初始主题文件以及至少一个主题变量文件;
通过浏览器渲染所述初始主题文件,以展示与初始主题风格匹配的目标网页;
相应地,所述读取所述目标主题对应的目标变量文件,具体包括:
从所述至少一个主题变量文件中,读取所述目标主题对应的目标变量文件。
3.根据权利要求2所述的方法,其特征在于,
所述初始主题文件为CSS文件,所述初始主题文件包括至少一个初始主题对应的主题模块,任一主题模块中存储相应初始主题对应的模板参数值以及可更换变量的第一参数值;所述主题变量文件为CSS文件,所述主题变量文件包括至少一个可更换主题对应的变量模块,任一变量模块中存储相应可更换主题对应的可更换变量的第二参数值;
相应地,所述从所述至少一个主题变量文件中,读取所述目标主题对应的目标变量文件,具体包括:
在所述变量模块中读取所述目标主题对应的目标变量模块,并从所述目标变量模块中读取所述可更换变量作为所述目标变量种类以及读取所述可更换变量的第二参数值作为所述变更值。
4.根据权利要求3所述的方法,其特征在于,在所述初始主题文件包括多个主题模块的情况下,所述通过浏览器渲染所述初始主题文件,具体包括:
依据所述目标网页对应的历史设定主题或标准设定主题,在多个主题模块中选择一个作为目标主题模块;
通过所述浏览器渲染所述目标主题模块中的模板参数值以及可更换变量的第一参数值,以展示与所述历史设定主题或标准设定主题的风格匹配的目标网页。
5.根据权利要求3所述的方法,其特征在于,所述响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题,具体包括:
响应于对目标网页的主题更换指令,展示所述目标网页对应的可更换主题选择界面,其中,所述可更换主题选择界面包括所述至少一个可更换主题对应的触发选项以及主题预览图;
当任一触发选项被选择时,将被选择的触发选项对应的可更换主题确定为所述目标主题。
6.根据权利要求5所述的方法,其特征在于,所述变量模块中相应可更换主题对应的可更换变量的第二参数值包括多个固定值或所述第二参数值支持的取值范围;所述读取所述目标主题对应的目标变量文件之后,所述方法还包括:
依据所述目标变量文件,展示所述目标主题对应的变量配置界面,其中,所述变量配置界面包括所述目标主题对应的第二参数值以及所述第二参数值对应的变量预览图;
基于接收到的对所述第二参数值的选择数据,确定所述目标变量文件对应的所述目标变量种类及其对应的所述变更值。
7.根据权利要求3所述的方法,其特征在于,所述可更换变量包括所述目标网页的主题颜色、背景颜色、字体颜色、字体型号、字体大小、图标形状中至少一种。
8.一种网页主题更换装置,其特征在于,包括:
主题确定单元,用于响应于对目标网页的主题更换指令,确定所述目标网页对应的待更换的目标主题;
文件读取单元,用于读取所述目标主题对应的目标变量文件,其中,所述目标变量文件包括待更换的目标变量种类以及与所述目标变量种类对应的变更值;
变量编译单元,用于通过浏览器原生程序对已加载的网页样式文件进行编译,将已加载的网页样式文件中与所述目标变量种类对应的参数值更新为对应的所述变更值,以使所述网页样式文件与所述目标主题匹配;
变量加载单元,用于加载所述网页样式文件中与所述目标变量种类对应的参数值,以将所述目标主题应用于所述目标网页上。
9.一种存储介质,其上存储有计算机程序,其特征在于,所述计算机程序被处理器执行时实现权利要求1至7中任一项所述的方法。
10.一种计算机设备,包括存储介质、处理器及存储在存储介质上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述计算机程序时实现权利要求1至7中任一项所述的方法。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111127709.4A CN113569171A (zh) | 2021-09-26 | 2021-09-26 | 网页主题更换方法及装置、存储介质、计算机设备 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202111127709.4A CN113569171A (zh) | 2021-09-26 | 2021-09-26 | 网页主题更换方法及装置、存储介质、计算机设备 |
Publications (1)
Publication Number | Publication Date |
---|---|
CN113569171A true CN113569171A (zh) | 2021-10-29 |
Family
ID=78174554
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202111127709.4A Pending CN113569171A (zh) | 2021-09-26 | 2021-09-26 | 网页主题更换方法及装置、存储介质、计算机设备 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN113569171A (zh) |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114911561A (zh) * | 2022-05-26 | 2022-08-16 | 平安普惠企业管理有限公司 | 系统主题的切换方法、装置、计算机设备和存储介质 |
CN115686723A (zh) * | 2022-11-11 | 2023-02-03 | 北京百度网讯科技有限公司 | 主题样式文件生成方法、装置、设备、存储介质及产品 |
Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105117469A (zh) * | 2015-08-28 | 2015-12-02 | 无锡天脉聚源传媒科技有限公司 | 一种个性化替换网页主题的方法及装置 |
CN108228677A (zh) * | 2016-12-22 | 2018-06-29 | 北京国双科技有限公司 | 切换网站主题风格的方法和装置 |
WO2018176207A1 (zh) * | 2017-03-28 | 2018-10-04 | 深圳中兴力维技术有限公司 | Web主题切换方法及系统 |
CN111131352A (zh) * | 2018-10-31 | 2020-05-08 | 北京国双科技有限公司 | 主题切换方法及装置 |
CN111666123A (zh) * | 2020-05-28 | 2020-09-15 | 平安医疗健康管理股份有限公司 | 页面主题控制方法、系统和计算机设备 |
CN112099790A (zh) * | 2020-09-10 | 2020-12-18 | 北京百度网讯科技有限公司 | 确定页面主题的方法、装置、设备以及存储介质 |
-
2021
- 2021-09-26 CN CN202111127709.4A patent/CN113569171A/zh active Pending
Patent Citations (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN105117469A (zh) * | 2015-08-28 | 2015-12-02 | 无锡天脉聚源传媒科技有限公司 | 一种个性化替换网页主题的方法及装置 |
CN108228677A (zh) * | 2016-12-22 | 2018-06-29 | 北京国双科技有限公司 | 切换网站主题风格的方法和装置 |
WO2018176207A1 (zh) * | 2017-03-28 | 2018-10-04 | 深圳中兴力维技术有限公司 | Web主题切换方法及系统 |
CN111131352A (zh) * | 2018-10-31 | 2020-05-08 | 北京国双科技有限公司 | 主题切换方法及装置 |
CN111666123A (zh) * | 2020-05-28 | 2020-09-15 | 平安医疗健康管理股份有限公司 | 页面主题控制方法、系统和计算机设备 |
CN112099790A (zh) * | 2020-09-10 | 2020-12-18 | 北京百度网讯科技有限公司 | 确定页面主题的方法、装置、设备以及存储介质 |
Cited By (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114911561A (zh) * | 2022-05-26 | 2022-08-16 | 平安普惠企业管理有限公司 | 系统主题的切换方法、装置、计算机设备和存储介质 |
CN115686723A (zh) * | 2022-11-11 | 2023-02-03 | 北京百度网讯科技有限公司 | 主题样式文件生成方法、装置、设备、存储介质及产品 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
TWI808393B (zh) | 頁面處理方法、裝置、設備及儲存媒體 | |
EP3531257B1 (en) | Application interface management method and apparatus | |
US7660604B2 (en) | Mobile terminal | |
CN113569171A (zh) | 网页主题更换方法及装置、存储介质、计算机设备 | |
CN112925520A (zh) | 可视化页面的搭建方法、装置及计算机设备 | |
CN112016023A (zh) | 业务处理方法、装置、终端及存储介质 | |
CN112783783A (zh) | 网页埋点方法、装置、设备及可读存储介质 | |
CN114185465A (zh) | 信息处理方法、装置、存储介质和电子设备 | |
CN113190152A (zh) | 切换应用程序主题的方法和装置 | |
CN112068873A (zh) | 网页生成方法、装置、服务器及存储介质 | |
CN112306488A (zh) | 组合图标生成方法、装置、设备与计算机可读存储介质 | |
CN105159673A (zh) | 一种设置控件样式的方法和装置 | |
EP3627313B1 (en) | Method and system for operating a software application on a processor of a mobile device | |
CN114995699B (zh) | 一种界面交互方法及装置 | |
CN115282598A (zh) | 数据处理系统及方法 | |
CN110874220A (zh) | 游戏应用程序中的功能集成方法、设备和存储介质 | |
CN116127219A (zh) | 小程序中页面的展示方法、装置和计算机设备 | |
CN115146600A (zh) | 表单的生成方法、装置、存储介质及计算机设备 | |
CN113835578A (zh) | 显示方法、装置及电子设备 | |
CN112015507A (zh) | 一种应用引导方法和装置 | |
JP7184410B1 (ja) | アプリケーション開発の支援装置 | |
CN109669750A (zh) | 一种图标显示方法及终端、存储介质 | |
WO2023066095A1 (zh) | 一种渲染方法及相关装置 | |
KR102592913B1 (ko) | 사용자 맞춤형의 글자체 정보를 제공하기 위한 장치 및 방법 | |
CN113672836B (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 |