web前端开发调试工具--从火狐到谷歌

          随着前端技术的发展，css，html，javascript不断的改进和发展，前端代码复杂化也需要很好的调试工具，每个浏览器机会都有开发者工具，可以用来调试代码，按F12就能进入调试界面。本文主要探讨的是火狐的firbug和谷歌的开发者工具。

                                 火狐：

                             

                             谷歌：

                         

       相同的调试功能：

             1、HTML和Elements都是查看dom树结构，

            2、都可以通过左上边的箭头定义到任意元素上，然后右边的框中出现元素的css，可以临时修改里面的css样式

            3、脚本和source可以打开js脚本文件通过设置断点调试js。

            4、网络和Network可以查看http通信情况，调试ajax连接等

       谷歌有优势的调试功能：

        console的强大功能，打开console，可在里面输入命令帮助调试js，通常用的alert，会阻塞线程运行，不点击弹出框的确定按钮不会往下运行，所以借助console达到同样的调试效果但避免阻塞程序运行。

      

          在调试js代码时我们可以在js里利用console里的方法，在console里输出信息；下面介绍console常用的方法：

           console.log("开始了")；打印出普通信息；

           console.info()；打印出提示信息；

           console.warn()    警告信息 ；

           console.error()    错误信息

       

          console.assert(arg1,arg2);当arg1为false时才输出信息arg2；

       

         console.count() ；统计函数执行了多少次;

      

           console.time()  ;console.timeEnd()  ;计时开始到计时结束耗费的时间，根据耗时可以优化算法；

         （注：括号里的参数必须是一样的；）