一种基于JavaScript生成html5页面的方法专利检索-选定国际初步审查要求专利权专利检索查询-专利查询网

一种基于JavaScript生成html5页面的方法

阅读：603发布：2023-01-10

专利汇可以提供一种基于JavaScript生成html5页面的方法专利检索，专利查询，专利分析的服务。并且本发明提供了一种基于JavaScript生成html5页面的方法，包括工作界面构建以及页面拖拽生成两个步骤，在进行工作界面构建时，首先选择并构建模板界面，在模板界面中配置有独立设置的预览窗口与备选模板框，然后配置工具窗口，工具窗口中配置有多个备选工具框，所述多个备选工具框包括备选图片框、备选文本框以及备选动画框；在进行页面拖拽生成时，从备选模板框中选择模板并在预览窗口中进行显示，选定后则显示在可编辑框内，然后通过从备选工具框中选定图片、文本以及动画并拖拽至可编辑框中的模板并编辑；最后保存发布即可得所需的html5页面。本方法能够轻松快速地制作html5页面，且便于二次开发，用户体验好。，下面是一种基于JavaScript生成html5页面的方法专利的具体信息内容。

权利要求

1.一种基于JavaScript生成html5页面的方法，其特征在于，包括工作界面构建以及页面拖拽生成两个步骤，
在进行工作界面构建时，首先选择并构建模板界面，在模板界面中配置有独立设置的预览窗口与备选模板框，然后配置工具窗口，工具窗口中配置有多个备选工具框，所述多个备选工具框包括备选图片框、备选文本框以及备选动画框；
在进行页面拖拽生成时，从备选模板框中选择模板并在预览窗口中进行显示，选定后则显示在可编辑框内，然后通过从备选工具框中选定图片、文本以及动画并拖拽至可编辑框中的模板并编辑；
最后保存发布即可得所需的html5页面。
2.根据权利要求1所述的基于JavaScript生成html5页面的方法，其特征在于，在构建模板界面时，模板界面中还配置有UE交互窗口，UE交互窗口中配置交互参数设置选项，用于用户自主设置样式参数及交互参数。
3.根据权利要求2所述的基于JavaScript生成html5页面的方法，其特征在于，UE交互窗口包括页面编辑交互窗口，备选模板框包括若干个配置不同的备选图层，且在选中图层后，通过页面编辑交互窗口进行图层样式参数及图层交互参数的设置。
4.根据权利要求3所述的基于JavaScript生成html5页面的方法，其特征在于，UE交互窗口包括工具编辑交互窗口，在进行页面拖拽生成时，所选择的模板上包括若干个图层，所选定的图片、文本以及动画可拖动放置在某一图层中，并通过工具编辑交互窗口进行图片、文本以及动画的样式参数及交互参数的设置，实现编辑。
5.根据权利要求1至4中任一项所述的基于JavaScript生成html5页面的方法，其特征在于，在进行页面拖拽生成时，采用Javacript技术点击或拖拽所述备选工具框中的组件即图片、文本或者动画至可编辑框内的模板上，进而触发鼠标事件mousedown复制组件至模板上的图层中，当松开鼠标按钮时触发鼠标事件mouseup完成对应组件的复制，再进行样式参数及交互参数的设置后，实现可视化拖拽操作生成html5页面。
6.根据权利要求5所述的基于JavaScript生成html5页面的方法，其特征在于，在向可编辑框内的模板添加动画时，采用Animate.css库生成css3动画，封装js实现可视化展示，再通过工具编辑交互窗口对所选动画进行设置，再采用javascript绑定监控对象，通过浏览器渲染出对象的参数值。
7.根据权利要求1所述的基于JavaScript生成html5页面的方法，其特征在于，本方法中配置有本地数据库，在完成所需的html5页面的制作后可选择存储于所述本地数据库中，用于二次开发。
8.根据权利要求1所述的基于JavaScript生成html5页面的方法，其特征在于，所述方法基于WEB实现在线编辑，打包压缩采用webpack进行压缩，数据存储用的服务器为云服务器或者自有独立服务器。

说明书全文

一种基于JavaScript生成html5页面的方法

技术领域

[0001] 本发明涉及互联网技术领域，特别是涉及一种基于JavaScript生成html5页面的方法。

背景技术

