| 文章简介：不管你是对jQuery Mobile一无所知或者对它有很大的兴趣在研究过程中，还是已经开始用它做项目的开发者，欢迎加入这个jqm学习之旅。 |
不管你是对jQuery Mobile一无所知或者对它有很大的兴趣在研究过程中，还是已经开始用它做项目的开发者，欢迎加入这个jqm学习之旅
1、什么是jQuery Mobile？
按照官方的描述：针对智能手机和平板、做过触摸优化的web框架。截止到编写这个教程的时候，目前最新的版本是1.3.0。
2、jQuery Mobile推崇什么？
其实很多读者应该多用过jquery，它推崇的是"write less,do more"，那jQuery Mobile呢？
答案是一定的，而且更加针对移动设备。
3、相关资源依赖？
jQuery Mobile首先依赖jquery框架提供的接口处理相关操作
自身依赖两个主要部分：
js：jquery-mobile.js
css：jquery-mobile.css
如果你对版本意识不关心的话，我们可以直接去官网CDN下载最新的zip包,这里就不做过多的介绍了，我们直入主题吧。
4、我们先来看一下采用jQuery Mobile开发的一个最简单的页面结构是怎样的？
<!doctype html> <html lang="zh-hans"> <head> <meta charset="UTF-8"> <title>jQuery Mobile教程-基础篇-页面基本结构</title> <!-- 设置meta viewport start --> <meta name="viewport" content="width=device-width,minimum-scale=1,maximum-scale=1"> <!-- 设置meta viewport end --> <!-- jqm依赖文件start --> <link rel="stylesheet" href="../css/jquery.mobile-1.1.0.css" /> <script src="../js/jquery.js" type="text/javascript"></script> <script src="../js/jquery.mobile-1.1.0.js" type="text/javascript"></script> <!-- jqm依赖文件end --> </head> <body> <!-- 页面容器start --> <div data-role="page"> <!-- 页眉部分start --> <div data-role="header"> <h1>我是header部分</h1> </div> <!-- 页眉部分end --> <!-- content部分start --> <div data-role="content"> <p>jQuery Mobile教程-基础篇-我是content部分</p> </div> <!-- content部分end --> <!-- 页脚部分start --> <div data-role="footer"> <h3>我是footer部分</h3> </div> <!-- 页脚部分end --> </div> <!-- 页面容器end --> </body> </html>
如下图：
接下来我们会从使用频率这个维度来给大家介绍几个常见的组件，让大家快速地熟悉基本的用法。
demo
以上是小编为您精心准备的的内容，在的博客、问答、公众号、人物、课程等栏目也有的相关内容，欢迎继续使用右上角搜索按钮进行搜索jquery
， jquery mobile
， 结构
， 页面
， jquery.mobile
， 教程
， mobile
， jqm
， jquery mobile popup
， jqm缓存
， js jquery mobile
， mobile输入框jquery
， jqm 上传文件 拍照
部分
jquery官网、jquery api、jquery下载、jquery教程、jquery ajax，以便于您获取更多的相关知识。