一种自动生成网页页面的方法技术

一种自动生成网页页面的方法，其特征在于，包括以下步骤：S1、分析网页中可能会用到的前端编程语言；S2、分析网页的主题、布局结构，在通用型描述语言中填入网页主题、页面布局结构的配置信息；S3、找到对应编程语言语法与通用型描述语言键值的对应关系；S4、将对应语法的键值对填入通用型描述语言中，并将各键值之间的父子或关联关系做好配置；S5、通过解析引擎对已填好的通用型描述语言进行语法解析，并渲染生成对应网页页面。本发明专利技术中自动生成网页页面的方法，由软件自动生成，效率高：同时降低了对人工的依赖，所构建的网页页面代码性能稳定，符合标准，安全性、兼容性高。兼容性高。兼容性高。

【技术实现步骤摘要】
一种自动生成网页页面的方法


[0001]本专利技术涉及软件开发
，具体涉及一种自动生成网页页面的方法。

技术介绍

[0002]在软件系统的开发工作中，可分为前端和后端开发，通俗的讲前端指的就是用户可见的界面，比如网页页面上的特效、布局、图片、视频，音频等内容。前端开发的工作内容就是将美工设计的效果图转化成浏览器可以运行的网页，并配合后端做网页上的数据显示和交互等可视方面的工作内容。
[0003]目前，网页页面大多是由html、javascript、css这3种编程语言所撰写的代码经编译而成，其中HTML的全称为超文本标记语言(Hyper Text Markup Language)，是一种标记语言，HTML文本是由HTML命令组成的描述性文本，HTML命令可以说明文字，图形、动画、声音、表格、链接等；JavaScript，简称“JS”，是一种具有函数优先的轻量级，解释型或即时编译型的编程语言；css 层叠样式表(Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言，CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化。上述的这3种编程语言通过互相交织、嵌套配合后，就可形成视觉显示效果丰富，功能复杂多样的网页页面。网页页面一般通过浏览器打开，而不同的网页浏览器或相同浏览器的不同版本都会因为这3种编程语言的语法、组合方式而影响最终页面的整体显示效果。因此，对于网页页面的代码，需要具有很强的兼容性及还原度。
[0004]现有技术中，网页页面的开发主要由人工进行编写，一般是由一个或多个熟悉前端专业编程语言的技术人员完成，由于每个技术人员对多种编程语言的学习深度以及各种编程语言的配合程度具有不确定性，从而导致网页还原度、兼容性、bug率等多个方面无法得到保障。有鉴于此，本申请旨在提供一种生成网页页面的方法；可通过程序自动生成网页页面的代码，降低对前端专业技术人员的依赖 。

技术实现思路

[0005]本专利技术的目的是克服现有技术的上述不足而提供一种自动生成网页页面的方法，由程序自动生成网页页面代码，从而减少对人工的依赖。
[0006]本专利技术的技术方案是：一种自动生成网页页面的方法，由软件程序自动执行，包括以下步骤：S1、分析网页中可能会用到的前端编程语言；S2、分析网页的主题、布局结构，在通用型描述语言中填入网页主题、页面布局结构的配置信息；S3、找到对应编程语言语法与通用型描述语言键值的对应关系；S4、将对应语法的键值对填入通用型描述语言中，并将各键值之间的父子或关联关系做好配置；
S5、通过解析引擎对已填好的通用型描述语言进行语法解析，并渲染生成对应网页页面。
[0007]进一步的，通用型描述语言为JSON。
[0008]进一步的，在步骤S4中，软件系统中的数据由表单页面进行维护，根据需求分析在软件系统中需要进行数据维护的各数据模型属性，对应表单键值表，并依据表单JSON数据示例的格式填入各数据模型属性；再通过span属性调整表单内各元素位置。
[0009]进一步的，再通过列表页面对表单所维护的数据模型进行展示，对应列表键值表，并依据列表JSON数据示例的格式填入需要展示的数据模型属性，再根据实际需求调整列表各列的详细配置。
[0010]进一步的，选择配置列表中需要进行查询、筛选的列，进行列表页面搜索功能的配置。
[0011]进一步的，在步骤S4中，如果软件系统中数据关系复杂，出现1对1、 1对多、甚至多对多的数据关系，则通过自定义页面进行自由组合，根据实际业务需求找出需要进行数据关联的基础页面。
[0012]进一步的，通过自定义页面键值表，依据自定义页面JSON数据示例；在unions属性中配置各基础页面之间的关系，同时可设置其关联字段，完成页面与页面之间的数据关系配置；再对其宽度、高度、位置、颜色、标题等相关属性进行调整。
[0013]与现有技术相比本专利技术的有益效果：本专利技术中自动生成网页页页面的方法，由软件自动生成，效率高：同时降低对人工的依赖，即无需关心前端专业技术人员对网页各编程语言掌握的精通程度，经验是否丰富，所构建的网页页面代码性能稳定，符合标准，安全性、兼容性高。
[0014]本专利技术通过对前端多种编程语言的理解，将不同的编程语法进行归纳总结，通过通用型描述语言（JSON）对各语法进行重新描述，每个JSON键值对代表一个语法，通过JSON本身可无限包含子集的特性进行利用，以表达各编程语言之间的配合和互相之间的调用、关联、配合。本专利技术中通用型描述语言（JSON）键值包含但不限于：元素名称、标签名称、元素宽度、元素高度、元素边框、元素背景颜色、元素背景图片、元素值、父级元素、事件类型、事件名称、元素外边距、元素内边距等，最后通过对通用型描述语言（JSON）进行统一解析，可生成标准、规范、安全、兼容性高的网页页面。
附图说明
[0015]图1是本专利技术的流程图。
具体实施方式
[0016]以下将结合具体实施例对本专利技术做进一步详细说明，实施例中未具体说明的方法或功能部件均为现有技术。
[0017]实施例1如图1所示，本实施例中自动生成网页页面的方法的流程，包括以下步骤：S1、分析网页中可能会用到的前端编程语言，是否需要使用网页脚本、网页样式渲染；
S2、分析网页的主题、布局结构，在通用型描述语言中将已配置好的网页主题、页面布局结构描述配置（上中下、左中右或者其他类型）填入；S3、找到对应编程语言语法与本专利技术中通用型描述语言键值的对应关系；S4、将对应语法的键值对填入并将各键值之间的父子或关联关系做好配置；S5、通常软件系统中的数据由表单页面进行维护，根据需求分析在软件系统中需要进行数据维护的各数据模型属性，对应表单键值表，并依据表单JSON数据示例中的格式填入各数据模型属性；并通过span属性调整表单内各元素位置。
[0018]表单键值表如下表1：表单JSON数据示例如下：{
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
"label": "会议主题",
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
"componentName": "单行输入",
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
"labelWidth": 100,
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
"showLabel": true,
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
"tag": "el
‑
input",
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
"tagIcon": "input",
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
"required": true,
ꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀꢀ
"span": 8,...

【技术保护点】

【技术特征摘要】
1.一种自动生成网页页面的方法，其特征在于，包括以下步骤：S1、分析网页中将会用到的前端编程语言；S2、分析网页的主题、布局结构，在通用型描述语言中填入网页主题、页面布局结构的配置信息；S3、找到对应编程语言语法与通用型描述语言键值的对应关系；S4、将对应语法的键值对填入通用型描述语言中，并将各键值之间的父子或关联关系做好配置；S5、通过解析引擎对已填好的通用型描述语言进行语法解析，并渲染生成对应网页页面。2.根据权利要求1所述的自动生成网页页面的方法，其特征在于：所述通用型描述语言为JSON。3.根据权利要求1所述的自动生成网页页面的方法，其特征在于：在步骤S4中，软件系统中的数据由表单页面进行维护，根据需求分析在软件系统中需要进行数据维护的各数据模型属性，对应表单键值表，并依据表单JSON数据示例的格式填入各数据模型属性；再通过span属性调整表单内各元素位置。4.根据权利要求3所述的自动生成网...

【专利技术属性】
技术研发人员：赵术求，李维，林源，
申请(专利权)人：华腾软件产业有限公司，
类型：发明
国别省市：