1. 前端开发是怎么调试的
如果是网页开发的话呢 可以使用浏览器的f12 开发人员工具调试。如果是安卓或者ios呢可以抓包获取接口请求信息，或者使用日志输出来检测。
2. Web前端用什么工具调试
Web前端开发中，为编写高效的HTML/CSS/JavaScript，优化Web前端性能，不可避免要分析HTTP请求头和响应头，调试HTML/CSS/JavaScript。这时候，我们就需要用到一些Web前端的开发调试工具。以下的工具，是Web前端工程师最常用的：
1.FireBug
2012年以前，火狐狸几乎是所有前端开发者最喜欢的浏览器，基于FireFox的插件FireBug成了Web前端工程师开发调试网页的首选利器。
2.Chrome Developer Tools
自从2011年FireBug的开发者J.Barton跳槽到Google，负责开发Chrome Developer Tools后，Chrome Developer Tools就有了本质性的变化。于是，Web前端开发工程师最喜欢的浏览器又变成了Chrome，Chrome Developer Tools也就顺理成章成为开发调试网页的不二利器了。
3.Fiddler 2
FireBug和Chrome Developer Tools虽好，只是分别针对FF和Chrome，那么有没有针对所有浏览器或者针对HTTP协议的调试工具呢？那就是Fiddler 2了。
这些工具都提供了种类繁多的功能，要完全掌握并非易事。初学者打开一看，密密麻麻的，往往有无从下手的感觉。其实呢，工具的使用很简单，无它，唯手熟尔。初学者有无从下手的感觉，是因为不了解工具背后的原理而已。
3. js前端调试的几个小技巧
1. debugger;
我以前也说过，你可以在JavaScript代码中加入一句debugger;来手工造成一个断点效果。
需要带有条件的断点吗？你只需要用if语句包围它：
if(somethingHappens){
debugger;
}但要记住在程序发布前删掉它们。
2. 设置在DOM node发生变化时触发断点
有时候你会发现DOM不受你的控制，自己会发生一些奇怪的变化，让你很难找出问题的根源。
谷歌浏览器的开发工具里有一个超级好用的功能，专门可以对付这种情况，叫做“Break on…”，你在DOM节点上右键，就能看到这个菜单项。
断点的触发条件可以设置成这个节点被删除、节点的属性有任何变化，或它的某个子节点有变化发生。
3. Ajax 断点
XHR断点，或Ajax断点，就像它们的名字一样，可以让我们设置一个断点，在特点的Ajax调用发生时触发它们。
当你在调试Web应用的网络传输时，这一招非常的有效。
tumblr_inline_n1s7ceQ08c1r2
4. 移动设备模拟环境
谷歌浏览器里有一些非常有趣的模拟移动设备的工具，帮助我们调试程序在移动设备里的运行情况。
找到它的方法是：按F12，调出开发者工具，然后按ESC键(当前tab不能是Console)，你就会看到第二层调试窗口出现，里面的Emulation标签页里有各种模拟设备可选。
当然，这不会就变成了真正的iPhone，只是模拟了iPhone的尺寸，触摸事件和浏览器User Agent值。
tumblr_inline_n1s71kb2NL1r2
5. 使用Audits改进你的网站
YSlow是一个非常棒的工具。谷歌浏览器的开发者工具里也有一个非常类似的工具，叫Audits。
它可快速的审计你的网站，给你提出非常实际有效的优化你的网站的建议和方法。
4. 前端的开发调试测试的环境怎么搭建
前端环境搭建系列的目的是把前端团队作为一个整体，如何有效的团队协同开发，第一部分开发环境。
1.代码版本管理
SVN是必不可少了，版本号的规划按照项目三位版本，开发四位版本来部署。比如我要做A项目，版本号为1.0.0，我第一次提测的代码版本为1.0.0.1。每次四位版本按照tag区分。QA按照这个tag部署测试代码，OP则部署线上代码。
如果多个项目同时开发，就开分支。这些需要一个项目管理平台来管理版本。
2. 开发环境
我假设前端team的范畴是HTML CSS JS MVC中的V 和 C。最佳的环境是每个人一个开发环境，代码通过SVN同步别人的代码。但是文件的路径全部都一致。
比如
css的img.xx.com/css
js的img.xx.com/js
flash的img.xx.com/swf
后台环境，假设每个后端开发也都有独立的环境，如果和谁联调代码就让他把配置指向你的V C目录进行调试。
QA环境的debug问题，你的环境和QA环境代码部署一致，能够通过host切换静态文件，如css js flash。毕竟前端的大部分问题是前端代码的问题，V 和 C的问题就在自己的环境调试了，静态资源切换到QA的host。
数据问题，最后有个大的造数据平台，通用一份数据库，提供数据增加和修改的接口，这是理想状态，当然这个平台也会很麻烦，实在不行就通过后端的数据操作接口操作数据。
3.编译环境
可恶的前端代码裸上，会有很多问题，大部分是性能问题，还有部分是缓存问题。
所以需要提供编译环境，编译流程放在提测前是安全的，因为会经过QA的质量检测，如果在OP环节应该比较麻烦，编译代码的bug也没人去测。
编译一般解决的事情
1、批量的一些操作，比如版本号
2、代码的合并和压缩
3、代码的优化或者职能替换，比如资源打包
我遇到过的开发状况都不乐观。所以有时间自己搭下试试有多复杂。
一般有公用开发环境，就一台机器一个host，不管主干分支都放在那里，可想又多混乱，还有前端无版本管理软件，人肉维护多个并发版本。
或者有版本管理，开发环境还是多人一个，而且没有host，静态资源引入都是通过模板conf管理路径的。这样的代码不利于资源路径管理，特别是图片，加入png半透明的需要全路径，多个css合并的最好是根目录路径。
各种悲剧，此文到此结束。下篇为开发模式和模块化。
5. 前端怎么添加debugger调试
在JS代码中加入debugger关键字即可
var str=100;
for(var i=0;i<10;i++)
{
str +=i*2;
debugger;
}
6. 怎样方便的调试前端代码
最简单的方式就是 live reload 。可以看看 Browsersync ，command line 的方式应该不用写代码，不过你要装个 node + npm 。
7. 前端怎么在chrome进行调试
打开Google浏览器，打开任意一个网页，这里以网络首页为例
按下F12键，能看到会弹出如下图所示的对话框
鼠标右键需要修改的地方
可以看到需要改动的地方，对应区域的CSS样式都在右侧区域显示
鼠标左键单击箭头所指区域，可添加所需的样式，并且可以实时的显示出来，当不需要时，去掉勾选即可，也可以直接按删除，制表符Tab可以自动补全属性名称
可以根据标签的id或者class值获取其属性，当提示undefined时，就需要查看是否存在这个标签值
下图显示的是进入网页所需的文件，同样的可以在里面直接修改，但不会保存到本地文件中
8
下面才是调试的重头戏，以12306购票网为例，按下F12，打开需要调试的JS文件，在行开头单击鼠标左键，打下断点，如下图所示。快捷键F11是进入下一步，shift+F11跳出进入下一步，F8跳到下一个断点，这样就可以看到每一步程序运行所显示的结果，此时可以用步骤6用到的方法来查看标签的属性
8. 怎么在移动端调试web前端
可以直接用satari开发工具调试。chrom
+android也有类似的工具组合，但是没有实际
过。楼主如果觉得不太满意的话，可以去后盾人看看，那里也许会有不错的答案
9. 如何用手机进行本地前端调试
第一步：连接电脑与手机
1. 手机打开“开发者选项”
安卓手机进入“设置”—>“关于手机”—> 在“版本号”上点7次（或其他的版本号位置，一个个试肯定有……）
然后“开发者选项”就出现在“设置”里面了。
2. 手机打开“USB调试”
进入“开发者选项”—>打开“USB调试”（如果想手机长亮还要打开“不锁定屏幕”）
3. 连接并允许调试
用USB数据线将手机与电脑连接—>手机上出现“允许该电脑调试”时点“允许”（可能会晚点出现，先去第二步）
第二步：用电脑启动手机浏览
1. 打开chrome的inspect
在电脑chrome地址栏中输入chrome://inspect—>勾选“Discover USB devices”
如无意外在Devices中会出现手机型号。
如果没有，再确认下：开发者选项、USB调试、允许该计算机调试
2. 手机打开chrome app
在手机中打开chrome，这时电脑的chrome inspect中会出现输网址的地方。
3. 测试手机浏览的控制
在电脑chrome inspect输入框中随便输个在线网址，点Open，手机chrome就会打开该页面。用电脑chrome可以控制刷新、关闭，但是用来调试的inspect点开是空白，应该是被墙了。
第三步：用手机测试本地页面
1. 开启本地服务器
对的，很遗憾手机chrome不能进行静态页面的调试。
所以必须开本地服务器，所幸现在有gulp+webserver，用法这里不讲了。
总之，完成这一点后，你应该在电脑上用 http://localhost 来浏览网页了。
2. 电脑chrome开启端口转发
在chrome inspect中点“Port forwarding...”—>把端口和localhost链接输进去（比如8000和localhost:8000）—>勾选“Enable port forwarding”—>Done
3. 打开手机浏览localhost
如：输入http://localhost:8000 点Open
这样手机就能打开页面了。
10. jsp文件前端怎么调试
在jsp页面进行调试，需要使用IE浏览器自带的开发人员工具。
首先打开你的项目，运行。
然后打开你要调试的jsp页面。
点击 浏览器右上角的工具按钮。