web前端与移动开发-移动web前端开发教程

首先认清楚哪些是混和APP开发（HybridApp）

HybridApp（混和模式联通应用）是指介于web-app、native-app这三者之间的app，兼顾“NativeApp良好用户交互体验的优势”和“WebApp跨平台开发的优势”

浅显来讲，就是将h5我们写好的联通端页面，放在ios设备以及安卓设备中，在上面

我们可以享受ios和安卓给我们的所有支持，通过方式调用，反弹函数进行使用给我们提供的方式

其次认清楚APP都有什么类型？

一，原生APP

现今的智能手机操作系统就是主流的ios和Android，所以原生APP就是针对这两种操作系统用原生程序编撰的应用程序。原生APP运行时是按照本地的操作系统，所以兼容能力和访问能力好，用户体验和交互界面可以说是最好的。

二，webAPP

WebApp是指基于Web的系统和应用，它的作用是向广大用户发布比较复杂的内容和功能。是针对ios和Android优化后的web站点，不须要下载安装更新，普通的web语言开发，只须要通过手机浏览器运行。

三，混和APP

介于原生APP和WebAPP之间的APP，所以它是综合了两类APP的优点，同时采用网页语言和程序语言进行开发，用户须要下载安装使用，开发成本和难度都大大减少。现今所使用的陌陌，网店都是混和APP。

混和APP原理

混和APP一般由后端负责大部份界面开发和业务逻辑，原生负责封装原生功能供后端调用，两者以WebView作为媒介构建通讯，因而既拥有Web开发的速率优势，又能拥有强悍的原生能力。

从一个后端开发者的角度来看，混和应用可以简单地理解为让后端页面跑在一个特殊的浏览器环境里，这个环境不仅常规WebAPI之外，还额外提供了好多可以直接调用手机原生能力的API。

从一个原生开发者的角度来看，混和应用当然就是一个原生开发的App壳体，这个壳体将原生功能封装成好多API并注入到WebView里，之后将后端页面打包进App，App启动时用WebView加载后端页面，剩下的就全交给后端了。

怎样进行和安卓和ios交换数据

简单粗鲁一句话，就是方式调用方式

//初始化方式

functioninit(obj){

//在页面初始化我们可以领到原生端给我们传来的初始化数据,她们会默认调用一次初始化方式

console.log(obj)

进行判定是android还是ios

//判定h5在ios还是安卓

functiondetect(){

varequipmentType=“”;

varagent=navigator.userAgent.toLowerCase();

varandroid=agent.indexOf(“android”);

variphone=agent.indexOf(“iphone”);

varipad=agent.indexOf(“ipad”);

if(android!=-1){

equipmentType=“android”;

if(iphone!=-1||ipad!=-1){

equipmentType=“ios”;

returnequipmentType;