前端bug主要分为3个类别：HTML,CSS,Javascript三类问题
给个最大的区别方式方法：
出现样式的问题基本都是CSS的bug
出现文本的问题基本都是html的bug
出现交互类的问题基本都是Javascript的bug
现在以淘宝的前端人员工作为例进行相关bug定位的剖析
判断前后台问题的区分方法：
FF, 打开错误控制台，区分前后台交互：查看网络请求
a) Html中如果有链接，有响应的情况下，基本可以定位到是属于前端的问题
b) 如果为空，或者有出现error错误信息，我们就可以定位到属于后台开发的问题
TMS对应的VM模板，出现的一些截断控制，转换功能都属于前端的问题
查看Log日志
1、 cd 到log目录，log的目录一般是/home/admin/应用名/logs ，如hesper是：/home/admin/hesper/logs2、 cat 打开日志文件，如:cat hesper.log 也可以用 tail –f hesper.log 打开文件（实时显示文件更新）
日志分析：
1、 一般只关注warn以上级别的日志。
2、 错误都会先报出来, 然后找Caused by …. 那些都是引起错误的地方, 但是插入点应该是一开始
3、 有提示类的日志问题一般caused by 下第一行为错误方法，可以用自下而上法，先查看发布结果，为成功或者失败，如果失败再往上找到原因，然后往上找到最近的deployment failed的cause by 信息来排查问题，cause by存在层级关系由上级影响下级，最后一个cause by一般为根源问题。它是导致上一个cause by的原因。通过cause by的信息能找到出错的方法或者类，然后到代码和源码中进行review排查问题，并且修复问题。
4、正常日志无提示和错误的情况分析：有可能程序中，没有异常打印，只是catch 掉了。如果要处理需要调试，找到对应位置添加捕获条件。
5、对日志问题的判断
报错的地方：通过最直接的日志反应和提示能直接发现错误和问题，已经提示中都会提供给我们对应位置行数的信息
a) 内部问题，一般是有行数
b) 外部问题，一般无行数。例如依赖其他关系，其日志信息可能只能反映为超时，为空，无返回结果等，也是一个基本的划分方式
利用chrome的开发者工具 切换到Source标签页，开启自动暂停功能，行时脚本异常时，在异常脚本处暂停运行，跳转至调试页面，准确定位错位脚本位置
Element 标签页： 用于查看和编辑当前页面中的 HTML 和 CSS 元素。
Network 标签页：用于查看 HTTP 请求的详细信息，如请求头、响应头及返回内容等。
Source 标签页：用于查看和调试当前页面所加载的脚本的源文件。
TimeLine 标签页： 用于查看脚本的执行时间、页面元素渲染时间等信息。
Profiles 标签页：用于查看 CPU 执行时间与内存占用等信息。
Resource 标签页：用于查看当前页面所请求的资源文件，如 HTML，CSS 样式文件等。
Audits 标签页：用于优化前端页面，加速网页加载速度等。
Console 标签页：用于显示脚本中所输出的调试信息，或运行测试脚本等。