jqMobi(App Framework)入门学习(一)
1. 什么是jqMobi?
jqMobi是由appMobi针对HTML5浏览器和移动设备开发的javascript框架。是个极其高速的查询选择库。支持W3C查询。
jqMobi源代码是基于jQuery源代码重写的,可是两者又属于不同的产品。jqMobi体积更小,速度更快,兼容性也有所不同。
上面这段话来自百度百科。可是眼下因为jqmobi已被收购并不断发展,并且jqmobi并不只局限于查询选择库,所以上面的解释并非非常全面。
2. jqMobi的特点
- 速度快
- 体积小
- 适用于智能手机和平板电脑
- 提供了60个API调用
- 与JQuery同样的语法(个人觉得仅是语法结构同样以及jqMobi兼容JQuery,在一些详细函数上的參数不大同样,如$.ajax()。详细可參照两者的官方API)
- 插件可扩展
3. 什么是App Framework?
英特尔2013年2月22日收购HTML 5移动应用公司appMobi HTML5开发工具XDK和相关雇员。之后jqMobi改名为App Framework。
说白了jqMobi事实上就是App Framework。
因为国内眼下很多开发人员和教程都停留在jqMobi这个名字之上,所以略微解释一下。
4. App Framework的组成
这个预计会是非常多刚開始学习的人心里的一道坎,初学时都全然搞不懂这货究竟是什么。要从何学起。首先是因为App Framework还十分年轻。仅有两年多历史,还处于一个发展初期。所以国内资料甚少。并且都十分老旧,这里也要吐槽一下Intel,App Framework的官网开发指导写的实在是烂到爆,收购了也不好好发展起来。
我们来对比一下jqMobi时的组成结构来认识App Framework的组成:
-
jqMobi查询选择库 === App Framework查询选择库(这个也就是网上常说的App Framework所指的内容),这一部分就是API的调用,包含Ajax调用、针对webkit的系统选择器调用等。说白了就是语法函数什么的,你能够理解为这一部分相当于JQuery。
-
jqUi === af.ui ,这一部分就是用户界面程序库,提供了button、部件、固定的header/footer以及可控的滚动部件。
-
jqPlugin === Plugins,这一部分是插件,官方下载的包自带了一些插件,包含popup弹出窗体、scroller滚动区域等一些经常使用插件,当然你不仅能够自己上网找很多其它插件也能够自己开发插件,这一部分和上面的af.ui你能够理解为相当于Jquery Mobile。
综上,你能够将App Framework理解为类似于JQery和Jquery Mobile结合起来的一个HTML5移动跨平台开发的Javascript框架。当然并非等同。
5. 下载App Framework
这里是App Framework的官方站点:http://app-framework-software.intel.com/
直接点击下载button下载就能够了,或者能够上github上下载。
写这篇博文的时候最新版本号是2.1.0,下载下来解压后文件文件夹例如以下:
自此,我们就能够直接打开index.html来更深入地了解App Framework的各项内容。之前也说过官方文档写的非常烂,所以我建议大家能够直接使用这个包里的内容进行App Framework的学习。在此强烈建议使用chrome浏览器进行学习。以便获得最佳的体验。
6. 了解App Framework的文件夹结构
-
build目录,顾名思义。这里面的文件是你使用App Framework进行开发所须要的文件内容。这里面就依据你的须要进行相关应用即可了。详细使用后面会讲到。
-
documentation目录,这个能够算是语法文档吧,可是写的非常烂,非常多甚至都没有一个完整的样例。并且里面有一些html内容上的小错误,包含你打开当中的index.html然后按F12调出控制台会发现有错误,这里是因为这个目录内缺少了对应App Framework的js和css文件,大家能够到build目录中复制appframework.js、appframework.ui.js、af.ui.css和icons.css放到documentation目录下,就能够看到完整版的文档了。我不确定当你看到这篇文章时是否还会有这个问题,我已经打算上github提交改正了。至少眼下2.1.0版本号有这个问题。
-
其余的文件夹和文件就是根文件夹下index.html所引用的内容了。基本组成了一个官方的API文档了。详细大家能够多看看各项内容,就不多说了。