[发明专利]一种可视化页面渲染方法、装置、设备及存储介质

说明书

本发明实施例公开了一种可视化页面渲染方法、装置、设备及存储介质。该方法包括：获取当前页面源数据；识别所述当前页面源数据中的自定义模板源数据；将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中，确定所述DIV标签对应的子节点集合；获取所述子节点集合中的标签所引用的外部资源，并将所述外部资源添加到所述DIV标签中，得到第一待显示页面数据；基于所述第一待显示页面数据进行页面的渲染显示。通过本发明的技术方案，能够在可视化页面设计中增加自定义模板，以满足用户的各种需求，并根据浏览器的兼容性对自定义模板源数据进行渲染，提高可视化页面的兼容性，实现快速加载和渲染可视化页面。

技术领域

本发明实施例涉及计算机技术领域，尤其涉及一种可视化页面渲染方法、装置、设备及存储介质。

背景技术

随着移动互联网的快速发展和智能手机的全面普及，人们的生活方式和消费模式发生了巨大变化。通过最新修订版本的超文本标记语言(HTML5，Hyper Markup Language5)设计网页成为各大企业宣传品牌形象和吸引受众群体关注的重要途径。

在实现本发明的过程中，发现现有技术中至少存在以下技术问题：在设计网页时，现有的模板往往不能适配不同业务需求场景，无法满足用户多样的业务需求。因此，需要在页面搭建过程中添加自定义模板。但是，自定义模板一般较为复杂，无法通过VUE前端框架实现页面渲染。使用iframe框架渲染页面的方法存在很多缺点，例如网页加载速度慢、易出现局部混乱、兼容性较差，不适用于对添加的自定义模板进行渲染。

发明内容

本发明实施例提供一种可视化页面渲染方法、装置、设备及存储介质，以实现能够对自定义模板源数据进行渲染显示，提高可视化页面的兼容性，实现快速加载和渲染可视化页面。

第一方面，本发明实施例提供了一种可视化页面渲染方法，包括：

获取当前页面源数据；其中，所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据；

识别所述当前页面源数据中的自定义模板源数据；其中，所述自定义模板源数据是引用了外部资源的HTML文件中的数据；

将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中，确定所述DIV标签对应的子节点集合；

获取所述子节点集合中的标签所引用的外部资源，并将所述外部资源添加到所述DIV标签中，得到第一待显示页面数据；

基于所述第一待显示页面数据进行页面的渲染显示。

第二方面，本发明实施例还提供了一种可视化页面渲染装置，该装置包括：

第一获取模块，用于获取当前页面源数据；其中，所述当前页面源数据包括待显示页面中的各模块分别对应的HTML文件中的数据；

识别模块，用于识别所述当前页面源数据中的自定义模板源数据；其中，所述自定义模板源数据是引用了外部资源的HTML文件中的数据；

第一确定模块，用于将所述自定义模板源数据添加在所述当前页面源数据中新创建的区隔DIV标签中，确定所述DIV标签对应的子节点集合；

第一添加模块，用于获取所述子节点集合中的标签所引用的外部资源，并将所述外部资源添加到所述DIV标签中，得到第一待显示页面数据；

第一显示模块，用于基于所述第一待显示页面数据进行页面的渲染显示。

第三方面，本发明实施例还提供了一种计算机设备，包括存储器、处理器及存储在存储器上并可在处理器上运行的计算机程序，所述处理器执行所述程序时实现如本发明实施例中任一所述的可视化页面渲染方法。