[0002] 目前，拖拽直接生成动画、html5页面、app的技术已经成熟，然而功能实现方式、开发语言各不形同，无法二次开发，程序大而卡顿，同时大的互联网公司也是内部使用，技术保密，造成了技术推广性差、客户体验也很差。

发明内容

[0003] 本发明的一个目的是要提供一种基于JavaScript生成html5页面的方法，该方法能够轻松快速地制作html5页面，且便于二次开发，用户体验好。

[0004] 特别地，本发明提供了一种基于JavaScript生成html5页面的方法，包括工作界面构建以及页面拖拽生成两个步骤，在进行工作界面构建时，首先选择并构建模板界面，在模板界面中配置有独立设置的预览窗口与备选模板框，然后配置工具窗口，工具窗口中配置有多个备选工具框，所述多个备选工具框包括备选图片框、备选文本框以及备选动画框；
在进行页面拖拽生成时，从备选模板框中选择模板并在预览窗口中进行显示，选定后则显示在可编辑框内，然后通过从备选工具框中选定图片、文本以及动画并拖拽至可编辑框中的模板并编辑；
最后保存发布即可得所需的html5页面。

[0005] 对于上述技术方案，发明人还有进一步的优化措施。

[0006] 优选地，在构建模板界面时，模板界面中还配置有UE交互窗口，UE交互窗口中配置交互参数设置选项，用于用户自主设置样式参数及交互参数。

[0007] 进一步地，UE交互窗口包括页面编辑交互窗口，备选模板框包括若干个配置不同的备选图层，且在选中图层后，通过页面编辑交互窗口进行图层样式参数及图层交互参数的设置。

[0008] 更进一步地，UE交互窗口包括工具编辑交互窗口，在进行页面拖拽生成时，所选择的模板上包括若干个图层，所选定的图片、文本以及动画可拖动放置在某一图层中，并通过工具编辑交互窗口进行图片、文本以及动画的样式参数及交互参数的设置，实现编辑。

[0009] 优选地，在进行页面拖拽生成时，采用Javacript技术点击或拖拽所述备选工具框中的组件即图片、文本或者动画至可编辑框内的模板上，进而触发鼠标事件mousedown复制组件至模板上的图层中，当松开鼠标按钮时触发鼠标事件mouseup完成对应组件的复制，再进行样式参数及交互参数的设置后，实现可视化拖拽操作生成html5页面。

[0010] 进一步地，在向可编辑框内的模板添加动画时，采用Animate.css库生成css3动画，封装js实现可视化展示，再通过工具编辑交互窗口对所选动画进行设置，再采用javascript绑定监控对象，通过浏览器渲染出对象的参数值。

[0011] 优选地，本方法中配置有本地数据库，在完成所需的html5页面的制作后可选择存储于所述本地数据库中，用于二次开发。

[0012] 优选地，所述方法基于WEB实现在线编辑，打包压缩采用webpack进行压缩，数据存储用的服务器为云服务器或者自有独立服务器。

[0013] 与现有技术相比较，本发明的优点在于：本发明所描述的基于JavaScript生成html5页面的方法，其能够通过拖拽数据库中的图片、文本或者动画，并实现界面各个部分的编辑，进而生成html5界面，界面的可调性高，且代码是公开的，可二次调整，便于用户操作。

[0014] 另外，该方法是基于WEB进行的，没有空间限制，整个操作过程为可视化操作，所见即所得，解决不会写代码的困扰，适用于各个阶段用户，软件架构于用户自有服务器，数据安全得以保障。

[0015] 根据下文结合附图对本发明具体实施例的详细描述，本领域技术人员将会更加明了本发明的上述以及其他目的、优点和特征。

附图说明

[0016] 后文将参照附图以示例性而非限制性的方式详细描述本发明的一些具体实施例。附图中相同的附图标记标示了相同或类似的部件或部分。本领域技术人员应该理解，这些附图未必是按比例绘制的。附图中：
图1是根据本发明一个实施例的基于JavaScript生成html5页面的方法的工作流程图。

具体实施方式

[0017] 本实施例描述了一种基于JavaScript生成html5页面的方法，工作流程大致如图1所示，生成方法通过模板与备选数据的设置，采用Javacript点击或拖拽所述备选数据中的图片、文本或者动画至所述模板界面进而触发mousedown复制组件，保存后生成html5页面。编辑完成保存时采用webpack打包压缩，经压缩后代码不足100kB，code少，功能性更强。

