CN113158101A - 一种可视化页面渲染方法、装置、设备及存储介质 - Google Patents
一种可视化页面渲染方法、装置、设备及存储介质 Download PDFInfo
- Publication number
- CN113158101A CN113158101A CN202011634449.5A CN202011634449A CN113158101A CN 113158101 A CN113158101 A CN 113158101A CN 202011634449 A CN202011634449 A CN 202011634449A CN 113158101 A CN113158101 A CN 113158101A
- Authority
- CN
- China
- Prior art keywords
- source data
- page
- data
- div
- template
- 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
Links
- 238000000034 method Methods 0.000 title claims abstract description 72
- 238000009877 rendering Methods 0.000 title claims abstract description 69
- 230000000007 visual effect Effects 0.000 title claims abstract description 34
- 238000005192 partition Methods 0.000 claims abstract description 47
- 239000012634 fragment Substances 0.000 claims description 42
- 238000012800 visualization Methods 0.000 claims description 14
- 238000004590 computer program Methods 0.000 claims description 8
- 238000013461 design Methods 0.000 abstract description 5
- 230000006870 function Effects 0.000 description 10
- 238000004458 analytical method Methods 0.000 description 6
- 230000003287 optical effect Effects 0.000 description 6
- 238000010586 diagram Methods 0.000 description 5
- 238000012545 processing Methods 0.000 description 5
- 238000011161 development Methods 0.000 description 3
- 230000005540 biological transmission Effects 0.000 description 2
- 239000013307 optical fiber Substances 0.000 description 2
- 230000002093 peripheral effect Effects 0.000 description 2
- 230000000644 propagated effect Effects 0.000 description 2
- 238000003491 array Methods 0.000 description 1
- 230000009286 beneficial effect Effects 0.000 description 1
- 238000004422 calculation algorithm Methods 0.000 description 1
- 238000006243 chemical reaction Methods 0.000 description 1
- 238000004891 communication Methods 0.000 description 1
- 230000007547 defect Effects 0.000 description 1
- 238000012986 modification Methods 0.000 description 1
- 230000004048 modification Effects 0.000 description 1
- 238000007781 pre-processing Methods 0.000 description 1
- 230000008707 rearrangement Effects 0.000 description 1
- 238000012827 research and development Methods 0.000 description 1
- 239000004065 semiconductor Substances 0.000 description 1
- 238000000638 solvent extraction Methods 0.000 description 1
- 238000006467 substitution reaction Methods 0.000 description 1
- 238000012360 testing method Methods 0.000 description 1
- 238000012795 verification Methods 0.000 description 1
Images
Classifications
-
- 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/14—Tree-structured documents
- G06F40/143—Markup, e.g. Standard Generalized Markup Language [SGML] or Document Type Definition [DTD]
-
- 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/957—Browsing optimisation, e.g. caching or content distillation
- G06F16/9577—Optimising the visualization of content, e.g. distillation of HTML documents
-
- 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
- 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
- G06F16/986—Document structures and storage, e.g. HTML extensions
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/103—Formatting, i.e. changing of presentation of documents
- G06F40/106—Display of layout of documents; Previewing
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/103—Formatting, i.e. changing of presentation of documents
- G06F40/117—Tagging; Marking up; Designating a block; Setting of attributes
-
- 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/131—Fragmentation of text files, e.g. creating reusable text-blocks; Linking to fragments, e.g. using XInclude; Namespaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F40/00—Handling natural language data
- G06F40/10—Text processing
- G06F40/166—Editing, e.g. inserting or deleting
- G06F40/186—Templates
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Databases & Information Systems (AREA)
- Physics & Mathematics (AREA)
- General Engineering & Computer Science (AREA)
- General Physics & Mathematics (AREA)
- Data Mining & Analysis (AREA)
- Artificial Intelligence (AREA)
- Health & Medical Sciences (AREA)
- Audiology, Speech & Language Pathology (AREA)
- Computational Linguistics (AREA)
- General Health & Medical Sciences (AREA)
- Information Transfer Between Computers (AREA)
- Document Processing Apparatus (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
- User Interface Of Digital Computer (AREA)
Abstract
本发明实施例公开了一种可视化页面渲染方法、装置、设备及存储介质。该方法包括:获取当前页面源数据;识别所述当前页面源数据中的自定义模板源数据;将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;基于所述第一待显示页面数据进行页面的渲染显示。通过本发明的技术方案,能够在可视化页面设计中增加自定义模板,以满足用户的各种需求,并根据浏览器的兼容性对自定义模板源数据进行渲染,提高可视化页面的兼容性,实现快速加载和渲染可视化页面。
Description
技术领域
本发明实施例涉及计算机技术领域,尤其涉及一种可视化页面渲染方法、装置、设备及存储介质。
背景技术
随着移动互联网的快速发展和智能手机的全面普及,人们的生活方式和消费模式发生了巨大变化。通过最新修订版本的超文本标记语言(HTML5,Hyper Markup Language5)设计网页成为各大企业宣传品牌形象和吸引受众群体关注的重要途径。
在实现本发明的过程中,发现现有技术中至少存在以下技术问题:在设计网页时,现有的模板往往不能适配不同业务需求场景,无法满足用户多样的业务需求。因此,需要在页面搭建过程中添加自定义模板。但是,自定义模板一般较为复杂,无法通过VUE前端框架实现页面渲染。使用iframe框架渲染页面的方法存在很多缺点,例如网页加载速度慢、易出现局部混乱、兼容性较差,不适用于对添加的自定义模板进行渲染。
发明内容
本发明实施例提供一种可视化页面渲染方法、装置、设备及存储介质,以实现能够对自定义模板源数据进行渲染显示,提高可视化页面的兼容性,实现快速加载和渲染可视化页面。
第一方面,本发明实施例提供了一种可视化页面渲染方法,包括:
获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据;
识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据;
将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;
获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;
基于所述第一待显示页面数据进行页面的渲染显示。
第二方面,本发明实施例还提供了一种可视化页面渲染装置,该装置包括:
第一获取模块,用于获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据;
识别模块,用于识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据;
第一确定模块,用于将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;
第一添加模块,用于获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;
第一显示模块,用于基于所述第一待显示页面数据进行页面的渲染显示。
第三方面,本发明实施例还提供了一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,所述处理器执行所述程序时实现如本发明实施例中任一所述的可视化页面渲染方法。
第四方面,本发明实施例还提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时实现如本发明实施例中任一所述的可视化页面渲染方法。
本发明实施例通过识别所述当前页面源数据中的自定义模板源数据,将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;基于所述第一待显示页面数据进行页面的渲染显示,能够在可视化页面设计中增加自定义模板,以满足用户的多样的业务需求。并根据浏览器的兼容性对自定义模板源数据进行渲染,提高可视化页面的兼容性,实现快速加载和渲染可视化页面。
附图说明
为了更清楚地说明本发明实施例的技术方案,下面将对实施例中所需要使用的附图作简单地介绍,应当理解,以下附图仅示出了本发明的某些实施例,因此不应被看作是对范围的限定,对于本领域普通技术人员来讲,在不付出创造性劳动的前提下,还可以根据这些附图获得其他相关的附图。
图1是本发明实施例一中的一种可视化页面渲染方法的流程图;
图2a是本发明实施例二中的一种可视化页面渲染方法的流程图;
图2b是本发明实施例二中的另一种可视化页面渲染方法的流程图;
图3是本发明实施例三中的一种可视化页面渲染装置的结构示意图;
图4是本发明实施例四中的一种计算机设备的结构示意图。
具体实施方式
下面结合附图和实施例对本发明作进一步的详细说明。可以理解的是,此处所描述的具体实施例仅仅用于解释本发明,而非对本发明的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与本发明相关的部分而非全部结构。
应注意到:相似的标号和字母在下面的附图中表示类似项,因此,一旦某一项在一个附图中被定义,则在随后的附图中不需要对其进行进一步定义和解释。同时,在本发明的描述中,术语“第一”、“第二”等仅用于区分描述,而不能理解为指示或暗示相对重要性。
实施例一
图1为本发明实施例一提供的一种可视化页面渲染方法的流程图,本实施例可适用于在待显示页面的页面源数据中包含自定义模板源数据时,对待显示页面进行渲染显示的情况,该方法可以由本发明实施例中的可视化页面渲染装置来执行,该装置可采用软件和/或硬件的方式实现,如图1所示,该方法具体包括如下步骤:
S110,获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据。
可视化页面一般由多个模块组成,通常每个模块展现一种功能,对克石化的页面进行功能分区,例如标题模块、内容模板、主菜单模块等。每个模块的可以由多个模板搭建而成。从服务器获取待显示页面中的各模块分别对应的HTML文件中的数据。
页面数据在下载和传输的过程中可能会发生错误,为了保证获取当前页面源数据的完整性和正确性,在获取当前页面源数据后,采用消息摘要算法(Message-DigestAlgorithm 5,MD5)对当前页面源数据进行校验。MD5是一种广泛使用的散列函数,可以作为一个文件的唯一指纹码。MD5的基本原理是通过对当前页面源数据执行散列运算生成MD5校验码,若MD5校验码和页面源数据附带的MD5码相同,则表示接收的传输数据完整正确,若MD5校验码和传输数据附带的MD5码不同,则需要重新获取当前页面源数据。
一般获取的当前页面源数据是经过encodeURIComponent编码的数据,encodeURIComponent用于将除了字母、数字、“(”、“)”、“.”、“!”、“~”、“*”、“'”、“-”和“_”之外的所有字符转义成变换编码(Unicode TransformationFormat-8bit,utf-8)格式的统一资源定位符URL。因此还需要调用decodeURIComponent函数对当前页面源数据进行数据解码。
S120,识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据。
当前页面源数据包括至少一个自定义模板源数据,还可以包括至少一个常规模板源数据,其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据。对待显示页面中的各模块分别对应的HTML文件中的数据采用从上至下的解析顺序依次进行加载渲染。但是,基于浏览器渲染的原理,无法对引用外部资源的SCRIPT标签进行加载渲染,因此,需要识别出自定义模板数据,对自定义模板数据中包含src属性的SCRIPT标签进行处理。
具体的,识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据。其中,模板标识可以为模板ID,作为模板的唯一标识,所述模板ID在模板制作过程中由服务器分配。文件类型表示模板的类型,例如,“auto-banner”表示轮播模板,“slide-column”表示滑动模板,“anchor-nav”表示锚定导航模板,“custom-def”表示自定义模板。
S130,将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合。
其中,在HTML文件中的DIV标签称为区隔标记,在HTML中记为<div>,是一个块级元素,用于定义文档中的分区或节。DIV标签具有纯洁性,即不具有默认的外边距margin标签和内边距padding标签,所述margin标签表示不同元素间的距离,所述padding标签表示元素的内容与元素边框的距离。因此,将自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,更容易控制自定义模板源数据的显示布局。
具体的,将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,即将所述自定义模板源数据添加到<div>和</div>之间。将所述DIV标签中自定义模板源数据的子节点确定为子节点集合ChildNodes,所述子节点集合表示一个有序的节点列表。子节点集合包括文本节点和元素节点。
S140,获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据。
具体的,获取所述子节点集合ChildNodes中的SCRIPT标签中src属性所引用的外部资源,所述src属性规定外部脚本文件的统一资源定位符URL,外部资源可以为js文件,即网页Java Script客户端脚本文件。将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据。若包含多个外部资源,则按照外部资源的位置从上至下依次添加到所述DIV标签中。
示例性的,子节点集合childNodes中的SCRIPT标签中的内容可以为<script src="http://www.example.com/example.js"></script>,或者可以为<script src="/scripts/example.js"></script>。则将example.js的内容添加到所述DIV标签中,得到第一待显示页面数据。
S150,基于所述第一待显示页面数据进行页面的渲染显示。
具体的,基于所述第一待显示页面数据进行渲染并显示在浏览器上。
本实施例的技术方案,通过识别所述当前页面源数据中的自定义模板源数据,将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;基于所述第一待显示页面数据进行页面的渲染显示,能够在可视化页面设计中增加自定义模板,以满足用户的多样的业务需求。
实施例二
图2a为本发明实施例二中的一种可视化页面渲染方法的流程图,本实施例二在实施例一的基础上做出进一步地优化。如图2a所示,所述方法包括:
S210,获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据。
S220,从各所述HTML文件中分别读取模板标识和所述模板标识对应的文件类型。
当前页面源数据包括至少一个自定义模板源数据,还可以包括至少一个常规模板源数据,其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据。对于常规模板数据可以采用现有技术中常规的HTML渲染方法进行渲染显示,但是对于引用了外部资源的自定义模板源数据,由于不同的浏览器的兼容性不同,需要采用不同的渲染方法,以实现快速加载和渲染可视化页面,进而首先需要从当前页面源数据中识别出自定义模板数据。
具体的,采用document.createElement('INPUT')函数获取当前页面源数据的INPUT标签,采用input.id和input.type分别获取模板标识ID和模板ID对应的文件类型。
示例性的,当前页面源数据的INPUT标签为<input id="template1"type="auto-banner">;<input id="template2"type="custom-def">。
S230,将所对应的文件类型为目标类型的模板标识确定为自定义模板标识,将所述自定义模板标识对应的HTML文件中的数据确定为自定义模板源数据。
具体的,目标类型为自定义模板的类型,类型名称定义为custom-def;若所述模板标识对应的文件类型为custom-def,则确定所述模板标识对应的模板为自定义模板。其中,自定义模板的类型名称可以根据用户需求设定,用于区别自定义模板和其他常规模板,例如滑动模板,轮播模板等。
S240,确定当前浏览器是否支持调用创建文档碎片方法。
具体的,通过查询浏览器的兼容模式确定当前浏览器是否支持调用创建文档碎片createContextualFragment方法。在IE10+版本浏览器上支持调用创建文档碎片方法,而IE9版本或者iOS9系统及以下版本的浏览器不支持创建文档碎片createContextualFragment方法。若支持调用创建文档碎片方法,则执行步骤S250~S255;若不支持调用创建文档碎片方法,则执行步骤S260~S263。
S250,若支持调用创建文档碎片方法,则通过调用所述创建文档碎片方法获取所述自定义模板源数据的元素集合,其中,所述创建文档碎片方法用于将所述自定义模板源数据分析为文档碎片DocumentFragment并基于所述文档碎片获得所述自定义模板源数据的元素集合。
具体的,通过调用所述创建文档碎片方法获取所述自定义模板源数据的元素集合HTMLCollection,所述HTMLCollection中包含自定义模板源数据的所有根节点标签和元素,根节点标签包括SCRIPT标签、LINK标签和DIV标签。
S251,对所述元素集合进行遍历以确定SCRIPT标签。
具体的,对HTMLCollection进行遍历确定SCRIPT标签和所述SCRIPT标签的元素。
S252,加载所述SCRIPT标签所引用的外部资源。
具体的,使用node.onload()方法加载所述SCRIPT标签的src属性所引用的外部资源,所述外部资源为采用js格式的封装文件。js文件会有相互依赖,多个js文件在相互依赖的情况下会有加载顺序,该情况就需要使用队列按照从上到下的顺序依次来实现js文件加载。
S253,创建文档分区。
具体的,js文件一般数据量较大,在网页中直接上传大文件会面临许多问题,一是,上传时间长中途一旦出错会导致前功尽弃,二是服务端配置复杂,要考虑接收超大表单和超时问题。若把大文件分割成小片段加载再合并,一旦上传失败只是损失一个分片,不用整个文件重传。因此,调用let docF:DocumentFragment=document.createDocumentFragment()函数创建至少一个新空白的文档分区,即DocumentFragment。
S254,将所述外部资源依次添加到所述文档分区中。
具体的,将所述外部资源依次添加到所述文档分区中。因为文档片段存在于内存中,并不在DOM树中,所以将子元素插入到文档分区时不会引起页面回流,以优化性能。
S255,将所述文档分区添加至所述当前页面源数据得到第二待显示页面数据,并基于所述第二待显示页面数据进行页面的渲染显示。
具体的,将所述文档分区中的所有子节点通过appendChild添加至所述当前页面源数据得到第二待显示页面数据。这个操作仅发生一个重渲染的操作,而不是每个节点分别被插入到文档中,可以避免多次重渲染的操作。
S260,若不支持调用创建文档碎片方法,则触发执行S261中将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中的操作。
具体的,若不支持调用创建文档碎片方法,则无法调用所述创建文档碎片方法获取所述自定义模板源数据的元素集合HTMLCollection,因此,发送指令以触发执行将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中的操作,以实现获取所述自定义模板源数据的子节点集合。
S261,将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合。
可选的,所述将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合,包括:
在当前页面源数据中创建区隔DIV标签;
将所述自定义模板源数据的根标签元素添加到所述DIV标签中;
根据所述根标签元素确定所述DIV标签中的子节点集合。
具体的,采用document.createElement("div")函数创建一个空白的DIV标签,调用innerHTML函数将所述自定义模板源数据的根标签元素添加到空白的DIV标签中,确定所述自定义模板源数据的根标签元素的子节点集合childNodes。所述子节点集合包括文本节点和元素节点。
可选的,在所述将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中之前,还包括:
通过正则匹配确定所述自定义模板源数据中的错误单标签;
对所述错误单标签进行修改。
具体的,对于html、head、body等双标签在自定义模板源数据中是单标签,则无法执行加载。采用正则匹配方法singleRE.test()确定所述自定义模板源数据中的错误单标签,正则表达式为singleRE=/^<(\w+)\s*\/?>(?:<\/\1>|)$/。对所述错误单标签对应的元素内容后增加错误单标签对应的结束标签,以保证所有的标签为双标签。
S262,获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据。
可选的,所述获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据,包括:
将所述子节点集合转换为子节点数组;
遍历所述子节点数组以确定脚本SCRIPT标签;
从服务端获取所述SCRIPT标签所引用的外部资源;
将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据。
具体的,由于子节点集合childNodes为节点列表,无法使用遍历方法。因此,可以调用Array.prototypr.slice.call将子节点集合childNodes转换为子节点数组,进而通过遍历所述子节点数组以确定脚本SCRIPT标签的src属性,例如可以采用forEach函数实现遍历。通过get请求从服务端获取所述SCRIPT标签的src属性所引用的外部资源,所述外部资源可以为封装为js的文件。采用innerHTML将所述外部资源添加到空白的DIV标签中。若存在多个js文件,则按照外部资源的位置从上至下依次添加到所述DIV标签中,得到第一待显示页面数据。
S263,基于所述第一待显示页面数据进行页面的渲染显示。
如图2b所示,本发明实施例的具体步骤为:研发人员在可视化编排PC端进行模板开发得到常规模板和自定义模板,常规模板和自定义模板的开发,其本质上是HTML文件的开发,常规模板的HTML文件没有引用外部资源,用户可是直接使用常规模板搭建页面,而自定义模板的HTML文件引用了外部资源,需要用户根据需求对自定义模板进行修改后搭建页面。对开发后的常规模板和自定义模板进行数据编码后通过服务端的API接口发送到服务端进行预处理和存储。用户在可视化H5端上需要显示模板所搭建的页面时,从服务端获取待显示页面的常规模板和自定义模板,经过MD5校验和数据解码后对模板源数据进行从上至下的解析和渲染,并显示在浏览器上。对于常规模板可采用常规渲染方法进行解析和渲染,若识别到模板类型为自定义模板,则根据浏览器的版本,即浏览器是否支持调用创建文档碎片createContextualFragment方法采用不同方式对模板源数据进行解析。若浏览器支持调用创建文档碎片createContextualFragmen方法,则采用碎片解析方法对模板源数据进行解析,碎片解析方法的原理为采用createContextualFragmen获取模板源数据的子节点集合HTMLCollection,通过遍历HTMLCollection确定SCRIPT标签,加载SCRIPT标签的SRC属性引用的外部资源,并创建文档分区,将所述外部资源依次添加到所述文档分区中,最终将所述文档分区添加至当前页面源数据得到第二待显示页面数据,并基于所述第二待显示页面数据进行页面的渲染显示。若浏览器支持调用创建文档碎片createContextualFragmen方法,则采用自定义解析方法进行解析,自定义解析方法的原理为将将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;基于所述第一待显示页面数据进行页面的渲染显示。
本实施例的技术方案,通过识别所述当前页面源数据中的自定义模板源数据,将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;基于所述第一待显示页面数据进行页面的渲染显示,能够在可视化页面设计中增加自定义模板,以满足用户的多样的业务需求。并根据浏览器的兼容性对自定义模板进行不同方法的渲染,提高可视化页面的兼容性,实现快速加载和渲染可视化页面。
实施例三
图3为本发明实施例三提供的一种可视化页面渲染装置的结构示意图。本实施例可适用于在HTML5页面中渲染自定义模板的情况,该装置可采用软件和/或硬件的方式实现,该装置可集成在任何提供可视化页面渲染的功能的设备中,如图3所示,所述可视化页面渲染的装置具体包括:第一获取模块310、识别模块320、第一确定模块330、第一添加模块340和第一显示模块350。
其中,第一获取模块310,用于获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据;
识别模块320,用于识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据;
第一确定模块330,用于将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;
第一添加模块340,用于获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;
第一显示模块350,用于基于所述第一待显示页面数据进行页面的渲染显示。
可选的,所述识别模块,包括:
第一获取单元,用于获取各模块源数据的模板标识和所述模板标识对应的文件类型;其中,所述各模块源数据是各模板对应的HTML文件中的数据;
确定单元,用于若所述模板标识对应的文件类型为目标类型,则确定所述模板标识对应的模板为自定义模板;其中,所述目标类型为自定义模板的类型。
可选的,所述确定模块,包括:
创建单元,用于在所述当前页面源数据中创建DIV标签;
第一添加单元,用于将所述自定义模板源数据的根标签元素添加到所述DIV标签中;
第一确定单元,用于根据所述根标签元素确定所述DIV标签中的子节点集合。
可选的,所述第一添加模块,包括:
转换单元,用于将所述子节点集合转换为子节点数组;
遍历单元,用于遍历所述子节点数组以确定脚本SCRIPT标签;
第二获取单元,用于从服务端获取所述SCRIPT标签所引用的外部资源;
第二添加单元,用于将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据。
可选的,所述装置还包括:
匹配模块,用于在所述将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中之前,通过正则匹配确定所述自定义模板源数据中的错误单标签;
修改模块,用于对所述错误单标签进行修改。
可选的,所述装置还包括:
第二确定模块,用于在将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中之前,确定当前浏览器是否支持调用创建文档碎片方法;
触发模块,用于若不支持调用创建文档碎片方法,则触发执行将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中的操作。
可选的,所述装置还包括:
第二获取模块,用于若支持调用创建文档碎片方法,则通过调用所述创建文档碎片方法获取所述自定义模板源数据的元素集合,其中,所述创建文档碎片方法用于将所述自定义模板源数据分析为文档碎片并基于所述文档碎片获得所述自定义模板源数据的元素集合;
第三确定模块,用于对所述元素集合进行遍历以确定SCRIPT标签;
加载模块,用于加载所述SCRIPT标签所引用的外部资源;
创建模块,用于创建文档分区;
第二添加模块,用于将所述外部资源依次添加到所述文档分区中;
第二显示模块,用于将所述文档分区添加至所述当前页面源数据得到第二待显示页面数据,并基于所述第二待显示页面数据进行页面的渲染显示。
上述产品可执行本发明任意实施例所提供的方法,具备执行方法相应的功能模块和有益效果。
本实施例的技术方案,通过识别所述当前页面源数据中的自定义模板源数据,将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;基于所述第一待显示页面数据进行页面的渲染显示,能够在可视化页面设计中增加自定义模板,以满足用户的多样的业务需求。并根据浏览器的兼容性对自定义模板进行不同方法的渲染,提高可视化页面的兼容性,实现快速加载和渲染可视化页面。
实施例四
图4为本发明实施例四中的一种计算机设备的结构示意图。图4示出了适于用来实现本发明实施方式的示例性计算机设备12的框图。图4显示的计算机设备12仅仅是一个示例,不应对本发明实施例的功能和使用范围带来任何限制。
如图4所示,计算机设备12以通用计算设备的形式表现。计算机设备12的组件可以包括但不限于:一个或者多个处理器或者处理单元16,系统存储器28,连接不同系统组件(包括系统存储器28和处理单元16)的总线18。
总线18表示几类总线结构中的一种或多种,包括存储器总线或者存储器控制器,外围总线,图形加速端口,处理器或者使用多种总线结构中的任意总线结构的局域总线。举例来说,这些体系结构包括但不限于工业标准体系结构(ISA)总线,微通道体系结构(MAC)总线,增强型ISA总线、视频电子标准协会(VESA)局域总线以及外围组件互连(PCI)总线。
计算机设备12典型地包括多种计算机系统可读介质。这些介质可以是任何能够被计算机设备12访问的可用介质,包括易失性和非易失性介质,可移动的和不可移动的介质。
系统存储器28可以包括易失性存储器形式的计算机系统可读介质,例如随机存取存储器(RAM)30和/或高速缓存存储器32。计算机设备12可以进一步包括其它可移动/不可移动的、易失性/非易失性计算机系统存储介质。仅作为举例,存储系统34可以用于读写不可移动的、非易失性磁介质(图4未显示,通常称为“硬盘驱动器”)。尽管图4中未示出,可以提供用于对可移动非易失性磁盘(例如“软盘”)读写的磁盘驱动器,以及对可移动非易失性光盘(例如CD-ROM,DVD-ROM或者其它光介质)读写的光盘驱动器。在这些情况下,每个驱动器可以通过一个或者多个数据介质接口与总线18相连。存储器28可以包括至少一个程序产品,该程序产品具有一组(例如至少一个)程序模块,这些程序模块被配置以执行本发明各实施例的功能。
具有一组(至少一个)程序模块42的程序/实用工具40,可以存储在例如存储器28中,这样的程序模块42包括——但不限于——操作系统、一个或者多个应用程序、其它程序模块以及程序数据,这些示例中的每一个或某种组合中可能包括网络环境的实现。程序模块42通常执行本发明所描述的实施例中的功能和/或方法。
计算机设备12也可以与一个或多个外部设备14(例如键盘、指向设备、显示器24等)通信,还可与一个或者多个使得用户能与该计算机设备12交互的设备通信,和/或与使得该计算机设备12能与一个或多个其它计算设备进行通信的任何设备(例如网卡,调制解调器等等)通信。这种通信可以通过输入/输出(I/O)接口22进行。另外,本实施例中的计算机设备12,显示器24不是作为独立个体存在,而是嵌入镜面中,在显示器24的显示面不予显示时,显示器24的显示面与镜面从视觉上融为一体。并且,计算机设备12还可以通过网络适配器20与一个或者多个网络(例如局域网(LAN),广域网(WAN)和/或公共网络,例如因特网)通信。如图所示,网络适配器20通过总线18与计算机设备12的其它模块通信。应当明白,尽管图中未示出,可以结合计算机设备12使用其它硬件和/或软件模块,包括但不限于:微代码、设备驱动器、冗余处理单元、外部磁盘驱动阵列、RAID系统、磁带驱动器以及数据备份存储系统等。
处理单元16通过运行存储在系统存储器28中的程序,从而执行各种功能应用以及数据处理,例如实现本发明实施例所提供的可视化页面渲染方法:获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据;
识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据;
将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;
获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;
基于所述第一待显示页面数据进行页面的渲染显示。
实施例五
本发明实施例五提供了一种计算机可读存储介质,其上存储有计算机程序,该程序被处理器执行时实现如本申请所有发明实施例提供的可视化页面渲染方法:
获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据;
识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据;
将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;
获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;
基于所述第一待显示页面数据进行页面的渲染显示。
可以采用一个或多个计算机可读的介质的任意组合。计算机可读介质可以是计算机可读信号介质或者计算机可读存储介质。计算机可读存储介质例如可以是但不限于电、磁、光、电磁、红外线、或半导体的系统、装置或器件,或者任意以上的组合。计算机可读存储介质的更具体的例子(非穷举的列表)包括:具有一个或多个导线的电连接、便携式计算机磁盘、硬盘、随机存取存储器(RAM)、只读存储器(ROM)、可擦式可编程只读存储器(EPROM或闪存)、光纤、便携式紧凑磁盘只读存储器(CD-ROM)、光存储器件、磁存储器件、或者上述的任意合适的组合。在本文件中,计算机可读存储介质可以是任何包含或存储程序的有形介质,该程序可以被指令执行系统、装置或者器件使用或者与其结合使用。
计算机可读的信号介质可以包括在基带中或者作为载波一部分传播的数据信号,其中承载了计算机可读的程序代码。这种传播的数据信号可以采用多种形式,包括但不限于电磁信号、光信号或上述的任意合适的组合。计算机可读的信号介质还可以是计算机可读存储介质以外的任何计算机可读介质,该计算机可读介质可以发送、传播或者传输用于由指令执行系统、装置或者器件使用或者与其结合使用的程序。
计算机可读介质上包含的程序代码可以用任何适当的介质传输,包括但不限于无线、电线、光缆、RF等等,或者上述的任意合适的组合。
可以以一种或多种程序设计语言或其组合来编写用于执行本发明操作的计算机程序代码,所述程序设计语言包括面向对象的程序设计语言,诸如Java、Smalltalk、C++,还包括常规的过程式程序设计语言,诸如“C”语言或类似的程序设计语言。程序代码可以完全地在用户计算机上执行、部分地在用户计算机上执行、作为一个独立的软件包执行、部分在用户计算机上部分在远程计算机上执行、或者完全在远程计算机或服务器上执行。在涉及远程计算机的情形中,远程计算机可以通过任意种类的网络——包括局域网(LAN)或广域网(WAN)—连接到用户计算机,或者,可以连接到外部计算机(例如利用因特网服务提供商来通过因特网连接)。
注意,上述仅为本发明的较佳实施例及所运用技术原理。本领域技术人员会理解,本发明不限于这里所述的特定实施例,对本领域技术人员来说能够进行各种明显的变化、重新调整和替代而不会脱离本发明的保护范围。因此,虽然通过以上实施例对本发明进行了较为详细的说明,但是本发明不仅仅限于以上实施例,在不脱离本发明构思的情况下,还可以包括更多其他等效实施例,而本发明的范围由所附的权利要求范围决定。
Claims (10)
1.一种可视化页面渲染方法,其特征在于,包括:
获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据;
识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据;
将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;
获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;
基于所述第一待显示页面数据进行页面的渲染显示。
2.根据权利要求1所述的方法,其特征在于,所述识别所述当前页面源数据中的自定义模板源数据,包括:
从各所述HTML文件中分别读取模板标识和所述模板标识对应的文件类型;
将所对应的文件类型为目标类型的模板标识确定为自定义模板标识,将所述自定义模板标识对应的HTML文件中的数据确定为自定义模板源数据。
3.根据权利要求1所述的方法,其特征在于,所述将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合,包括:
在所述当前页面源数据中创建DIV标签;
将所述自定义模板源数据的根标签元素添加到所述DIV标签中;
根据所述根标签元素确定所述DIV标签对应的子节点集合。
4.根据权利要求1所述的方法,其特征在于,所述获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据,包括:
将所述子节点集合转换为子节点数组;
遍历所述子节点数组以确定脚本SCRIPT标签;
从服务端获取所述SCRIPT标签所引用的外部资源;
将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据。
5.根据权利要求1所述的方法,其特征在于,在所述将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中之前,还包括:
通过正则匹配确定所述自定义模板源数据中的错误单标签;
对所述错误单标签进行修改。
6.根据权利要求1所述的方法,其特征在于,在将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中之前,还包括:
确定当前浏览器是否支持调用创建文档碎片方法;
若不支持调用创建文档碎片方法,则触发执行将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中的操作。
7.根据权利要求6所述的方法,其特征在于,所述方法还包括:
若支持调用创建文档碎片方法,则通过调用所述创建文档碎片方法获取所述自定义模板源数据的元素集合,其中,所述创建文档碎片方法用于将所述自定义模板源数据分析为文档碎片并基于所述文档碎片获得所述自定义模板源数据的元素集合;
对所述元素集合进行遍历以确定SCRIPT标签;
加载所述SCRIPT标签所引用的外部资源;
创建文档分区;
将所述外部资源依次添加到所述文档分区中;
将所述文档分区添加至所述当前页面源数据得到第二待显示页面数据,并基于所述第二待显示页面数据进行页面的渲染显示。
8.一种可视化页面渲染装置,其特征在于,包括:
第一获取模块,用于获取当前页面源数据;其中,所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据;
识别模块,用于识别所述当前页面源数据中的自定义模板源数据;其中,所述自定义模板源数据是引用了外部资源的HTML文件中的数据;
第一确定模块,用于将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中,确定所述DIV标签对应的子节点集合;
第一添加模块,用于获取所述子节点集合中的标签所引用的外部资源,并将所述外部资源添加到所述DIV标签中,得到第一待显示页面数据;
第一显示模块,用于基于所述第一待显示页面数据进行页面的渲染显示。
9.一种计算机设备,包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序,其特征在于,所述处理器执行所述程序时实现如权利要求1-7中任一所述的可视化页面渲染方法。
10.一种计算机可读存储介质,其上存储有计算机程序,其特征在于,该程序被处理器执行时实现如权利要求1-7中任一所述的可视化页面渲染方法。
Priority Applications (4)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202011634449.5A CN113158101B (zh) | 2020-12-31 | 2020-12-31 | 一种可视化页面渲染方法、装置、设备及存储介质 |
JP2023516608A JP2023541186A (ja) | 2020-12-31 | 2021-11-09 | 可視化ページレンダリング方法、装置、機器及び記憶媒体 |
PCT/CN2021/129470 WO2022142743A1 (zh) | 2020-12-31 | 2021-11-09 | 可视化页面渲染方法、装置、设备及存储介质 |
US18/038,054 US20230419016A1 (en) | 2020-12-31 | 2021-11-09 | Visualized Page Rendering Method, Device, Equipment, and Storage Medium |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN202011634449.5A CN113158101B (zh) | 2020-12-31 | 2020-12-31 | 一种可视化页面渲染方法、装置、设备及存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN113158101A true CN113158101A (zh) | 2021-07-23 |
CN113158101B CN113158101B (zh) | 2023-09-05 |
Family
ID=76878580
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN202011634449.5A Active CN113158101B (zh) | 2020-12-31 | 2020-12-31 | 一种可视化页面渲染方法、装置、设备及存储介质 |
Country Status (4)
Country | Link |
---|---|
US (1) | US20230419016A1 (zh) |
JP (1) | JP2023541186A (zh) |
CN (1) | CN113158101B (zh) |
WO (1) | WO2022142743A1 (zh) |
Cited By (3)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN114419197A (zh) * | 2021-12-15 | 2022-04-29 | 北京力控元通科技有限公司 | 一种基于svg的功能定义系统、方法及计算机设备 |
WO2022142743A1 (zh) * | 2020-12-31 | 2022-07-07 | 京东科技控股股份有限公司 | 可视化页面渲染方法、装置、设备及存储介质 |
CN115392887A (zh) * | 2022-10-31 | 2022-11-25 | 江西省煤田地质局普查综合大队 | 自然资源一体化平台构建方法、装置 |
Families Citing this family (2)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN115586896B (zh) * | 2022-09-29 | 2023-08-04 | 通号智慧城市研究设计院有限公司 | 基于模板引擎的页面项目开发方法、设备及存储介质 |
CN117331557B (zh) * | 2023-10-24 | 2024-05-14 | 北京饼干科技有限公司 | 一种表单渲染方法、装置、介质及设备 |
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US6553393B1 (en) * | 1999-04-26 | 2003-04-22 | International Business Machines Coporation | Method for prefetching external resources to embedded objects in a markup language data stream |
KR20100106872A (ko) * | 2009-03-24 | 2010-10-04 | 엠어트랙션 주식회사 | 웹 서비스 시스템 및 하이퍼 텍스트 마크업 언어로 제작된 웹페이지에 다양한 형식의 서브 웹페이지를 하이퍼 링크시키는 방법 |
US20160012147A1 (en) * | 2014-07-10 | 2016-01-14 | MyMojo Corporation | Asynchronous Initialization of Document Object Model (DOM) Modules |
US20160012023A1 (en) * | 2014-07-10 | 2016-01-14 | MyMojo Corporation | Self-Referencing of Running Script Elements in Asynchronously Loaded DOM Modules |
Family Cites Families (5)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN106339226B (zh) * | 2016-08-26 | 2019-10-25 | 南威软件股份有限公司 | 一种网页页面的展示方法和页面展示装置 |
CN108279903A (zh) * | 2018-02-24 | 2018-07-13 | 北京车和家信息技术有限公司 | 页面展示的方法及装置 |
CN109101300B (zh) * | 2018-06-14 | 2020-06-02 | 腾讯科技(深圳)有限公司 | 一种页面渲染方法、装置及终端 |
US10915598B2 (en) * | 2019-03-29 | 2021-02-09 | Microsoft Technology Licensing, Llc | Generating HTML content to cache based on a member identifier and a template when there is no cached HTML content associated with a campaign and serving the cached HTML content |
CN113158101B (zh) * | 2020-12-31 | 2023-09-05 | 京东科技控股股份有限公司 | 一种可视化页面渲染方法、装置、设备及存储介质 |
-
2020
- 2020-12-31 CN CN202011634449.5A patent/CN113158101B/zh active Active
-
2021
- 2021-11-09 WO PCT/CN2021/129470 patent/WO2022142743A1/zh active Application Filing
- 2021-11-09 JP JP2023516608A patent/JP2023541186A/ja active Pending
- 2021-11-09 US US18/038,054 patent/US20230419016A1/en active Pending
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
US6553393B1 (en) * | 1999-04-26 | 2003-04-22 | International Business Machines Coporation | Method for prefetching external resources to embedded objects in a markup language data stream |
KR20100106872A (ko) * | 2009-03-24 | 2010-10-04 | 엠어트랙션 주식회사 | 웹 서비스 시스템 및 하이퍼 텍스트 마크업 언어로 제작된 웹페이지에 다양한 형식의 서브 웹페이지를 하이퍼 링크시키는 방법 |
US20160012147A1 (en) * | 2014-07-10 | 2016-01-14 | MyMojo Corporation | Asynchronous Initialization of Document Object Model (DOM) Modules |
US20160012023A1 (en) * | 2014-07-10 | 2016-01-14 | MyMojo Corporation | Self-Referencing of Running Script Elements in Asynchronously Loaded DOM Modules |
Cited By (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
WO2022142743A1 (zh) * | 2020-12-31 | 2022-07-07 | 京东科技控股股份有限公司 | 可视化页面渲染方法、装置、设备及存储介质 |
CN114419197A (zh) * | 2021-12-15 | 2022-04-29 | 北京力控元通科技有限公司 | 一种基于svg的功能定义系统、方法及计算机设备 |
CN115392887A (zh) * | 2022-10-31 | 2022-11-25 | 江西省煤田地质局普查综合大队 | 自然资源一体化平台构建方法、装置 |
CN115392887B (zh) * | 2022-10-31 | 2023-04-18 | 江西省地质局地理信息工程大队 | 自然资源一体化平台构建方法、装置 |
Also Published As
Publication number | Publication date |
---|---|
WO2022142743A1 (zh) | 2022-07-07 |
CN113158101B (zh) | 2023-09-05 |
JP2023541186A (ja) | 2023-09-28 |
US20230419016A1 (en) | 2023-12-28 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN113158101B (zh) | 一种可视化页面渲染方法、装置、设备及存储介质 | |
US9665256B2 (en) | Identifying selected dynamic content regions | |
US20140089786A1 (en) | Automated Processor For Web Content To Mobile-Optimized Content Transformation | |
CN112100550A (zh) | 一种页面构建方法和装置 | |
CN112015430A (zh) | JavaScript代码翻译方法、装置、计算机设备及存储介质 | |
US11418622B2 (en) | System and methods for web-based software application translation | |
CN111294395A (zh) | 一种终端页面传输方法、装置、介质和电子设备 | |
US20120072828A1 (en) | Complex input to image transformation for distribution | |
CN113761412A (zh) | 应用页面的显示方法、装置、电子设备、介质及应用系统 | |
CN113495730A (zh) | 资源包的生成及解析方法和装置 | |
CN113360106B (zh) | 一种网页打印方法和装置 | |
CN112783482B (zh) | 一种可视化表单生成方法、装置、设备及存储介质 | |
CN113094625B (zh) | 页面元素定位方法、装置、电子设备及存储介质 | |
CN112632425A (zh) | 一种离线资源文件的生成方法、装置、设备及存储介质 | |
CN111783004A (zh) | 页面嵌入方法、装置及系统 | |
US10140278B2 (en) | Computer-implemented methods and systems for associating files with cells of a collaborative spreadsheet | |
CN114756228A (zh) | 页面处理方法、装置、设备及存储介质 | |
CN110162301B (zh) | 一种表单渲染方法、装置和存储介质 | |
CN113342450B (zh) | 页面处理的方法、装置、电子设备及计算机可读介质 | |
CN113127776A (zh) | 面包屑路径生成方法、装置及终端设备 | |
CN116432624A (zh) | 一种微服务api文档生成方法、装置、设备、存储介质 | |
CN107423271B (zh) | 文档生成方法和装置 | |
CN111651696B (zh) | 产品标签的定制方法及装置、计算机存储介质、电子设备 | |
CN113656041A (zh) | 数据处理方法、装置、设备及存储介质 | |
CN113821278B (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 | ||
CB02 | Change of applicant information | ||
CB02 | Change of applicant information |
Address after: Room 221, 2 / F, block C, 18 Kechuang 11th Street, Daxing District, Beijing, 100176 Applicant after: Jingdong Technology Holding Co.,Ltd. Address before: Room 221, 2 / F, block C, 18 Kechuang 11th Street, Daxing District, Beijing, 100176 Applicant before: Jingdong Digital Technology Holding Co.,Ltd. |
|
GR01 | Patent grant | ||
GR01 | Patent grant |