(10)申请公布号
(43)申请公布日 (21)申请号 201510640489.3
web前端开发技术第三版pdf(22)申请日 2015.09.30
G06F 9/44(2006.01)
G06F 17/30(2006.01)
(71)申请人北京锐安科技有限公司
地址100044 北京市海淀区西小口路66号
中关村东升科技园北领地B-2号楼七
层
(72)发明人杜学良 万月亮 火一莽
(74)专利代理机构北京品源专利代理有限公司
11332
代理人
胡彬 孟金喆
(54)发明名称
Web 前端开发平台
(57)摘要
本发明公开了一种前端开发平台,其中包括:
页面模板提供模块,用于提供多种Web 显示主页
模板,所述主页模板中包含至少一个多级导航菜
单项和/或至少一个树结构导航菜单项;页面内
容模板提供模块,用于为Web 显示主页提供至少
一种页面内容模板,所述页面内容模板包含至少
一个文字内容导航选项和至少一个图标内容导航
选项。本发明实施例能够提高Web 前端开发的安
全性,并降低维护成本。(51)Int.Cl.
(19)中华人民共和国国家知识产权局(12)发明专利申请权利要求书1页 说明书4页 附图3页CN 105242926 A 2016.01.13
C N 105242926
A
1.一种Web前端开发平台,其特征在于,包括:
页面模板提供模块,用于提供多种Web显示主页模板,所述主页模板中包含至少一个多级导航菜单项和/或至少一个树结构导航菜单项;
页面内容模板提供模块,用于为Web显示主页提供至少一种页面内容模板,所述页面内容模板包含至少一个文字内容导航选项和至少一个图标内容导航选项。
2.根据权利要求1所述的平台,其特征在于,还包括:
组件修改模块,用于对平台中的已有模板或组件进行修改,以Web显示出不同的风格。
3.根据权利要求2所述的平台,其特征在于,还包括:
项目添加模块,用于添加新开发出的具有特效功能的模板或组件。
4.根据权利要求3所述的平台,其特征在于,还包括:
样式模板模块,用于提供基本布局、控制展现方式、创建图标、创建按钮、创建菜单选项和创建工具条中的至少一种功能。
5.根据权利要求4所述的平台,其特征在于,还包括:
兼容模块,用于与网页浏览器IE6以上、火狐浏览器FireFox、谷歌Chrome和Safira中至少一种主流浏览器兼容。
6.根据权利要求5所述的平台,其特征在于,所述页面模板提供模块、所述页面内容模板提供模块、所述组件修改模块、所述项目添加模块、所述样式模板模块和所述兼容模块间两两相互独立。
7.根据权利要求4所述的平台,其特征在于,所述样式模板模块与表单元组件相关联。
8.根据权利要求1~7任一项所述的平台,其特征在于,还包括:
数据组件,用于与所述轻量级的数据交换格式JSON组件相关联,获取对应的JSON数据项。
9.根据权利要求1~7任一项所述的平台,其特征在于,还包括:
数据表格组件,用于获取Web前端显示所需的数据。
10.根据权利要求1~7任一项所述的平台,其特征在于,所述主页模板还包含抽屉型导航菜单项。
Web前端开发平台
技术领域
[0001] 本发明实施例涉及互联网技术领域,尤其涉及一种Web前端开发平台。
背景技术
[0002] 互联网显示页面(World Wide Web,Web)技术是随着Internet的普及使用而发展起来的一门技术,它的发明极大地方便了人们对互联网上资源的组织和访问。
[0003] 现有技术中,对于Web前端技术的开发,一般采取直译式脚本语言JavaScript和轻量级的JavaScript脚本语言JQuery两种技术相混合的方法,这需要开发人员需要了解很多的前台技术内容,并且需要掌握大量JavaScript或JQuery的使用方法,而且在开发过程中需要编写大量的程序代码。
[0004] 然而这两种技术混合使用存在着诸多弊端:(1)缺乏安全性,由于JavaScript的安全问题,黑客可以利用这些漏洞植入一些软件、劫持用户会话等。(2)缺乏维护性,需要开发人员了解大量的前台知识才能维护本系统,会增加维护成本。
发明内容
[0005] 本发明实施例提供一种Web前端开发平台,提高Web前端开发的安全性,并降低维护成本。
[0006] 本发明实施例提供了一种Web前端开发平台,包括:
[0007] 页面模板提供模块,用于提供多种Web显示主页模板,所述主页模板中包含至少一个多级导航菜单项和/或至少一个树结构导航菜单项;
[0008] 页面内容模板提供模块,用于为Web显示主页提供至少一种页面内容模板,所述页面内容模板包含至少一个文字内容导航选项和至少一个图标内容导航选项。
[0009] 本发明实施例通过页面模板提供模块提供多种Web显示主页模板,所述主页模板中包含至少一个多级导航菜单项和/或至少一个数结构导航菜单项;通过页面内容模板提供模块为Web显示主页提供至少一种页面内容模板,所述页面内容模板包含至少一个文字内容导航选项和至少一个图标内容导航选项。本发明实施例能够提高Web前端开发的安全性,并降低维护成本。
附图说明
[0010] 图1为本发明实施例提供的Web前端开发平台的结构示意图;
[0011] 图2为本发明实施例提供的Web前端开发平台中的抽屉型导航菜单项的显示界面示意图;
[0012] 图3为本发明实施例提供的Web前端开发平台中的图标内容导航选项的显示界面示意图;
[0013] 图4为本发明实施例提供的Web前端开发平台中的将网页原始的提示信息改造成新的风格的示例示意图;
[0014] 图5为本发明实施例提供的Web前端开发平台中的新增部分组件的示例示意图;[0015] 图6为本发
明实施例提供的Web前端开发平台中的图标库的示例示意图;[0016] 图7为本发明实施例提供的Web前端开发平台中的组件与特效的分离版本的示例示意图。
具体实施方式
[0017] 下面结合附图和实施例对本发明作进一步的详细说明。可以理解的是,此处所描述的具体实施例仅仅用于解释本发明,而非对本发明的限定。另外还需要说明的是,为了便于描述,附图中仅示出了与本发明相关的部分而非全部结构。
[0018] 图1为本发明实施例提供的Web前端开发平台的结构示意图,如图1所示,具体包括:页面模板提供模块11和页面内容模板提供模块12;
[0019] 所述页面模板提供模块11用于提供多种Web显示主页模板,所述主页模板中包含至少一个多级导航菜单项和/或至少一个树结构导航菜单项;
[0020] 其中,多级导航菜单项可为纵向或横向的多级导航菜单项,所述树结构导航菜单项也可为横向的树状导航菜单项。所述页面模板提供模块11可提供十多种甚至更多的Web 显示主页模板。另外,所述主页模板中还包含至少一个抽屉型导航菜单项。
[0021] 具体的,所述多级导航菜单项和所述树结构导航菜单项可为通过门户portal认证的导航菜单项,
且每种导航结构支持的菜单层级也不尽相同。如图2所示,为本实施例提供的抽屉型导航菜单项的显示界面示意图。开发者可以根据自己的需要选择任意一种或多种,然后基于选定的Web显示主页模板进行开发。十多种主页模板足够应对各种各样的Web 显示系统的需求。
[0022] 所述页面内容模板提供模块12用于为Web显示主页提供至少一种页面内容模板,所述页面内容模板包含至少一个文字内容导航选项和至少一个图标内容导航选项。[0023] 具体的,如图3所示,为本实施例提供的图标内容导航选项的显示界面示意图。另外,所述页面内容模板提供模块12可提供非常多的页面内容模板,并可给出代码示例。开发者在制作一个页面时,可以根据自己的需要到合适的页面内容模板,然后通过拷贝或者修改相关代码即可做出美观、兼容性好、用户体验良好的页面。
[0024] 本实施例通过页面模板提供模块提供多种Web显示主页模板,所述主页模板中包含至少一个多级导航菜单项和/或至少一个数结构导航菜单项;通过页面内容模板提供模块为Web显示主页提供至少一种页面内容模板,所述页面内容模板包含至少一个文字内容导航选项和至少一个图标内容导航选项。本实施例提供的Web前端开发平台包含了大量主页模板和页面内容模板,开发人员在开发时只需要调用这些模板即可,而无需编写大量的程序代码进行实现,可以提高开发效率,并且本实施例提供的Web前端开发平台还能够提高Web前端开发的安全性,并降低维护成本。
[0025] 示例性的,在上述实施例的基础上,所述Web前端开发平台还包括:
[0026] 组件修改模块,用于对平台中的已有模板或组件进行修改,以Web显示出不同的风格。
[0027] 具体的,所述组件修改模块可对已有的网页原有组件或模板进行改进,一方面可以提高组件或模板的美观和扩展性,另一方面还不影响开发者的开发习惯,有助于开发效
率的进一步提升。如图4所示,为将网页原始的提示信息改造成新的风格的示例。[0028] 示例性的,在上述实施例的基础上,所述Web前端开发平台还包括:
[0029] 项目添加模块,用于添加新开发出的具有特效功能的模板或组件。
[0030] 具体的,当开发人员开发了具备新功能的组件或模板后,可通过项目添加模块将其添加到开发平台中,为开发者提供更为强大的组件和特效使用,可极大地提高开发效率和用户的体验度。如图5所示,为新增的部分组件的示例。
[0031] 示例性的,在上述实施例的基础上,所述Web前端开发平台还包括:
[0032] 样式模板模块,用于提供基本布局、控制展现方式、创建图标、创建按钮、创建菜单选项和创建工具条中的至少一种功能。
[0033] 具体的,所述样式模板模块就是一些已经写好的显示样式,要实现主页外观上的调整,只要使用
命令(例如class=“xxx”)就可以了,不必再写相关的程序代码,能够很大程度地提高开发效率。其中,所述样式模板模块可包含控制基本布局(例如,浮动、对齐和行高等)、控制表现(宽高、颜、字号和缩进等)、图标库等。以图标库为例,使用图标库可以通过一句话很方便地创建图标,应用于按钮、菜单项、工具条中,如图6所示,为提供图标库的示例。
[0034] 示例性的,在上述实施例的基础上,所述Web前端开发平台还包括:
[0035] 兼容模块,用于与网页浏览器IE6以上、火狐浏览器FireFox、谷歌Chrome和Safira中至少一种主流浏览器兼容。
[0036] 具体的,所述兼容模块通过采用多种兼容性技术确保制作的Web前端浏览器与已有的多种主流浏览器兼容。例如可以与IE6、IE7、IE8、IE9、FireFox、Chrome、Safira等主流浏览器完美兼容。
[0037] 示例性的,在上述实施例的基础上,所述页面模板提供模块、所述页面内容模板提供模块、所述组件修改模块、所述项目添加模块、所述样式模板模块和所述兼容模块间两两相互独立。
[0038] 例如,如图7所示,制作的WEB前端只需要使用平台的某几个组件或特效,那么不必将整套平台机制全部引入到平台项目中,本实施例提供组件与特效的分离版本,每个组件都是一个独立的文件包。
[0039] 示例性的,在上述实施例的基础上,所述样式模板模块与表单元组件相关联。[0040] 例如,所述
表单元组件可提供如图5所示的图标选项。在后续制作Web页面时,可直接从表单元组件中获取相应的图标。
[0041] 示例性的,在上述实施例的基础上,所述Web前端开发平台还包括:
[0042] 数据组件,用于与所述轻量级的数据交换格式JSON组件相关联,获取对应的JSON 数据项。
[0043] 具体的,所述数据组件支持JSON数据,通过代码也可以看出。所述数据组件可通过一个url获取JSON数据,这样组件的数据项就构建出来了。例如,通过一个url获取JSON 数据的实现代码如下:
[0044] 第一种url方式,代码如下:
[0045] <select url="${CONTEXT_PATH}/radio_dropdown/getProvinces.do"> [0046] </select>
版权声明:本站内容均来自互联网,仅供演示用,请勿用于商业和其他非法用途。如果侵犯了您的权益请与我们联系QQ:729038198,我们将在24小时内删除。
发表评论