CN109445775A - 一键活动内嵌代码方法、装置及计算机可读存储介质 - Google Patents
一键活动内嵌代码方法、装置及计算机可读存储介质 Download PDFInfo
- Publication number
- CN109445775A CN109445775A CN201811190588.6A CN201811190588A CN109445775A CN 109445775 A CN109445775 A CN 109445775A CN 201811190588 A CN201811190588 A CN 201811190588A CN 109445775 A CN109445775 A CN 109445775A
- Authority
- CN
- China
- Prior art keywords
- file
- key
- function
- html
- loose
- Prior art date
- Legal status (The legal status is an assumption and is not a legal conclusion. Google has not performed a legal analysis and makes no representation as to the accuracy of the status listed.)
- Granted
Links
Classifications
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/38—Creation or generation of source code for implementing user interfaces
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/30—Creation or generation of source code
- G06F8/35—Creation or generation of source code model driven
-
- G—PHYSICS
- G06—COMPUTING; CALCULATING OR COUNTING
- G06F—ELECTRIC DIGITAL DATA PROCESSING
- G06F8/00—Arrangements for software engineering
- G06F8/40—Transformation of program code
- G06F8/41—Compilation
-
- Y—GENERAL TAGGING OF NEW TECHNOLOGICAL DEVELOPMENTS; GENERAL TAGGING OF CROSS-SECTIONAL TECHNOLOGIES SPANNING OVER SEVERAL SECTIONS OF THE IPC; TECHNICAL SUBJECTS COVERED BY FORMER USPC CROSS-REFERENCE ART COLLECTIONS [XRACs] AND DIGESTS
- Y02—TECHNOLOGIES OR APPLICATIONS FOR MITIGATION OR ADAPTATION AGAINST CLIMATE CHANGE
- Y02D—CLIMATE CHANGE MITIGATION TECHNOLOGIES IN INFORMATION AND COMMUNICATION TECHNOLOGIES [ICT], I.E. INFORMATION AND COMMUNICATION TECHNOLOGIES AIMING AT THE REDUCTION OF THEIR OWN ENERGY USE
- Y02D10/00—Energy efficient computing, e.g. low power processors, power management or thermal management
Landscapes
- Engineering & Computer Science (AREA)
- General Engineering & Computer Science (AREA)
- Theoretical Computer Science (AREA)
- Software Systems (AREA)
- Physics & Mathematics (AREA)
- General Physics & Mathematics (AREA)
- Human Computer Interaction (AREA)
- Information Transfer Between Computers (AREA)
- Information Retrieval, Db Structures And Fs Structures Therefor (AREA)
Abstract
一键活动内嵌代码方法、装置及计算机可读存储介质,该方法包括:编辑并生成具有预设功能的一键活动的模板,其中,在Html头部设置H5活动页面的宽度、高度、最大、最小比例数据,以构成H5活动页面的基本样式,并控制H5活动页面的页面大小;在Html尾部引入.js文件计算内容展示区域在H5活动页面中的位置;在一键活动的模板内嵌入可修改一键活动的页面的逻辑、样式、功能点的代码,其中,在HTML内容中添加标签,通过标签的class应用额外的样式,或将多种样式预先定义好,放在.css的文件中,然后在页面中根据需要使用其中已定义好的样式。通过本发明可通过内嵌代码改变现有模块功能的逻辑样式,从而满足使用者的需求。
Description
技术领域
本发明涉及互联网技术领域,具体地说,涉及一种一键活动内嵌代码方法、装置及计算机可读存储介质。
背景技术
一键活动是将具有预设功能的H5的程序封装,使得可以一键操作完成预设的功能,然而在使用H5(Html5)活动时,由于一键活动是实现预设的活动功能,只能使用已有的功能模块去设置一键活动的内容,该功能模块未必能够满足使用者的需求,而使用者却不能改变现有模块功能的某些逻辑样式。
发明内容
为解决以上问题,本发明提供一种一键活动内嵌代码方法,应用于电子装置,该方法包括:编辑并生成具有预设功能的一键活动的模板,其中,一键活动的模板的基本结构是,在Html(超文本标记语言)头部设置H5活动页面的宽度、高度、最大、最小比例数据,其中,在Html头部中引入onekey文件,所述onekey文件包括base.css文件,以构成H5活动页面的基本样式,并且,还引入resize.js文件,从而计算页面缩放比例,以控制H5活动页面的页面大小,其中,所述onekey为一种H5页面开发平台;在Html尾部引入content_position.js文件,从而计算内容展示区域在H5活动页面中的位置;在所述一键活动的模板内嵌入可修改一键活动的页面的逻辑、样式、功能点的代码,从而在一键活动的模板上引入自定义的至少包括Html、Js、Css、图片、音频的资源,其中,在HTML内容中添加标签,通过标签的class应用额外的样式,或将多种样式预先定义好,放在.css的文件中,然后在页面中根据需要使用其中已定义好的样式。
优选地,在Html尾部引入jquery.min.js文件,所述jquery.min.js文件是在完整版的jQuery库中去掉空白字符、注释、空行经压缩形成的。
优选地,前端与后端的连接采用ajax的请求方式,并且首选以post的形式进行发送请求。
优选地,前端与后端的接口是Onekey标准接口、Esg标准接口或外部接口。
优选地,Onekey标准接口采用同步或异步传输的方式,其中,同步传输采用common.standardRequest封装函数来执行param,dataurl命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,通过common.standardRequest封装函数获取文件存放的地址参数;而异步传输采用common.standardAsyncRequest封装函数来执行param,dataurl,successcallback,failcallback命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,Successcallback是指在发送请求成功后,文件存放地址参数传递给回调函数,而回调函数决定当AJAX请求成功后显示的消息,failcallback是指发送请求失败后,执行的回调函数,回调函数决定当AJAX请求失败后显示的消息。
优选地,Esg标准接口采用同步或异步传输的方式,其中,同步传输采用common.esgrequest封装函数来执行param,dataurl命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,通过common.standardRequest封装函数获取文件存放的地址参数;而异步传输采用common.esgAsyncRequest封装函数来执行param,dataurl,successcallback,failcallback命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,Successcallback是指在发送请求成功后,文件存放地址参数传递给回调函数,而回调函数决定当AJAX请求成功后显示的消息,failcallback是指发送请求失败后,执行的回调函数,回调函数决定当AJAX请求失败后显示的消息。
优选地,一键活动模板还具有添加删除进度显示功能、弹窗提示功能、弹窗功能、更换页面背景图片及背景色的功能、跳转到指定页码的功能。
本发明还提供一种电子装置,所述电子装置包括存储器及与所述存储器连接的处理器,所述存储器中存储有可在所述处理器上运行的一键活动内嵌代码程序,所述一键活动内嵌代码程序被所述处理器执行时实现如下步骤:编辑并生成具有预设功能的一键活动的模板,其中,一键活动的模板的基本结构是,在Html头部设置H5活动页面的宽度、高度、最大、最小比例数据,其中,在Html头部中引入onekey文件,所述onekey文件包括base.css文件,以构成H5活动页面的基本样式,并且,还引入resize.js文件,从而计算页面缩放比例,以控制H5活动页面的页面大小,其中,所述onekey为一种H5页面开发平台;在Html尾部引入content_position.js文件,从而计算内容展示区域在H5活动页面中的位置;在所述一键活动的模板内嵌入可修改一键活动的页面的逻辑、样式、功能点的代码,从而在一键活动的模板上引入自定义的至少包括Html、Js、Css、图片、音频的资源,其中,在HTML内容中添加标签,通过标签的class应用额外的样式,或将多种样式预先定义好,放在.css的文件中,然后在页面中根据需要使用其中已定义好的样式。
优选地,编辑并生成具有预设功能的一键活动的模板的步骤中,在Html尾部引入jquery.min.js文件,所述jquery.min.js文件是在完整版的jQuery库中去掉空白字符、注释、空行经压缩形成的。
本发明还提供一种计算机可读存储介质,所述计算机可读存储介质中包括一键活动内嵌代码程序,所述一键活动内嵌代码程序被处理器执行时,实现如上所述的一键活动内嵌代码方法的步骤。
采用本发明的一键活动内嵌代码方法、装置及计算机可读存储介质,在用一键活动模板编辑活动时可以先配置好活动的大部分内容,然后再根据内嵌代码的不同可以实现一键活动以外的所需功能。
附图说明
通过结合下面附图对其实施例进行描述,本发明的上述特征和技术优点将会变得更加清楚和容易理解。
图1是表示本发明实施例的一键活动内嵌代码方法的流程图;
图2是表示本发明实施例的电子装置1的硬件架构示意图;
图3是表示本发明实施例的一键活动内嵌代码程序的程序模块图;
图4是表示本发明实施例的H5活动页面构建模块的构成图;
图5是表示本发明实施例的内嵌代码模块的构成图;
图6是表示本发明实施例的H5活动页面基础样式设置单元的构成图。
具体实施方式
下面将参考附图来描述本发明所述的一键活动内嵌代码方法、装置及计算机可读存储介质的实施例。本领域的普通技术人员可以认识到,在不偏离本发明的精神和范围的情况下,可以用各种不同的方式或其组合对所描述的实施例进行修正。因此,附图和描述在本质上是说明性的,而不是用于限制权利要求的保护范围。此外,在本说明书中,附图未按比例画出,并且相同的附图标记表示相同的部分。
一键活动内嵌代码的方法,该方法包括:
步骤S10,编辑并生成具有预设功能的一键活动的模板;
步骤S30,在所述一键活动的模板内嵌入可修改一键活动页面的逻辑、样式、功能点的代码,从而在一键活动的模板上引入自定义的至少包括Html、Js、Css、图片、音频的资源,其中,一键活动是指通过封装的程序形成的具有预设功能的模板。
一键活动的活动页面加载的过程,也就是加载HTML文件的过程,HTML文件由多个嵌套的HTML元素组成,HTML元素可以包括活动页面标题、活动页面段落等,每个HTML元素通过若干CSS样式(层叠样式表单)进行描述,CSS样式的描述对象即为HTML元素,CSS样式包括多个属性和对应的值,例如,color表示属性为“颜色”,而red表示颜色的属性值为“红色”。在加载活动页面的过程中,浏览器需要找到HTML元素声明的CSS样式应用到该HTML元素上,以便使HTML元素呈现出预设效果。
在一个可选实施例中,构建一键活动的模板的步骤S10还包括步骤S101,在Html头部设置H5活动页面的宽度、高度、最大最小比例等数据。具体说,在Html头部中引入onekey(一种H5页面开发平台)文件,所述onekey文件包括base.css文件,以构成H5活动页面的基本样式。并且,还引入resize.js文件,从而计算活动页面缩放比例,以控制H5活动页面大小。
在一个可选实施例中,构建一键活动的模板的步骤S10还包括步骤S103,在Html尾部引入content_position.js文件,用于计算内容展示区域的在活动页面中的位置。
优选地,还可以在Html尾部引入jquery.min.js文件,jquery.min.js是由完整版的jQuery库经过压缩得来,压缩后功能与未压缩的完全一样,只是将其中的空白字符、注释、空行等与逻辑无关的内容删除,并进行一些优化。可以减小文件体积,降低网站流量,提升访问速度等。
以上是得到一键活动的模板,在将一键活动所要实现的预设功能的代码封装后,为了实现一键活动以外的对活动页面的逻辑、样式、功能进行修改,在一键活动的模板上引入自定义的Html、Js、Css、图片、音频等资源,可以设置不同的代码段,并以模块的形式嵌入在一键活动的模板中,例如Html引入模块、Js引入单元、Css引入单元、图片引入模块、音频引入模块,各模块均以不同的代码段的形式嵌入在一键活动模板中,并且,使得使用者可以自行选择是否对一键活动进行修改,以及进行哪些修改。
例如,步骤S30可以包括步骤S301,修改一键活动页面的样式,可以在HTML内容中添加标签<div>,<div>是用来为HTML文档内大块的内容提供结构和背景的元素。在<div>…<div>之间添加自定义的代码段。例如,可以通过<div>的class应用额外的样式,用来定义这个对象的样式的,比如,高宽、字体、边框、颜色、背景等等。可以直接把class的属性写在这个对象里,但不能共用。
为使class可以使多个不同的对象拥有相同的外观样式,可以把很多样式预先定义好,放在.css的文件中,然后在活动页面中根据需要使用其中已定义好的样式,class告诉页面当前的对象使用的是哪个样式。例如,对于常规页面和加长页面,分别使class对应不同的css样式,从而使加长页面具有加长的框架样式。
在一个可选实施例中,步骤S30可以包括步骤S303,Js引入单元、Css引入单元的代码段内可以分别引用.js、.Css文件,其中,.js文件是用javascript脚本语言编写的文件,可以通过该文件对H5活动模板进行修改。可以通过<script标签来引用.js文件。CSS文件是CSS语言(一种样式设计语言)编写CSS样式生成的文件。
在一个可选实施例中,由于CSS语言是一种低级语言,因此采用该语言生成CSS样式的效率不高,可以采用JavaScript高级脚本语言,JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言,可以通过JavaScript定义CSS样式,从而可以有效提高CSS样式的生成效率。脚本样式文件可以具体为通过JavaScript生成的JS样式文件。JavaScript作为一种面向对象的高级语言,可以通过其预先定义用于生成CSS样式文件的JS样式文件,由于JavaScript具有继承、条件判断、变量声明等功能,因此可以通过较少的代码量生成JS样式文件,相应提高CSS样式的生成效率。
可以预先在本地编译CSS样式,可以包括:对脚本样式文件进行本地编译生成若干CSS样式,将CSS样式保存到CSS样式列表中。也可以在浏览器加载活动页面过程中实时编译CSS样式,可以包括:将脚本样式文件嵌入到浏览器库中,在加载网页的HTML文件时,获取HTML文件中的HTML元素声明的样式类型,根据样式类型,实时编译浏览器库中的脚本样式文件生成目标CSS样式。
如果是在本地编译CSS样式,则可以在加载网页的HTML文件时,获取HTML文件中的HTML元素声明的样式类型,根据样式类型从CSS样式列表中查找目标CSS样式,将查找到的目标CSS样式应用到HTML元素上。
如果是在浏览器加载网页过程中实时编译CSS样式,则可以将编译生成的目标CSS样式直接应用到所述HTML元素上。
前端开发的一键活动需要与后端对接,前端的活动页面只负责提供视图,不提供内容,而后端只提供内容,对接就是把后端的内容放在前端的活动页面预留出来的位置上,其具体流程是后端接收用户请求,找到负责处理的程序,处理程序找到要传输给用户的前端的活动页面,该前端的活动页面留出位置,后端到数据库取数据,后端把数据放在前端留出来的位置上,结合成真正用户看到的html文件,传输给用户。
在一个可选实施例中,前端与后端的连接采用ajax(异步JavaScript和XML,是指一种创建交互式网页应用的网页开发技术)的请求方式,优选为以post的形式进行发送请求,其中,接口可以是Onekey标准接口、Esg标准接口或其他外部接口。
下面以Onekey标准接口为例简单说明,Onekey标准接口同步传输可以采用common.standardRequest封装函数来执行param,dataurl命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端。dataurl为文件存放地址。则common.standardRequest封装函数可以获取文件存放的地址参数。
而采用异步传输,采用common.standardAsyncRequest封装函数来执行param,dataurl,successcallback,failcallback命令。其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端。dataurl为文件存放地址。Successcallback是指在发送请求成功后,文件存放地址参数传递给回调函数,而回调函数决定当AJAX请求成功后显示的消息。failcallback是指发送请求失败后,执行的回调函数,回调函数决定当AJAX请求失败后显示的消息。
同样地,采用Esg标准接口、外部接口请求的函数如下:
Esg标准接口采用同步或异步传输的方式,其中,
同步传输采用common.esgrequest封装函数来执行param,dataurl命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,通过common.standardRequest封装函数获取文件存放的地址参数;
而异步传输采用common.esgAsyncRequest封装函数来执行param,dataurl,successcallback,failcallback命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,Successcallback是指在发送请求成功后,文件存放地址参数传递给回调函数,而回调函数决定当AJAX请求成功后显示的消息,failcallback是指发送请求失败后,执行的回调函数,回调函数决定当AJAX请求失败后显示的消息。
外部接口请求:
同步:common.partnerRequest(param,dataurl)
异步:common.partnerAsyncRequest(param,dataurl,successcallback,failcallback)
以上,ajax中的同步是必须等服务器返回了结果后,才会去执行success的方法,ajax的success方法没有执行的情况下,ajax块外面的js代码是不执行的;
ajax中的异步是不需要等服务器返回了结果,就可以去执行ajax块外面的js代码,等服务器返回了结果后再执行success方法。
优选地,一键活动模板还具有添加删除进度显示功能,其函数如下:
Common.loading();
Common.removeloading()
优选地,一键活动模板还具有弹窗提示功能,其函数如下:
Common.alert(“欢迎光临”)
优选地,一键活动模板还具有弹窗功能,其函数如下:
Common.popwindow(),弹窗可以显示标题和内容,可以采用Html代码或引入文本文件的形式设置显示的内容。
优选地,一键活动模板还具有更换活动页面背景图片、背景色的功能,其函数如下:
Common.setpagebgImage(),可以修改活动页面的index值、图片的url;
Common.setpagebgcolor(),可以修改活动页面的index值,颜色值。
优选地,一键活动模板还具有跳转到指定页码的功能,其函数如下:
Common.jumpage(),可以跳转是下一页或按pageId跳转。
图2所示是本发明电子装置1的硬件架构示意图。所述电子装置1是一种能够按照事先设定或者存储的指令,自动进行数值计算和/或信息处理的设备。所述电子装置1可以是计算机、也可以是单个网络服务器、多个网络服务器组成的服务器组或者基于云计算的由大量主机或者网络服务器构成的云,其中云计算是分布式计算的一种,由一群松散耦合的计算机集组成的一个超级虚拟计算机。
在本实施例中,电子装置1可包括,但不仅限于,可通过系统总线相互通信连接的存储器11、处理器14和显示器15,需要指出的是,图2仅示出了具有部分组件的电子装置1,但是应理解的是,并不要求实施所有示出的组件,可以替代的实施更多或者更少的组件。
其中,存储器11包括内存及至少一种类型的可读存储介质。内存为电子装置1的运行提供缓存;可读存储介质可为如闪存、硬盘、多媒体卡、卡型存储器(例如,SD或DX存储器等)、随机访问存储器(RAM)、静态随机访问存储器(SRAM)、只读存储器(ROM)、电可擦除可编程只读存储器(EEPROM)、可编程只读存储器(PROM)、磁性存储器、磁盘、光盘等的非易失性存储介质。在一些实施例中,可读存储介质可以是电子装置1的内部存储单元,例如该电子装置1的硬盘;在另一些实施例中,该非易失性存储介质也可以是电子装置1的外部存储设备,例如电子装置1上配备的插接式硬盘,智能存储卡(Smart Media Card),安全数字(Secure Digital)卡,闪存卡(Flash Card)等。本实施例中,存储器11的可读存储介质通常用于存储安装于电子装置1的操作系统和各类应用软件,例如本实施例中的一键活动内嵌代码程序的代码等。此外,存储器11还可以用于暂时地存储已经输出或者将要输出的各类数据。
所述处理器14用于运行所述存储器11中存储的程序代码或者处理数据。
一键活动内嵌代码程序存储在存储器11中,包括至少一个存储在存储器中的计算机可读指令,该至少一个计算机可读指令可被处理器14执行,以实现本申请各实施例的方法;以及,该至少一个计算机可读指令依据其各部分所实现的功能不同,可被划为不同的逻辑模块。
上述一键活动内嵌代码程序被所述处理器14执行时实现具有预设功能的活动页面,并根据自身需要引入自定义的至少包括Html、Js、Css、图片、音频的资源。
图3所示为一键活动内嵌代码程序50的程序模块图。在本实施例中,一键活动内嵌代码程序被分割为多个模块,该多个模块被存储于存储器11中,并由处理器14执行,以完成本发明。本发明所称的模块是指能够完成特定功能的一系列计算机程序指令段。
所述一键活动内嵌代码程序50可以被分割为:H5活动页面构建模块51、内嵌代码模块52、接口模块53。
其中,H5活动页面构建模块51用于构建H5活动页面,H5活动页面构建模块51又包括H5活动页面基础样式设置单元511,H5活动页面基础样式设置单元511在Html头部设置H5活动的宽度、高度、最大最小比例等数据。具体说,在Html头部中引入onekey(一种H5页面开发平台)文件,所述onekey文件包括base.css文件,以构成H5活动的基本样式。
进一步地,H5活动页面构建模块51又包括活动页面缩放比例设置单元512,活动页面缩放比例设置单元512引入resize.js文件,从而计算活动页面缩放比例,以控制H5活动页面大小。
进一步地,H5活动页面构建模块51又包括展示位置设置单元513,展示位置设置单元513在Html尾部引入content_position.js文件,用于计算内容展示区域的在活动页面中的位置。
进一步地,H5活动页面构建模块51又包括压缩优化单元514,压缩优化单元514可以在Html尾部引入jquery.min.js文件,jquery.min.js是由完整版的jQuery库经过压缩得来,压缩后功能与未压缩的完全一样,只是将其中的空白字符、注释、空行等与逻辑无关的内容删除,并进行一些优化。可以减小文件体积,降低网站流量,提升访问速度。
以上是得到一键活动的模板,在将一键活动所要实现的预设功能的代码封装后,为了实现一键活动以外的对活动页面的逻辑、样式、功能进行修改,在一键活动的模板上引入自定义的Html、Js、Css、图片、音频等资源,可以设置不同的代码段,并以模块的形式嵌入在一键活动的模板中,例如Html引入模块、Js引入单元、Css引入单元、图片引入模块、音频引入模块,各模块均以不同的代码段的形式嵌入在一键活动模板中,并且,使得使用者可以自行选择是否对一键活动进行修改,以及进行哪些修改。
例如,内嵌代码模块52可以包括活动页面样式修改单元521,活动页面样式修改单元521可以修改一键活动页面的样式,具体说,活动页面样式修改单元521可以是在HTML内容中添加标签<div>,<div>是用来为HTML文档内大块的内容提供结构和背景的元素。在<div>…<div>之间添加自定义的代码段。例如,可以通过<div>的class应用额外的样式,用来定义这个对象的样式的,比如,高宽、字体、边框、颜色、背景等等。可以直接把class的属性写在这个对象里,但不能共用。
为使class可以使多个不同的对象拥有相同的外观样式,可以把很多样式预先定义好,放在.css的文件中,然后在活动页面中根据需要使用其中已定义好的样式,class告诉活动页面当前的对象使用的是哪个样式。例如,对于常规页面和加长页面,分别使class对应不同的css样式,从而使加长页面具有加长的框架样式。
在一个可选实施例中,内嵌代码模块52可以包括Js引入单元522、Css引入单元523,Js引入单元522、Css引入单元523的代码段内可以分别引用.js、.Css文件,其中,.js文件是用javascript脚本语言编写的文件,可以通过该文件对H5活动模板进行修改。可以通过<script标签来引用.js文件。CSS文件是CSS语言(一种样式设计语言)编写CSS样式生成的文件。而例如图片、音频等则可以通过.Css文件中的地址来引入到H5活动页面中。
进一步地,由于CSS语言是一种低级语言,因此采用该语言生成CSS样式的效率不高,Css引入单元523可以采用JavaScript高级脚本语言,JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言,可以通过JavaScript定义CSS样式,从而可以有效提高CSS样式的生成效率。脚本样式文件可以具体为通过JavaScript生成的JS样式文件。JavaScript作为一种面向对象的高级语言,可以通过其预先定义用于生成CSS样式文件的JS样式文件,由于JavaScript具有继承、条件判断、变量声明等功能,因此可以通过较少的代码量生成JS样式文件,相应提高CSS样式的生成效率。
可以预先在本地编译CSS样式,可以包括:对脚本样式文件进行本地编译生成若干CSS样式,将CSS样式保存到CSS样式列表中。也可以在浏览器加载活动页面过程中实时编译CSS样式,可以包括:将脚本样式文件嵌入到浏览器库中,在加载网页的HTML文件时,获取HTML文件中的HTML元素声明的样式类型,根据样式类型,实时编译浏览器库中的脚本样式文件生成目标CSS样式。
如果是在本地编译CSS样式,则可以在加载网页的HTML文件时,获取HTML文件中的HTML元素声明的样式类型,根据样式类型从CSS样式列表中查找目标CSS样式,将查找到的目标CSS样式应用到HTML元素上。
如果是在浏览器加载网页过程中实时编译CSS样式,则可以将编译生成的目标CSS样式直接应用到所述HTML元素上。
前端开发的一键活动需要与后端对接,前端活动页面只负责提供视图,不提供内容,而后端只提供内容,对接就是把后端的内容放在前端活动页面预留出来的位置上,其具体流程是后端接收用户请求,找到负责处理的程序,处理程序找到要传输给用户的前端活动页面,该前端活动页面留出位置,后端到数据库取数据,后端把数据放在前端留出来的位置上,结合成真正用户看到的html文件,传输给用户。
在一个可选实施例中,接口模块53采用ajax(异步JavaScript和XML,是指一种创建交互式网页应用的网页开发技术)的请求方式连接前端与后端,优选为以post的形式进行发送请求,其中,接口模块53可以是Onekey标准接口、Esg标准接口或其他外部接口。
下面以Onekey标准接口为例简单说明,Onekey标准接口同步传输可以采用common.standardRequest封装函数来执行param,dataurl命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端。dataurl为文件存放地址。则common.standardRequest封装函数可以获取文件存放的地址参数。
而采用异步传输,采用common.standardAsyncRequest封装函数来执行param,dataurl,successcallback,failcallback命令。其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端。dataurl为文件存放地址。Successcallback是指在发送请求成功后,文件存放地址参数传递给回调函数,而回调函数决定当AJAX请求成功后显示的消息。failcallback是指发送请求失败后,执行的回调函数,回调函数决定当AJAX请求失败后显示的消息。
同样地,采用Esg标准接口、外部接口请求的函数如下:
Esg标准接口采用同步或异步传输的方式,其中,
同步传输采用common.esgrequest封装函数来执行param,dataurl命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,通过common.standardRequest封装函数获取文件存放的地址参数;
而异步传输采用common.esgAsyncRequest封装函数来执行param,dataurl,successcallback,failcallback命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,Successcallback是指在发送请求成功后,文件存放地址参数传递给回调函数,而回调函数决定当AJAX请求成功后显示的消息,failcallback是指发送请求失败后,执行的回调函数,回调函数决定当AJAX请求失败后显示的消息。
外部接口请求:
同步:common.partnerRequest(param,dataurl)
异步common.partnerAsyncRequest(param,dataurl,successcallback,failcallback)
以上,ajax中的同步是必须等服务器返回了结果后,才会去执行success的方法,ajax的success方法没有执行的情况下,ajax块外面的js代码是不执行的;
ajax中的异步是不需要等服务器返回了结果,就可以去执行ajax块外面的js代码,等服务器返回了结果后再执行success方法。
优选地,H5活动页面构建模块51还包括特效设置单元515,并且,特效设置单元515还具有添加删除进度子单元5151,其函数如下:
Common.loading();
Common.removeloading()
优选地,特效设置单元515还具有弹窗提示子单元5152,其函数如下:
Common.alert(“欢迎光临”)
优选地,特效设置单元515还具有弹窗子单元5153,其函数如下:
Common.popwindow(),弹窗可以显示标题和内容,可以采用Html代码或引入文本文件的形式设置显示的内容。
其中,弹窗提示子单元5152,当弹窗提示框弹出时,后台程序依然可以运行,而弹窗子单元5153是阻塞式对话框,弹窗弹出时,程序会等待。
优选地,特效设置单元515还具有背景更换子单元5154,用于更换活动页面背景图片、背景色,其函数如下:
Common.setpagebgImage(),可以修改活动页面的index值、图片的url;
Common.setpagebgcolor(),可以修改活动页面的index值,颜色值。
优选地,特效设置单元515还具有活动页面跳转子单元5155,可以将H5活动页面跳转到指定页码,其函数如下:
Common.jumpage(),可以跳转是下一页或按pageId跳转。
此外,本发明实施例还提出一种计算机可读存储介质,所述计算机可读存储介质可以是硬盘、多媒体卡、SD卡、闪存卡、SMC、只读存储器(ROM)、可擦除可编程只读存储器(EPROM)、便携式紧致盘只读存储器(CD-ROM)、USB存储器等等中的任意一种或者几种的任意组合。所述计算机可读存储介质中包括一键活动内嵌代码程序50等,所述一键活动内嵌代码程序50被处理器14执行时实现如下操作:
步骤S10,编辑并生成具有预设功能的一键活动的模板;
步骤S30,在所述一键活动的模板内嵌入可修改一键活动页面的逻辑、样式、功能点的代码,从而在一键活动的模板上引入自定义的至少包括Html、Js、Css、图片、音频的资源,其中,一键活动是指通过封装的程序形成的具有预设功能的模板。
以上所述仅为本发明的优选实施例,并不用于限制本发明,对于本领域的技术人员来说,本发明可以有各种更改和变化。凡在本发明的精神和原则之内,所作的任何修改、等同替换、改进等,均应包含在本发明的保护范围之内。
Claims (10)
1.一键活动内嵌代码方法,应用于电子装置,其特征在于,该方法包括:
编辑并生成具有预设功能的一键活动的模板,其中,
一键活动的模板的基本结构是,在Html头部设置H5活动页面的宽度、高度、最大、最小比例数据,其中,在Html头部中引入onekey文件,所述onekey文件包括base.css文件,以构成H5活动页面的基本样式,并且,还引入resize.js文件,从而计算页面缩放比例,以控制H5活动页面的页面大小,其中,所述onekey为一种H5页面开发平台;
在Html尾部引入content_position.js文件,从而计算内容展示区域在H5活动页面中的位置;
在所述一键活动的模板内嵌入可修改一键活动的页面的逻辑、样式、功能点的代码,从而在一键活动的模板上引入自定义的至少包括Html、Js、Css、图片、音频的资源,
其中,在HTML内容中添加标签,通过标签的class应用额外的样式,或将多种样式预先定义好,放在.css的文件中,然后在页面中根据需要使用其中已定义好的样式。
2.根据权利要求1所述的一键活动内嵌代码方法,其特征在于,
在Html尾部引入jquery.min.js文件,所述jquery.min.js文件是在完整版的jQuery库中去掉空白字符、注释、空行经压缩形成的。
3.根据权利要求1所述的一键活动内嵌代码方法,其特征在于,
前端与后端的连接采用ajax的请求方式,并且首选以post的形式进行发送请求。
4.根据权利要求1所述的一键活动内嵌代码方法,其特征在于,
前端与后端的接口是Onekey标准接口、Esg标准接口或外部接口。
5.根据权利要求1所述的一键活动内嵌代码方法,其特征在于,
Onekey标准接口采用同步或异步传输的方式,其中,
同步传输采用common.standardRequest封装函数来执行param,dataurl命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,通过common.standardRequest封装函数获取文件存放的地址参数;
而异步传输采用common.standardAsyncRequest封装函数来执行param,dataurl,successcallback,failcallback命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,Successcallback是指在发送请求成功后,文件存放地址参数传递给回调函数,而回调函数决定当AJAX请求成功后显示的消息,failcallback是指发送请求失败后,执行的回调函数,回调函数决定当AJAX请求失败后显示的消息。
6.根据权利要求1所述的一键活动内嵌代码方法,其特征在于,
Esg标准接口采用同步或异步传输的方式,其中,
同步传输采用common.esgrequest封装函数来执行param,dataurl命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,通过common.standardRequest封装函数获取文件存放的地址参数;
而异步传输采用common.esgAsyncRequest封装函数来执行param,dataurl,successcallback,failcallback命令,其中,param为参数命名,以便根据名字得到参数值,正确的将参数传入前端,dataurl为文件存放地址,Successcallback是指在发送请求成功后,文件存放地址参数传递给回调函数,而回调函数决定当AJAX请求成功后显示的消息,failcallback是指发送请求失败后,执行的回调函数,回调函数决定当AJAX请求失败后显示的消息。
7.根据权利要求1所述的一键活动内嵌代码方法,其特征在于,
一键活动模板还具有添加删除进度显示功能、弹窗提示功能、弹窗功能、更换页面背景图片及背景色的功能、跳转到指定页码的功能。
8.一种电子装置,其特征在于,所述电子装置包括存储器及与所述存储器连接的处理器,所述存储器中存储有可在所述处理器上运行的一键活动内嵌代码程序,所述一键活动内嵌代码程序被所述处理器执行时实现如下步骤:
编辑并生成具有预设功能的一键活动的模板,其中,
一键活动的模板的基本结构是,在Html头部设置H5活动页面的宽度、高度、最大、最小比例数据,其中,在Html头部中引入onekey文件,所述onekey文件包括base.css文件,以构成H5活动页面的基本样式,并且,还引入resize.js文件,从而计算页面缩放比例,以控制H5活动页面的页面大小,其中,所述onekey为一种H5页面开发平台;
在Html尾部引入content_position.js文件,从而计算内容展示区域在H5活动页面中的位置;
在所述一键活动的模板内嵌入可修改一键活动的页面的逻辑、样式、功能点的代码,从而在一键活动的模板上引入自定义的至少包括Html、Js、Css、图片、音频的资源,
其中,在HTML内容中添加标签,通过标签的class应用额外的样式,或将多种样式预先定义好,放在.css的文件中,然后在页面中根据需要使用其中已定义好的样式。
9.根据权利要求8所述的电子装置,其特征在于,编辑并生成具有预设功能的一键活动的模板的步骤中,在Html尾部引入jquery.min.js文件,所述jquery.min.js文件是在完整版的jQuery库中去掉空白字符、注释、空行经压缩形成的。
10.一种计算机可读存储介质,其特征在于,所述计算机可读存储介质中包括一键活动内嵌代码程序,所述一键活动内嵌代码程序被处理器执行时,实现如权利要求1至7中任一项所述的一键活动内嵌代码方法的步骤。
Priority Applications (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811190588.6A CN109445775B (zh) | 2018-10-12 | 2018-10-12 | 一键活动内嵌代码方法、装置及计算机可读存储介质 |
Applications Claiming Priority (1)
Application Number | Priority Date | Filing Date | Title |
---|---|---|---|
CN201811190588.6A CN109445775B (zh) | 2018-10-12 | 2018-10-12 | 一键活动内嵌代码方法、装置及计算机可读存储介质 |
Publications (2)
Publication Number | Publication Date |
---|---|
CN109445775A true CN109445775A (zh) | 2019-03-08 |
CN109445775B CN109445775B (zh) | 2023-08-11 |
Family
ID=65545310
Family Applications (1)
Application Number | Title | Priority Date | Filing Date |
---|---|---|---|
CN201811190588.6A Active CN109445775B (zh) | 2018-10-12 | 2018-10-12 | 一键活动内嵌代码方法、装置及计算机可读存储介质 |
Country Status (1)
Country | Link |
---|---|
CN (1) | CN109445775B (zh) |
Cited By (6)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110335016A (zh) * | 2019-06-11 | 2019-10-15 | 北京臻溪谷医学研究中心(有限合伙) | 一种分布式细胞精益智能制造管理系统 |
CN110727492A (zh) * | 2019-09-29 | 2020-01-24 | 北京金山云网络技术有限公司 | 客户端换肤方法、装置、电子设备及计算机可读存储介质 |
CN112130853A (zh) * | 2020-08-25 | 2020-12-25 | 北京思特奇信息技术股份有限公司 | 一种实现前端h5业务能力开放的方法及系统 |
CN113296762A (zh) * | 2021-06-21 | 2021-08-24 | 北京有竹居网络技术有限公司 | 页面嵌入方法、装置、存储介质及电子设备 |
CN113867870A (zh) * | 2021-09-29 | 2021-12-31 | 完美世界(北京)软件科技发展有限公司 | 弹窗管理系统、弹窗控制方法、存储介质、计算机设备 |
CN117608560A (zh) * | 2024-01-24 | 2024-02-27 | 卡奥斯创智物联科技有限公司 | Lvgl页面显示代码生成方法、装置、设备及介质 |
Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN101908044A (zh) * | 2009-06-04 | 2010-12-08 | 上海灵慧软件技术有限公司 | 一种动态可调的模板及其使用方法 |
CN102349089A (zh) * | 2009-03-13 | 2012-02-08 | 微软公司 | 丰富的网站创作和设计 |
US20140046980A1 (en) * | 2012-08-08 | 2014-02-13 | Uwe Kleinschmidt | Template based website development and management |
CN105204860A (zh) * | 2015-09-28 | 2015-12-30 | 上海斐讯数据通信技术有限公司 | 一种快速生成自定义静态Web页面的方法及装置 |
-
2018
- 2018-10-12 CN CN201811190588.6A patent/CN109445775B/zh active Active
Patent Citations (4)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN102349089A (zh) * | 2009-03-13 | 2012-02-08 | 微软公司 | 丰富的网站创作和设计 |
CN101908044A (zh) * | 2009-06-04 | 2010-12-08 | 上海灵慧软件技术有限公司 | 一种动态可调的模板及其使用方法 |
US20140046980A1 (en) * | 2012-08-08 | 2014-02-13 | Uwe Kleinschmidt | Template based website development and management |
CN105204860A (zh) * | 2015-09-28 | 2015-12-30 | 上海斐讯数据通信技术有限公司 | 一种快速生成自定义静态Web页面的方法及装置 |
Cited By (8)
Publication number | Priority date | Publication date | Assignee | Title |
---|---|---|---|---|
CN110335016A (zh) * | 2019-06-11 | 2019-10-15 | 北京臻溪谷医学研究中心(有限合伙) | 一种分布式细胞精益智能制造管理系统 |
CN110727492A (zh) * | 2019-09-29 | 2020-01-24 | 北京金山云网络技术有限公司 | 客户端换肤方法、装置、电子设备及计算机可读存储介质 |
CN112130853A (zh) * | 2020-08-25 | 2020-12-25 | 北京思特奇信息技术股份有限公司 | 一种实现前端h5业务能力开放的方法及系统 |
CN112130853B (zh) * | 2020-08-25 | 2024-02-02 | 北京思特奇信息技术股份有限公司 | 一种实现前端h5业务能力开放的方法及系统 |
CN113296762A (zh) * | 2021-06-21 | 2021-08-24 | 北京有竹居网络技术有限公司 | 页面嵌入方法、装置、存储介质及电子设备 |
CN113867870A (zh) * | 2021-09-29 | 2021-12-31 | 完美世界(北京)软件科技发展有限公司 | 弹窗管理系统、弹窗控制方法、存储介质、计算机设备 |
CN117608560A (zh) * | 2024-01-24 | 2024-02-27 | 卡奥斯创智物联科技有限公司 | Lvgl页面显示代码生成方法、装置、设备及介质 |
CN117608560B (zh) * | 2024-01-24 | 2024-04-12 | 卡奥斯创智物联科技有限公司 | Lvgl页面显示代码生成方法、装置、设备及介质 |
Also Published As
Publication number | Publication date |
---|---|
CN109445775B (zh) | 2023-08-11 |
Similar Documents
Publication | Publication Date | Title |
---|---|---|
CN109445775A (zh) | 一键活动内嵌代码方法、装置及计算机可读存储介质 | |
CN112632437B (zh) | 一种网页页面生成方法、装置及计算机可读存储介质 | |
CN115617327A (zh) | 低代码页面搭建系统、方法及计算机可读存储介质 | |
US20030110472A1 (en) | Method and system for generating program source code of a computer application from an information model | |
CN110059277A (zh) | 首页加载优化方法、服务器及计算机可读存储介质 | |
US20100115394A1 (en) | Document processing device and document processing method | |
CN101909082B (zh) | 一种基于模型驱动的网格门户配置系统及配置方法 | |
CN106293664A (zh) | 代码生成方法及装置 | |
WO2004070527A2 (en) | System and method of executing and controlling workflow processes | |
CN101526942A (zh) | 在线、实时及自动生成动态网页的组件实现技术 | |
EP1830275A1 (en) | Information distribution system | |
CN112711418B (zh) | 多组件的前端界面布局方法、装置、电子设备和存储介质 | |
WO2016005887A2 (en) | Client-side template engine and method for constructing a nested dom module for a website | |
CN113032708A (zh) | 一种无代码Web开发系统 | |
US20160012144A1 (en) | Javascript-based, client-side template driver system | |
US20150317405A1 (en) | Web Page Variation | |
CN103176778A (zh) | 网页开发方法和装置 | |
EP1811399A1 (en) | Data processing device and data processing method | |
CN108170409A (zh) | Web前端控件的开发方法和系统 | |
CN112084446A (zh) | 一种网页编辑方法、编辑器、电子设备和可读存储介质 | |
US7802181B2 (en) | Document processing device and document processing method | |
CN111506306A (zh) | 一种Ansible剧本编写方法、装置和电子设备 | |
CN111309319B (zh) | 可继承的局数据动态页面配置方法和装置 | |
CN116909553A (zh) | 一种页面在线开发及本地编译运行系统 | |
CN111435300A (zh) | web系统开发方法、装置、设备及存储介质 |
Legal Events
Date | Code | Title | Description |
---|---|---|---|
PB01 | Publication | ||
PB01 | Publication | ||
SE01 | Entry into force of request for substantive examination | ||
SE01 | Entry into force of request for substantive examination | ||
GR01 | Patent grant | ||
GR01 | Patent grant |