jQuery Mobile （一）hello jquerymobile
衡玄裳
最近因为要用到 Jquerymobile 这一类东西， 所以利用一些空闲的时间开始学习Jquerymobile， 然后自己也是一边记录一边学习 。
学习每个技术都是先写hello world，所以我这次第一次写的是hello jquerymobile。代码如下
由于是通过jQuery CDN 服务器请求的方式进行加载， 所以执行时必须保证网络畅通。
学习每个技术都是先写hello world，所以我这次第一次写的是hello jquerymobile。代码如下
<!DOCTYPE html>
<html>
<head>
<title>Hello World</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta name="viewport" content="width=device-width,
initial-scale=1.0, maximum-scale=1.0, user-scalable=0;" />
<link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>
</head>
<body>
<div id="page1" data-role="page">
<header data-role="header"><h1>jQuery Mobile</h1></header>
<div data-role="content" class="content">
<p>Hello World!</p>
</div>
<footer data-role="footer"><h1>Footer</h1></footer>
</div>
</body>
</html>
想要在游览器中正常运行一个jQuery Mobile 移动应用页面，需要先获取与jQuery Mobile 相关的插件文件。其中获取的方法有两种，分别是下载相关插件文件和使用URL 方式加载相关文件，登陆jQuery Mobile 官方网站下载，这里我使用的是URL方式加载插件文件 ，只要在页面的<head>元素中加入下列代码 如下：
<link rel="stylesheet" href="http://code.jquery.com/mobile/latest/jquery.mobile.min.css" />
<script src="http://code.jquery.com/jquery-1.7.1.min.js"></script>
<script src="http://code.jquery.com/mobile/latest/jquery.mobile.min.js"></script>
由于是通过jQuery CDN 服务器请求的方式进行加载， 所以执行时必须保证网络畅通。
类似资料：