移动端调试小结

web应用调试分几部分：检查dom结构树和样式树，抓取脚本的执行log，查看网络请求和返回，以及通过performance tools 进行性能调优。现有的调试工具除了项目执行环境提供的（比如chrome的 dev-tool 和safair的开发者工具），还有嵌入工程的三方library（比如 eruda）, 还有通过嵌入脚本，远端执行调试的weinre等等    

各种调试技巧和姿势，网上都有总结，以下推荐一些总结的很好的文章：

聊一聊移动端调试那些事

超完整的Chrome浏览器客户端调试大全

嵌入工程的three-party library调试法：

Eruda

项目中总是会衍生特殊的需求和问题比如要求页面在IE 8、9、10或edge 中正常运行，比如需要调试的版本在chrome devtools 中没有对应的模拟器...这个时候你需要面向搜索引擎编程了

mac 上如何提供IE 8 、9 、10 、edge的调试环境

1、首先确认已打开safair 的 开发者调试工具（如果不清楚，请看上面的链接），在菜单栏中出现 “开发”一项；

2、在safair 中打开工程项目，打开 开发 --- 用户代理 ，选择你所需要的浏览器版本

chrome devTools 上如何添加特定机型的webView 版本

1、打开chrome 的开发者工具（如果不清楚，请看上面的链接），切换至mobile 模拟器窗口，打开机型选择中的edit项

2、查看需要调试的webView 的UA（系统默认浏览器，在“设置中查看”，app中的，需要通过JS api, navigator.userAgent获取）

3、获取到的UA 和 安卓官方提供的UA string 进行对比，通过chrome 的版本号（类似Chrome/58.0.3029.83 Mobile Safari/537.36）确定官方的UA string , 添加UA，完成自定义