一种页面封装方法技术

本发明专利技术公开了一种页面封装方法，通过将web页面拆分，形成不同的框架布局、元素，栏目布局、样式等形成不同的封装模板，本发明专利技术通过页面的拆分与封装技术，形成统一规范，成功解决了web页面0代码封装的难题，提升页面封装的效率，同时降低了页面封装的门槛。也可以通过不同的框架+栏目组合，预置不同的web页面模板，解决快速定制、封装页面的问题。

【技术实现步骤摘要】
一种页面封装方法
本专利技术涉及页面封装
，具体为一种页面封装方法。
技术介绍
Web技术的发展，使得管理系统的开发更方便、功能更强大，在此系统的开发过程中，Web技术起了一个骨架式的支持作用；与此同时组件技术的发展为系统的开放性、集成性提供了便利，有效合理地引入组件技术是当前Web系统开发与发展的一个方向；通过对系统的开发进行建模，形象直观的图形化表示，可以显示系统的流程与功能。选择有效的建模方法，充分利用Web技术与组件技术，提高软件的开发效率，提高的软件的可靠性和可维护性，是每个软件开发人员所关心的问题。目前的web页面使用体验感差，而且现有的web页面仍需要使用代码进行封装，封装效率低，因此，有必要进行改进。
技术实现思路
本专利技术的目的在于提供一种页面封装方法，以解决上述
技术介绍
中提出的问题。为实现上述目的，本专利技术提供如下技术方案：一种页面封装方法,包括以下步骤：A、首先将web页面拆分，形成不同的PC门户组成元素；B、对不同的PC门户元素进行定义；C、将PC门户元素进行整体封装，实现对Web页面的封装。优选的，所述步骤A中PC门户组成元素包括主框架布局、主框架元素、栏目布局、栏目外框样式和栏目，所述PC门户各个组成元素形成不同的封装模板。优选的，所述步骤B中主框架布局的定义：是指门户最外层的布局；主框架元素的定义：是指主框架中的元素，但不包含中间区域的栏目；栏目布局的定义：是指框架中间部分的布局，一般用几行几列来表达；栏目外框样式的定义：主要对栏目的标题，背景色进行描述；栏目的定义：栏目的内容。优选的，所述主框架布局中，seeyonPortalLeft、seeyonPortalRight、seeyonPortalFooter是可选的，另外，用户可以设置seeyonPortalHeader的高度、seeyonPortalFooter的高度、seeyonPortalLeft的宽度，seeyonPortalRight的宽度，其中seeyonPortalLeft和seeyonPortalRight不能同时出现。优选的，所述主框架元素指主框架中seeyonPortalHeader、seeyonPortalLeft、seeyonPortalRight、seeyonPortalFooter、seeyonPortalBody中要显示的页面元素；主框架元素主要由四部分内容组成：html模板、css样式、js动作、json数据。优选的，所述栏目内容主要是包括栏目样式和栏目数据内容，以及对栏目内容的相关属性进行设置。优选的，一种页面封装系统，包括web页面拆分模块、PC门户元素定义模块和web页面封装模块，所述web页面拆分模块用于将web页面拆分，形成不同的PC门户组成元素；所述PC门户元素定义模块用于对不同的PC门户元素进行定义；所述web页面封装模块将PC门户元素进行整体封装。优选的，一种计算机存储介质，所述计算机存储介质上存储有计算机程序，所述计算机程序被处理器执行时，使得处理器执行上述所述页面封装方法的步骤。与现有技术相比，本专利技术的有益效果是：本专利技术通过将web页面拆分，形成不同的框架布局、元素，栏目布局、样式等形成不同的封装模板，本专利技术通过页面的拆分与封装技术，形成统一规范，成功解决了web页面0代码封装的难题，提升页面封装的效率，同时降低了页面封装的门槛。也可以通过不同的框架+栏目组合，预置不同的web页面模板，解决快速定制、封装页面的问题。附图说明图1为本专利技术页面封装流程图；图2为本专利技术PC门户示意图；图3为本专利技术主框架布局示意图；图4为本专利技术web页面封装示意图。具体实施方式下面将结合本专利技术实施例中的附图，对本专利技术实施例中的技术方案进行清楚、完整地描述，显然，所描述的实施例仅仅是本专利技术一部分实施例，而不是全部的实施例。基于本专利技术中的实施例，本领域普通技术人员在没有做出创造性劳动前提下所获得的所有其他实施例，都属于本专利技术保护的范围。在本专利技术的描述中，需要说明的是，术语“上”、“下”、“内”、“外”“前端”、“后端”、“两端”、“一端”、“另一端”等指示的方位或位置关系为基于附图所示的方位或位置关系，仅是为了便于描述本专利技术和简化描述，而不是指示或暗示所指的装置或元件必须具有特定的方位、以特定的方位构造和操作，因此不能理解为对本专利技术的限制。此外，术语“第一”、“第二”仅用于描述目的，而不能理解为指示或暗示相对重要性。在本专利技术的描述中，需要说明的是，除非另有明确的规定和限定，术语“安装”、“设置有”、“连接”等，应做广义理解，例如“连接”，可以是固定连接，也可以是可拆卸连接，或一体地连接；可以是机械连接，也可以是电连接；可以是直接相连，也可以通过中间媒介间接相连，可以是两个元件内部的连通。对于本领域的普通技术人员而言，可以具体情况理解上述术语在本专利技术中的具体含义。请参阅图1-4，本专利技术提供一种技术方案：本专利技术提供如下技术方案：一种页面封装方法,包括以下步骤：A、首先将web页面拆分，形成不同的PC门户组成元素；B、对不同的PC门户元素进行定义；C、将PC门户元素进行整体封装，实现对Web页面的封装。本专利技术中，步骤A中PC门户组成元素包括主框架布局、主框架元素、栏目布局、栏目外框样式和栏目，所述PC门户各个组成元素形成不同的封装模板。本专利技术中，步骤B中主框架布局的定义：是指门户最外层的布局，例如厂字型，网站型等；主框架元素的定义：是指主框架中的元素，但不包含中间区域的栏目，例如单位LOGO、名称、兼职切换；栏目布局的定义：是指框架中间部分的布局，一般用几行几列来表达；栏目外框样式的定义：主要对栏目的标题，背景色进行描述；栏目的定义：栏目的内容，比如已办栏目、待办栏目等。本专利技术中，主框架布局中，seeyonPortalLeft、seeyonPortalRight、seeyonPortalFooter是可选的，另外，用户可以设置seeyonPortalHeader的高度、seeyonPortalFooter的高度、seeyonPortalLeft的宽度，seeyonPortalRight的宽度，其中seeyonPortalLeft和seeyonPortalRight不能同时出现。本专利技术中，主框架元素指主框架中seeyonPortalHeader、seeyonPortalLeft、seeyonPortalRight、seeyonPortalFooter、seeyonPortalBody中要显示的页面元素；主框架元素主要由四部分内容组成：html模板、css样式、js动作、json数据。本专利技术中，栏目内容主要是包括栏目样式和栏目数据内容，以及对栏目内容的相关属性进行设置，常见的栏目样式模板：比如列表、日历、棋盘等。此外，本专利技术还公开了一种页面封装系统，包括web页面拆分模本文档来自技高网...

