初学者必读jQuery_Mobile_入门教程.docx

初学者必读：jQuery Mobile 入门教程原作：/devnet/dreamweaver/articles/getting-started-with-jquery-mobile.htmlGetting started with jQuery Mobile —— /devnet/author_bios/matthew_david.htmlMatthew David翻译：filod译文：/jquerymobile-2/295.html/jquerymobile-2/295.html转载声明：请注明原作、翻译以及译文链接。你每天都会对着它讲话，和它玩游戏，用它看新闻——没错，它就是你裤兜里的智能手机。android，黑莓还是iphone？为了让你清楚意识到究竟哪些才算是智能手机，我在下面总结了一个智能手机系统/设备的列表： Apple iPhone/iPod Touch Google Android RIM BlackBerry/Playbook OS Nokia Symbian (我承认它该退休了，可是在世界范围内它仍然拥有10亿以上的用户） HP/Palm WebOS Microsoft Window Phone 7 没错，这令人眼花缭乱的众多智能手机系统对HTML标准支离破碎的支持，直接导致了处理这些系统浏览器的兼容性成为了你最大的挑战。举例来说，苹果的iphone对HTML5标准有着很好的支持，然而Symbian和Microsoft Phone系列却几乎不支持HTML5的任何特性（译注：准确的说，是windows mobile系列，目前的windows phone 7对HTML5支持很好）。jQuery社区为了在解决兼容性和高效创建移动web站点做了大量努力，并开发了jQueryMobile这个移动框架。而本文旨在为读者介绍仍在alpha版本阶段的jQueryMobile框架（译注：目前jQueryMobile已经为beta2版本）的开发基础知识和技巧。用jQueryMobile来开发网站Gartner study(link)的数据表明在未来将会有越来越多的用户通过手机或者平板电脑访问你的网站，到2013年，将会有18亿的移动设备用户，对你的web设计团队来说开发移动站点已经不能再仅仅是“计划”而已了，你必须将你的移动站点迅速变为“现实”才行。在美国，IOS和Android设备占了很大比重，而美国以外的地方主要是Nokia的设备占统治地位。jQueryMobile为了在尽可能多的设备上运行，承诺将支持绝大部分移动设备/系统。在早些时候（2010年9月），jQuery的作者John Resig透露了一张jQueryMobile对各种设备/系统的支持表格（见下）。对于每个系统来说，jQueryMobile将他们的支持情况分为A（好），B（一般），C（基本）三个等级。由于移动设备市场的变幻莫测，这张图表也会迅速变化（一个很好的例子就是目前Nokia正在与Microsoft合作生产基于Windows Phone 7的设备——而在jQueryMobile中WP7的支持等级为A）。jQueryMobile始终贯彻渐进增强的设计观念来满足你的开发需要。jQuerymobile的核心能使得基本的HTML标签在所有的浏览器中生效，在此基础之上，再对网页的行为和效果进行增强，这意味着你的网页在等级较高的浏览器中能获得非常优秀的体验，而在较差的浏览器也能正常的使用。繁杂的移动浏览器们带来了巨大的挑战。一方面某些浏览器（例如Android的原生浏览器，Safari移动版等）都基于WebKit的一个变种版本（WebKit是一个web渲染引擎，Google Chrome桌面版，Apple的Safari都采用了该引擎。WebKit并不知道当前运行的网络的好坏，操作系统是什么甚至屏幕滚动到了哪里，为了让WebKit知道这些情况，操作系统/浏览器/设备厂商都需要基于WebKit来构建自己的浏览器程序），并带有丰富的特性。另一方面Nokia的Symbian和Windows Mobile 6（及更早的版本）这些胡乱支持标准的设备又占有相当大的市场。雪上加霜的是，WebKit在不同移动设备中还有不同的版本。所以渐进增强的基本目标就是你的内容能够在任何的设备中都能够正常“显示”。jQueryMobile使用入门：使用jQueryMobile的第一步，先创建一个html页面，并在head标签中加入以下内容： link rel=stylesheet href=/mobile/1.0a4.1/jquery.mobile-1.0a4.1.min.css script src=/jquery-1.5.min.js/script script src=/mobile/1.0