Firebug 学习使用教程

时间:2021-08-06 07:41:21

  Firebug是Firefox下的一个扩展,能够调试所有网站语言,如Html、Css等,但FireBug最吸引人的就是JavaScript调试功能,除此之外,还有对Dom的查看与调试,网站整体分析等其他功能。

调整Css样式


具体调整对比表:

初始样子   Firebug 学习使用教程 Firebug 学习使用教程
4次(1px)  Firebug 学习使用教程  Firebug 学习使用教程
Ctrl+↑ 5次(0.1px)  Firebug 学习使用教程  Firebug 学习使用教程
Shift+↑ 1次(10px)  Firebug 学习使用教程  Firebug 学习使用教程

Console的使用


console.log();    //输出信息

console.debug();   //与log方法一样

console.info();     //与log方法一样

console.warn();     //输出信息,并且在前面加一个黄色三角,表示警告

console.error();     //输出信息,并且在前面加一个红色的叉,表示出错,同时会显示错误发生的堆栈

console.dir();     //对一个对象进行检查(inspect),并以易于阅读和打印的格式显示,也可以将某个对象的所有方法陈列出来

console.group();    //显示的信息分组,与groupEnd方法一起使用

console.groupEnd();  //显示的信息分组,与group方法一起使用

console.time();     //time方法表示计时开始

console.timeEnd();   //timeEnd方法表示计时结束

console.trace();     //查询某个对象是如何被调用的

console.clear();    //清除当前控制台内容

举例说明-dir

Firebug 学习使用教程

举例说明-group

Firebug 学习使用教程        →      Firebug 学习使用教程