如何在移动设备上调试html5开发的网页

可以使用Chrome浏览器，Chrome浏览器带有移动模式

Chrome打开Html5网页，点击F12打开开发者工具，然后点击下图中的手机图标，重新刷新页面，就可以模拟在移动设备上的样式，可以由不同的移动设备供选择

1、如果你能FQ

chrome在32版本后就自带了移动端调度工具，可以在Android直接联调，但唯一遗憾的是，在我大天朝要FQ后才能行的通，我自己试了后公司好几个机器联不上…

2、如果你有苹果电脑和iphone

苹果电脑上的safari 6.0版本后就可以直接连接iphone手机调试手机版上safari正在浏览的web页面，前提是你得有个苹果电脑和iphone手机，但如果你是Android的话，就没办法了

符合前端B格的“小苹果”

自己在公司里也是开发Mobile端的HTML5页面的，也深受调试页面之苦，移动端的WEB页面坑又多，所以用node-webkit技术做了一个客户端，专门用来调试，现在每天工作之前都先打开“小苹果”

小苹果用的是node-webkit技术打包成客户端，其实内部实现都是web 页面与nodejs技术，所以特别符合前端B格。而且由于用了node-webkit技术，客户端可以跑在windows和mac电脑上，齐活儿了

小苹果官方网站

里边有下载及安装和使用的方法

1.打开WebStorm,选择Create New Project from Existing Code，从使用现有的代码创建一个工程。

2.在新的d出框中选择Source files are in a local directory, no Web server is yet configured，然后点击Next.

3.选择搭建开发环境第一步中我们解压的Cocos2d-html5目录。并点击左上角的Project Root按钮,将这个文件夹作为项目根目录，将这个目录作为项目的根目录，并点击Finish，这样我们就把引擎导入到了WebStorm。

4.左侧就是项目文件目录，目录结构我们后面再说。其中有个HelloHTML5World目录，这个就是引擎给提供的HelloWorld程序。

5.双击打开其中的index.html文件，在代码中稍作停顿，能在右上角看到印有浏览器图标的d出框。点击Google Chrome,就可以运行HelloWorld了。

---