`
javayestome
  • 浏览: 1041699 次
  • 性别: Icon_minigender_2
  • 来自: 北京
文章分类
社区版块
存档分类
最新评论

使用jQuery Mobile和JSON创建移动应用程序

阅读更多

近来移动应用开发迅速受到很多公司的关注,他们寻求为现存的产品和应用程序添加移动展现或者“触点”。即便不是所有,大部分移动应用开发框架也都会适应某种现存的“桌面”开发平台。基于Web的框架则不同。业界当前采用jQuery来创建移动web应用程序(上个月发布了jQuery Mobile Alpha 3 )。

  在移动领域,除了对设备特定属性的支持之外,最主要的一个问题就是程序的大小,正如Aaron Quint所说

压缩后的jQuery也大概有40-50K,可能还会稍微多一些,此外,如果你想要jQuery UI和一些动画功能,那么就还需要100K。对于移动设备来说,可能没有那么多空间。

  JQM Alpha 3现在已经精简到17K,其中还有相关的CSS文件。

  Enrique Ortiz还发现了JQM的其他优势

  • 总体上的简单性: 你可以主要使用标签驱动的方式开发页面,那样,你只需要使用很少或者不使用JavaScript。
  • 进一步改善和得体的降格: jQuery Mobile哲学是要同时支持高端和性能较差的设备,包括那些不支持JavaScript的设备,并且还要尽可能提供最佳体验。
  • 可访问性: jQuery已经支持可访问的富Internet应用程序(WAI-ARIA),以有助于使用辅助技术让有残疾的访问者也能够访问网页。
  • 小文件
  • 主题

  安装JQM很简单,只需要添加一个样式表文件和三个JavaScript文件:

<link rel="stylesheet" href="http://code.jquery.com/mobile/1.0a1 /jquery.mobile-1.0a1.min.css" /> 
<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script> 
<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js"> </script> 
<script src="http://jquery.ibm.navitend.com/utils.js"></script> 

  此外,Frank还提到,在移动领域JQM的关键优势就在于,它能够使用AJAX让用户界面更平滑:

JQM把Ajax提升了一个层次,这是通过拦截页面请求,并在大多数情况下把这些请求转化为指定的Ajax调用达到的。最基本的结果是,当用户访问使用JQM构建的web应用程序时,只会修改页面的DOM结构,而不是每次都替换所有页面。

  这种效果是通过使用HTML5的data-*属性达到的。在HTML5中,任何带有data-前缀的属性本质上都会被验证解析器忽略,而应用程序可以任意地拦截那些属性。JQM依赖于data-role属性把它的核心功能组合成字符串。

当JQM应用程序从一个页面切换到下一个页面时,发生的主要动作就是内容div中的内容会换成新页面的内容。

  我们可以使用data-rel属性请求窗口如何显示,当它显示出来的时候,data-transition属性会告诉JQM做出相应的转换。我 们可以使用data-filter属性来指定data-role列表的行为,而该列表可以基于输入的关键字来过滤列表的值。Frank还说明了如何创建自 定义的data-*属性,从而实现应用程序的特殊属性。

  JQM会在今年上半年发布。Frank最后做出结论:

随着时间的推移,我们期望它能够整合到像PhoneGap之类的框架中,并且可能会整合到像Appcelerator的Titanium等开发环境中。

  你认为基于Web的移动应用程序有前途吗? 这只是框架和开发是否简单的问题,还是移动应用程序非常特殊(因为用户会使用自己的客户端,并期望获得最好的用户体验和安全性)以致于基于Web的应用程序只会成为新平台上的边缘程序。

1
1
分享到:
评论

相关推荐

    jquery mobile 餐厅实例

    jQuery Mobile 是一个轻量级、触控优化的前端框架,用于构建响应式和移动设备友好的Web应用程序。它基于jQuery库,提供了丰富的组件和设计模式,使得开发者能够快速地创建具有统一界面风格的跨平台应用。在这个...

    Jquery Mobile +Asp.net

    结合jQuery Mobile和ASP.NET MVC,可以创建高性能、交互丰富的移动Web应用。以下是结合使用的几个关键点: 1. **数据绑定**:ASP.NET MVC的模型可以直接与jQuery Mobile的视图进行绑定,通过JSON或AJAX实现动态数据...

    jqueryMobile入门练习项目

    jQuery Mobile 是一个流行的前端框架,专为移动设备上的网页应用设计,提供一套完整的交互组件和触摸优化的界面。它基于 jQuery 库,简化了在移动设备上创建响应式、触摸友好的网页的流程。本项目是针对初学者的一个...

    jQuery mobile要联网的地图技术

    在IT行业中,地图技术是移动应用开发不可或缺的一部分,特别是在使用jQuery Mobile这个轻量级的前端框架构建响应式、触屏友好的网页应用时。jQuery Mobile提供了丰富的交互元素和组件,而将地图集成到这些应用中则能...

    Jquery Mobile的应用

    jQuery Mobile 是一个用于构建响应式和触摸友好的网页应用的前端框架,尤其适合创建移动设备上的Web应用程序。它利用HTML5、CSS3和JavaScript技术,提供了一套易于使用和一致的用户界面组件,使得开发者能够快速地...

    jquery mobile web api开发例子

    jQuery Mobile 是一个轻量级、触控优化的前端框架,专门用于构建移动设备上的响应式网站和应用程序。它提供了丰富的组件,如页面、表单、按钮等,以及优雅降级和渐进增强的策略,确保在各种设备上拥有良好的用户体验...

    JQueryMobile与后台通信

    总结,jQuery Mobile通过AJAX与后台进行通信,结合页面生命周期事件、表单提交和响应数据处理,可以实现动态、交互的移动应用。在与Java后端集成时,理解JSP和Servlet的工作原理,以及RESTful API设计,有助于构建...

    jQuery mobile带历史记录的仿谷歌搜索

    在移动Web开发中,jQuery Mobile是一个非常流行的框架,它提供了丰富的UI组件和交互效果,使得开发者可以轻松构建响应式、触控友好的网页应用。在这个主题“jQuery mobile带历史记录的仿谷歌搜索”中,我们将深入...

    jquerymobile实现火车列次查询

    在网页开发中,jQuery Mobile是一个强大的框架,专为移动设备设计,提供了一套完整的用户界面组件和交互效果。本教程将深入探讨如何利用jQuery Mobile来构建一个实用的火车列次查询系统,以满足用户在网页上便捷查询...

    jQuery Mobile Develop and Design

    通过本书的学习,开发者不仅可以掌握 jQuery Mobile 的核心技术和设计理念,还能学会如何构建高效、美观且用户友好的移动 Web 应用程序。无论是初学者还是有经验的开发者,都能从这本书中获得宝贵的开发经验和灵感。

    jquery mobile手机端MVC模式C#

    jQuery Mobile 是基于 jQuery 的轻量级框架,它提供了一套响应式和触控友好的 UI 组件,如导航栏、表单、按钮、工具提示等,用于创建一致的跨平台移动 Web 应用。其核心特性包括: - **统一的触摸事件处理**:...

    jquery mobile web api 带下拉,上拉滑动分页滚动示例

    在本文中,我们将深入探讨如何使用jQuery Mobile和ASP.NET Web API2来构建一个具有下拉、上拉滑动分页滚动功能的Web应用。jQuery Mobile是一个强大的移动UI框架,它为移动设备提供了丰富的交互和触控优化的界面,而...

    jquery-978-1-7821-6006-9:使用jQuery Mobile创建移动应用

    《使用jQuery Mobile创建移动应用》是一本专注于利用jQuery Mobile框架构建高效、响应式移动应用程序的专业指南。jQuery Mobile是一个强大的开源库,它简化了跨平台移动Web开发,使得开发者能够快速地为智能手机和...

    jqueryMobile省市二级菜单联动

    "jqueryMobile省市二级菜单联动"是一个常见功能,尤其适用于构建具有地域选择功能的网站或应用。这个功能允许用户在两个下拉菜单中分别选择省份和城市,且两个菜单之间存在联动关系,即当用户在一个菜单中选择某个...

    基于jquery mobile+websocket+protocol buffer的IM开发

    首先,jQuery Mobile是用于创建响应式、触屏友好的移动Web应用程序的库。它基于流行的jQuery JavaScript库,提供了丰富的组件和样式,简化了移动设备上的UI设计。在本项目中,jQuery Mobile将用于构建IM应用的用户...

    Jquery整理+JqueryMobile文檔

    jQuery Mobile 是一个专为移动设备设计的触控优化框架,它基于jQuery核心库,专注于创建响应式和触摸友好的网页应用。 1. **页面结构**: jQuery Mobile 引入了“page”和“page container”的概念,通过`data-role=...

Global site tag (gtag.js) - Google Analytics