需要在ipad上调试代码, 经过一番搜索(多在google搜到的), 稍微整理下 : ).
1. Settings -> Safari -> Advanced/Developer -> Debug Console
最容易搜到的就是这个, 在桌面选择"设置", 找到"Safari", 点"高级/开发者", 据说下面会有个"调试控制台(debug console)"按钮, 但是我死活没能找到, 可能是safari较旧引起的.
即使可以使用, 功能也是很有限的, 各种吐槽.
2 firebug lite
2.1
当然也可以在页面中嵌入firebug lite;
2.2
或者建个新书签加载firebuglite;
2.3
也可以利用后台, 判断参数, 修改传回的内容;
<?php if(isset($_GET['debug'])): ?>
<script type="text/javascript" src="firebuglite.js"></script>
<?php endif; ?>
3 edge inspect
这是我觉得蛮好的, 但是后期可能要交$;
大致的步骤是:
PC上下载该软件 -- PC中的Chrome浏览器安装edge inspect 插件 -- ipad上安装"行动客户端"(你如果是ios, 点击那个iOS按钮就可以了)
目前用到两个比较实用的特性:
连接设置完以后, PC和ipad 可以同步刷新页面;
另外, 在PC的开发者工具中, 修改页面可以实时显示到ipad中, 就像PC调试一样, 只不过显示在ipad.
(远程调试原理大致是新建个服务器, 让移动设备访问).
4 IOS设备上Safari浏览器的前端调试解决方案
3.1 IOS模拟器
http://www.crifan.com/intro_ios_simulator_in_xcode_and_usage_summary/
https://developer.apple.com/library/ios/documentation/IDEs/Conceptual/iOS_Simulator_Guide/Introduction/Introduction.html
http://www.ychong.com/safari-ios-iphone-itouch-web-dev-inspector/
如果是iOS6以上的, 直接开启远程调试就可以, 但是PC必须是Mac系统, 因为Mac才可以装safari 6.x;
同理, 如果ipad是一代的, 那也不行哦;
当然愿意在PC装虚拟机也可以.
3.2 xcode中的IOS模拟器.
5 Chrome user agent switcher
另外还有一个简洁的模拟方式, PC上的Chrome的开发者工具中,
点击右下角的"齿轮", 打开设置面板, 选中override一栏,
其中可以修改 user agent, 同时选中"Emulate touch event"可以模拟移动端特有的触摸事件, 但是也不会妨碍鼠标事件的触发.
如果仅仅是测试页面布局和鼠标事件, 那用这个最为方便.
