Overview

当下移动端开发过程中大量使用前段H5、js等等技术，而这些web页面的调试在Xcode控制台中不太明了，经常我们移动app运行了就是方法，但是不能显示响应的效果，这时候或许就是已经报错了，但是我们在Xcode控制台是看不到这些错误。这时候我们就可以用功能强大的Safari浏览器来开启开发模式连接iPhone来调试app脸面的web页面了。

Safari设置

打开Safari偏好者设置，选中“高级菜单”，在页面最下方看到“在菜单中显示开发菜单”的复选框，在复选框内打钩，这样设置完毕就能在Safari菜单中看到开发菜单了

iPhone设置

打开iPhone手机设置app 选择Safari，找到高级选项，有JavaScript开关web检查器开关，讲两个开关都打开

调试

到此，准备工作完成。这时候讲iPhone链接到mac上，打开Safari浏览器，运行手机app里面的web页面，在开发菜单中选择连接的手机，找到调试的网页，就能在Safari里面调试了

手机截屏

Safari调试窗口

Safari控制台

在Safari中鼠标右键，选择检查元素，就可以看见Safari控制台了。如果看不到检查元素选项，依照上面Safari设置打开开发选项

 
 

iOS之safari调试iOS app web页面的更多相关文章

  1. 利用iOS中Safari浏览器创建伪Web App

    在safari浏览器里有一个“添加到主屏幕”选项,我们可以用来创建伪Web App,下面来了解一下iOS中Safari的私有属性 第一步设置Web App的主屏幕图标: 有两种属性值apple-tou ...

  2. 在mac上如何用safari调试ios手机的移动端页面

    第一步:打开iphone手机的开发者模式,流程是:[设置]->[Safari]->[高级]->开启[Web检查器] ,如图1.图2 图1 图2第二步:打开Mac上Safari的开发者 ...

  3. iOS之Safari调试webView/H5页面

    之前做过混合开发,用的是JavaScriptCore+OC+UIWebView. Safari调试功能真的很有用,通过它可以轻松定位问题的所在,下面说说怎么调试. 开启Safari开发菜单 在Mac的 ...

  4. iOS开发Safari调试WebView页面

    App混合开发现已是常态,不过作为app端开发人员,对H5页面的使用,可不能简单的局限于使用,一些简单的调试方法还是有必要了解的. 关于如何在使用webview过程中,如何对web内对内容进行调试,这 ...

  5. iOS使用Safari调试UIWebView

    1.设置Safari "Safari"->"偏好设置"->"高级",勾选"在菜单栏中显示开发菜单" 2.设置 ...

  6. H5移动端，ios从后台返回到app，页面会白一下

    visibilitychange事件可以检查从后台返回事件,然后通过添加div,强制浏览器刷新页面 var divEle = document.createElement("DIV" ...

  7. iOS真机调试问题-App installation failed，The maximum number of apps for free development profiles has been reached.

    The maximum number of apps for free development profiles has been reached. 源引:http://www.jianshu.com ...

  8. 在mac上如何用safari浏览器调试ios手机的移动端页面

    第一步 打开iphone手机的开发者模式,流程是:[设置]->[Safari]->[高级]->开启[Web检查器] 第二步 打开Mac上Safari的开发者模式,流程是[Safari ...

  9. Cordova - 使用Cordova开发iOS应用实战2（生命周期、使用Safari调试）

    Cordova - 使用Cordova开发iOS应用实战2(生命周期.使用Safari调试) 前文我们创建了一个简单的Cordova项目,结构如下: 1,Cordova生命周期事件 (1)device ...

随机推荐

  1. centos yum安装常用命令

    安装killall命令 yum install -y psmisc 安装sz(下载)和rz(上传)命令 yum install -y lrzsz 安装 ifconfig 命令 yum install ...

  2. Python入门-类的成员

    昨天我们简单的认识了一下面向对象,以及和面向过程之间的区别,从而我们知道了类这个东西,今天我们就来详细的了解一下关于类的一些东西. 一.类的成员 首先, 什么是类的成员,很简单, 你能在类中写什么? ...

  3. inline-block元素，在同一行上下显示

    两个元素使用了inline-block,并列显示时,会上下显示,给人感觉不在同一行 原因:其中一个元素使用了overflow:hidden,导致了基线变更 解决:1.另一个元素也添加overflow: ...

  4. linux 下解决git clone报错

    解决报错:error: The requested URL returned error: 401 Unauthorized while accessing   问题报错:error: The req ...

  5. 1-2 Sass安装（windows版）

    在 Windows 平台下安装 Ruby 需要先有 Ruby 安装包,大家可以到 Ruby 的官网(http://rubyinstaller.org/downloads)下载对应需要的 Ruby 版本 ...

  6. VC中BSTR、Char*、CString和CComBSTR类型的转换

    原文:http://blog.csdn.net/wanghaihao_1/article/details/37498689 1.char*转换成CString 若将char*转换成CString,除了 ...

  7. BottomBar之Android底部菜单

    BottomBar之Android底部菜单 前言:开源项目BottomBar,实现Android底部菜单(常用菜单,BottomBar实现动画(上下式)+消息菜单,BottomBar+ViewPage ...

  8. Python unittest模块心得(二)

    基础概念介绍请参看: http://www.cnblogs.com/frost-hit/p/8295818.html 组织测试用例 unittest.TestSuite(tests=()): 除了使用 ...

  9. Idea中Git的使用和两种类型的冲突解决

    一.Git冲突解决 在idea开发工具中使用Git时,主要用到的快捷按钮如下五个:   这五个按钮的使用说明及在idea中如何配置和使用git可参考https://github.com/DayThin ...

  10. 记一次insert因为db file sequential read影响性能导致性能原因的分析

    通过详细的10046 trace发现,大量的io等待分布在以下数据文件上:Misses in library cache during parse: 0Elapsed times include wa ...