jQuery 将我们常用的封装起来，直接调用 jQuery使用户能更方便地处理HTML（标准通用标记语言下的一个应用）、events、实现动画效果，并且方便地为网站提供AJAX交互。 web app 是一种快捷的app开发方式，把app的开发方式通过html方式写成一个html静态文件，里边的数据通过异步数据ajax请求去服务器端拿数据，然后显示到页面中 好处：可以封装默认的数据，没网可以读取，有网可以从服务器更新数据 混合app开发 一部分为原生态的Android，ios开发，一部分是webapp实现，单页多应用
webapp示例
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8"
<meta name="viewport">
//兼容各种设备的参数属性
<meta name="viewport"
//宽度等物设备的宽度，缩放比例1：1，最大缩放比例1，不允许用户缩放
content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0" />
//引入js，css
<link rel="stylesheet" href="./js/jquery.mobile-1.4.5.min.css">
<script src="./js/jquery.min.css"></script>
<script src="./js/jquery.mobile-1.4.5.min.js"></script>
</head>
<body>
//
<div data-role="page" id="pageone">
//定义头部
<div data-role="header">
<h1>维哥的小店铺</h1>
</div>
//主内容，ui-content间距
<div data-role="main" class="ui-content">
<form class="" action="" method="post">
//手机框
<label for="iphone">手机：</label>
<input type="text" name="tel" value="">
//密码框
<label for="iphone">密码：</label>
<input type="password" name="pwd" value="">
//确定按钮 shadow加阴影
<a href="#" class="ui-btn" ui-shadow>确定</a>
<a href="#pagetwo" class="ui-btn">登录</a>
</form>
</div>
//定义底部，任何页面底部都存在 fixed根据窗口定义
<div data-role="footer" data-position="fixed">
//定义导航
<div data-role="navbar">
<ul>
//底部定义三个功能键
//底部icon调用home图片
<li><a href="#pageone data-icon="home">维哥家</a></li>
//底部调用bars按钮
<li><a href="#pageone data-icon="bars">按钮</a></li>
//底部调用grid面板
<li><a href="#pageone data-icon="grid">面板</a></li>
</ul>
</div>
</div>
</div>
<div data-role="page" id="pagetwo">
<div data-role="header">
<h1>登陆成功</h1>
<a href="pageone" data-role="button"
//左滑动
data-transition="slide">logout</a>
</div>
<div data-role="main" class="ui-content"
欢迎光临维哥的小铺子
</div>
<div data-role="footer" data-position="fixed">
//定义导航
<div data-role="navbar">
<ul>
//底部定义三个功能键
//底部icon调用home图片
<li><a href="#pageone data-icon="home">维哥家</a></li>
//底部调用bars按钮
<li><a href="#pageone data-icon="bars"
//左滑动
data-transition="slide">按钮</a></li>
//底部调用grid面板
<li><a href="#pageone data-icon="grid">面板</a></li>
</ul>
</div>
</div>
</div>
</body>
</html>