[0018] 具体说来，所述基于JavaScript生成html5页面的方法可包括工作界面构建以及页面拖拽生成两个步骤，在进行工作界面构建时，首先选择并构建模板界面，在模板界面中配置有独立设置的预览窗口与备选模板框，然后配置工具窗口，工具窗口中配置有多个备选工具框，所述多个备选工具框包括备选图片框、备选文本框以及备选动画框；在进行页面拖拽生成时，从备选模板框中选择模板并在预览窗口中进行显示，选定后则显示在可编辑框内，然后通过从备选工具框中选定图片、文本以及动画并拖拽至可编辑框中的模板并编辑；
最后保存发布即可得所需的html5页面。

[0019] 而在构建模板界面时，为了便于数据交互及可编辑的个性化设置，所述模板界面中还配置有UE交互窗口，UE交互窗口中配置交互参数设置选项，用于用户自主设置样式参数及交互参数。

[0020] 进一步地，UE交互窗口包括页面编辑交互窗口，备选模板框包括若干个配置不同的备选图层，且在选中图层后，通过页面编辑交互窗口进行图层样式参数及图层交互参数的设置。

[0021] UE交互窗口包括工具编辑交互窗口，在进行页面拖拽生成时，所选择的模板上包括若干个图层，所选定的图片、文本以及动画可拖动放置在某一图层中，并通过工具编辑交互窗口进行图片、文本以及动画的样式参数及交互参数的设置，实现编辑。

[0022] 通常而言，页面编辑交互窗口与工具编辑交互窗口是分别独立设置的，以便于用户进行操作。

[0023] 在进行页面拖拽生成时，采用Javacript技术点击或拖拽所述备选工具框中的组件即图片、文本或者动画至可编辑框内的模板上，进而触发鼠标事件mousedown复制组件至模板上的图层中，当松开鼠标按钮时触发鼠标事件mouseup完成对应组件的复制，再进行样式参数及交互参数的设置后，实现可视化拖拽操作生成html5页面。

[0024] 进一步地，在向可编辑框内的模板添加动画时，采用Animate.css库生成css3动画，封装js实现可视化展示，再通过工具编辑交互窗口对所选动画进行设置，再采用javascript绑定监控对象，通过浏览器渲染出对象的参数值，如width、height、transform等。

[0025] 另外，本方法中还可配置本地数据库，在完成所需的html5页面的制作后可选择存储于所述本地数据库中，用于二次开发。

[0026] 优选地，所述方法基于WEB实现在线编辑，打包压缩采用webpack进行压缩，数据存储用的服务器为云服务器或者自有独立服务器。

[0027] 综上可知，本发明所描述的基于JavaScript生成html5页面的方法，其能够通过拖拽数据库中的图片、文本或者动画，并实现界面各个部分的编辑，进而生成html5界面，界面的可调性高，且代码是公开的，可二次调整，便于用户操作。

[0028] 另外，该方法是基于WEB进行的，没有空间限制，整个操作过程为可视化操作，所见即所得，解决不会写代码的困扰，适用于各个阶段用户，软件架构于用户自有服务器，数据安全得以保障。

[0029] 至此，本领域技术人员应认识到，虽然本文已详尽示出和描述了本发明的多个示例性实施例，但是，在不脱离本发明精神和范围的情况下，仍可根据本发明公开的内容直接确定或推导出符合本发明原理的许多其他变型或修改。因此，本发明的范围应被理解和认定为覆盖了所有这些其他变型或修改。

标题	发布/更新时间	阅读量
具有选定纹理和着色的交易和ID卡	2020-05-13	85
一种文物指纹区域选定方法	2020-05-13	647
具有选定附属品的功能的放大器选定装置	2020-05-12	903
选定辅助系统和选定辅助方法	2020-05-11	958
橡胶的选定方法	2020-05-11	212
可选定角度的工具	2020-05-12	298
电动机结构选定装置及选定方法以及计算机可读保存介质	2020-05-12	144
电动卡车的行驶路线选定系统、电动卡车的行驶路线选定方法	2020-05-12	683
气动装置的选定方法	2020-05-11	635
为选定上下文构造词典	2020-05-12	156

一种基于JavaScript生成html5页面的方法

一种基于JavaScript生成html5页面的方法

技术领域

背景技术

发明内容

附图说明

具体实施方式

该功能需要专业版企业版VIP权限，您可以：