【技术保护点】
1.一种页面封装方法,其特征在于：包括以下步骤：/nA、首先将web页面拆分，形成不同的PC门户组成元素；/nB、对不同的PC门户元素进行定义；/nC、将PC门户元素进行整体封装，实现对Web页面的封装。/n

【技术特征摘要】
1.一种页面封装方法,其特征在于：包括以下步骤：
A、首先将web页面拆分，形成不同的PC门户组成元素；
B、对不同的PC门户元素进行定义；
C、将PC门户元素进行整体封装，实现对Web页面的封装。


2.根据权利要求1所述的一种页面封装方法，其特征在于：所述步骤A中PC门户组成元素包括主框架布局、主框架元素、栏目布局、栏目外框样式和栏目，所述PC门户各个组成元素形成不同的封装模板。


3.根据权利要求1所述的一种页面封装方法，其特征在于：所述步骤B中主框架布局的定义：是指门户最外层的布局；主框架元素的定义：是指主框架中的元素，但不包含中间区域的栏目；栏目布局的定义：是指框架中间部分的布局，一般用几行几列来表达；栏目外框样式的定义：主要对栏目的标题，背景色进行描述；栏目的定义：栏目的内容。


4.根据权利要求3所述的一种页面封装方法，其特征在于：所述主框架布局中，seeyonPortalLeft、seeyonPortalRight、seeyonPortalFooter是可选的，另外，用户可以设置seeyonPortalHeader的高度、seeyonPortalFooter的高度、seeyonPortalLeft的宽度，seeyonPortalR...

【专利技术属性】
技术研发人员：胡杨，张旭明，谭敏锋，徐石，
申请(专利权)人：北京致远互联软件股份有限公司，
类型：发明
国别省市：北京;11