判断页面是原生页面还是H5页面

1.在开发者工具中找到 显示布局边界（Android一般系统自带，ios部分公司小工具中可找到）

原生页面红线特别多，布局很规范

H5页面中间一大部分没有红线，只有页面边缘有红线

2.断网

原生页面仍会正常展示

H5页面会404、错误页面

3.查看进度条

H5页面部分顶部有加载进度条；部分也没有进度条

4.交互性

H5页面交互性较差

原生页面比较好：例如弹层、滑动删除会话

5.流量与缓存

H5页面做缓存的较少；消耗流量也较多，加载资源较多

原生页面可做缓存，流量消耗较少

6.跨平台

H5页面跨平台性较好，可在小程序、ios、android...

原生每个平台需自己独立写

7.键盘

弹出的键盘有【完成】按钮一定是H5页面，原生的一定没有；

8.下拉页面显示网址提供方的一定是H5

原文地址：https://www.cnblogs.com/hedy-x/p/11964920.html

时间： 2024-10-10 12:23:10

判断页面是原生页面还是H5页面的相关文章

如何判断一个APP页面是原生的还是H5页面

来源:http://www.25xt.com/appdesign/11851.html Hybrid APP指的是半原生半Web的混合类App.需要下载安装,看上去类似Native App,但只有很少的UI Web View,访问的内容是 Web . 原生是Native APP,H5就是Web App 在Hybrid 当中,如何快速的判断一个APP页面是原生的还是H5页面呢? 1.看断网的情况 把手机的网络断掉.然后点开页面.然后可以正常显示的东西就是原生写的. 显示404或则错误页面的是htm

APP页面如何区分是原生的还是H5页面

1.看断网的情况 把手机的网络断掉.然后点开页面.然后可以正常显示的东西就是原生写的. 显示404或则错误页面的是html页面. 2.看布局边界(仅针对安卓手机适用) 可以打开 开发者选项中的显示布局边界,页面元素很多的情况下布局是一整块的是h5的,布局密密麻麻的是原生控件.页面有布局的是原生的否则为h5页面. 3.看复制文章的提示,需要你通过对比才能得出结果. 比如是文章资讯页面可以长按页面试试,如果出现文字选择.粘贴功能的是H5页面,否则是native原生的页面. 有些原生APP开放了复制粘

iOS原生App与H5页面交互笔记

iOS原生App与H5页面交互笔记 字数390 阅读2204 评论1 喜欢25 最近在做一个项目用到了原生App与H5交互,之前有做过简单的H5页面直接调用原生方法的例子,就是利用UIWebView中的代理方法 //webview每次加载之前都会调用这个方法,利用该代理方法截取JS的href来调用原生的方法 - (BOOL)webView:(UIWebView*)webView shouldStartLoadWithRequest:(NSURLRequest*)request navigatio

iOS原生App与H5页面交互

文/MikeZhangpy(简书作者)原文链接:http://www.jianshu.com/p/4ed3e5ed99c6著作权归作者所有,转载请联系作者获得授权,并标注“简书作者”. 最近在做一个项目用到了原生App与H5交互,之前有做过简单的H5页面直接调用原生方法的例子,就是利用UIWebView中的代理方法 //webview每次加载之前都会调用这个方法,利用该代理方法截取JS的href来调用原生的方法 - (BOOL)webView:(UIWebView*)webView should

5月20日重点：当请求的参数是动态的形式时，原生app与h5页面之间数据交互的方法

方案一: 1.app在打开H5页面的时候,把需要给的参数,以get的形式,放在H5的url中. 2.然后H5的js从url中获取到需要的参数,拼接到ajax请求的url中. 3.H5ajax请求,页面渲染. 方案二: 1.app方构建与H5交互的协议 2.H5写一个带参命名函数.在此方法内,填写数据获取后的操作代码. 并把函数名告知app方. 2.app方请求数据,然后以post方法,把请求到的全部数据传入已知的函数中,并调用此函数. 3.H5负责把接收到的数据,进行页面渲染. 注意:1.这个方

Hybrid APP之Native和H5页面交互

Hybrid APP之Native和H5页面交互原理 Hybrid APP的关键是原生页面与H5页面直接的交互,如下图,痛过JSBridge,H5页面可以调用Native的api,Native也可调用H5页面的方法或者通知H5页面回调 在Hybrid APP中,原生与H5的交互方式在Android和iOS上的实现是有异同的,原因是Android.iOS的通信机制有所区别,下面介绍原生和H5相互调用的方法 Native与H5交互的两种方式 原生和前端的交互有两种方式:url scheme以及Jav

移动web：原生开发打包，嵌入h5页面 webApp：全部都是H5开发的应用 混合APP：使用第三方开发平台从apicloud，appcan，hbuilder等开发，cordova技术打包 原生APP：就是eclipse开发或者studio等工具开发

论坛43213 移动端webApp兼容问题解决 谈谈App混合开发 Hybrid APP混合开发的一些经验和总结 PhoneGap是一个采用HTML,CSS和JavaScript的技术,创建移动跨平台移动应用程序的快速开发平台.它使开发者能够在网页中调用IOS,Android,Palm,Symbian,WP7,WP8,Bada和Blackberry等智能手机的核心功能--包括地理定位,加速器,联系人,声音和振动等,此外PhoneGap拥有丰富的插件,可以调用. Cordova提供了一组设备相关的

Hybrid App中原生页面 VS H5页面

来源:http://www.jianshu.com/p/00ff5664e000 [原文丰富,请看原文] 现有3类主流APP,分别为:Web App.Hybrid App(混合模式移动应用,Hybrid有“混合的”意思). Native App(原生app,后面都用“原生app”来描述).Web App和原生app有很多大牛们都做过比较详细的比较以及优劣势分析,我主要对Hybrid App来简要分析下,谈谈Hybrid App里原生页面和H5页面的比较和分析. Hybrid APP指的是半原生半

混合app开发，h5页面调用ios原生APP的接口

混合APP开发中,前端开发H5页面,不免会把兼容性拉进来,在做页面的兼容性同事,会与原生app产生一些数据交互: 混合APP开发,安卓的兼容性倒是好说,安卓使用是chrome浏览器核心,已经很好兼容H5页面,而且运行机制也是能够同步运行:但ios上就没那么容易了:. 在此我就不说兼容安卓的问题,只把ios问题说说: 问题1:H5调用ios接口,ios需要初始化,js代码在ISO上只运行一次 解决: 本人使用是angular框架搭建的H5页面 var ua = navigator.userAgen