js之WEB开发调试利器:Firebug 下载


Posted in Javascript onJanuary 13, 2007

在米随随的Blog看到有关Firebug的介绍,遂下载试用了一下,确实是比较好的工具。

一、效果
js之WEB开发调试利器:Firebug 下载

二、主要功能

  • Inspect and edit HTML
  • Tweak CSS to perfection
  • Visualize CSS metrics
  • Monitor network activity
  • Debug and profile JavaScript
  • Quickly find errors
  • Explore the DOM
  • Execute JavaScript on the fly
  • Logging for JavaScript

对于WEB开发人员来说,可以非常方便的得到自己想要的信息:HTML、DOM、CSS、JS,甚至各个文件的下载时间。

刚测试了一下JS的调试功能,非常方便,可以设置断点,鼠标移至变量名上,可以得到相应值的提示。太棒了!

三、非Firefox浏览器的解决方案:Firebug Lite

对于非Firefox浏览器,Firebug也有相应的解决方案—Firebug Lite,通过使用console.log()输出错误信息至Firebug 控制台。

1.下载Firebug Lite

下载地址:http://getfirebug.com/releases/firebuglite1.0-b1.zip,解压至WEB目录,比如/js/firebug/。

在页面中增加以下代码:

  1. <script language="javascript" type="text/javascript" 
  2.             src="/path/to/firebug/firebug.js"></script>

如果不想安装Firebug Lite,只是为了避免Javascript错误,可以点击这里下载firebugx.js然后copy至代码中即可。

这个文件的代码如下:

  1. if (!("console" in window) || !("firebug" in console))
  2. {
  3.     var names = ["log", "debug", "info", "warn", "error", "assert", "dir", "dirxml",
  4.     "group", "groupEnd", "time", "timeEnd", "count", "trace", "profile", "profileEnd"];
  5.     window.console = {};
  6.     for (var i = 0; i < names.length; ++i)
  7.         window.console[names[i]] = function() {}
  8. }

2.使用Firebug Lite
默认情况下,打开页面后,可以按F12开启Firebug的控制台,如果不想频繁按F12来进入调试状态,也可在HTML元素上增加 debug=”true” ,如下:

  1. <html debug="true">

3.使用命令行

Firebug也包含一个命令行程序,可以使用以下快捷键Ctrl+Shift+L (or ⌘+Shift+L on Mac)

4.测试页面
按 F12 或 Ctrl+Shift+L,就可以看到效果了。

Javascript 相关文章推荐
JavaScript 私有成员分析
Jan 13 Javascript
showModalDialog在谷歌浏览器下会返回Null的解决方法
Nov 27 Javascript
Window.Open如何在同一个标签页打开
Jun 20 Javascript
基于jquery实现表格内容筛选功能实例解析
May 09 Javascript
jQuery购物车插件jsorder用法(支持后台处理程序直接转换成DataTable处理)
Jun 08 Javascript
JavaScript用200行代码制作打飞机小游戏实例
Jun 21 Javascript
对于input 框限定输入值为浮点型的js代码
Sep 25 Javascript
mpvue全局引入sass文件的方法步骤
Mar 06 Javascript
node实现mock-plugin中间件的方法
Dec 25 Javascript
JavaScript实现省份城市的三级联动
Feb 11 Javascript
vue+vuex+axios从后台获取数据存入vuex,组件之间共享数据操作
Jul 31 Javascript
JS数组转字符串实现方法解析
Sep 04 Javascript
用js实现多域名不同文件的调用方法
Jan 12 #Javascript
cssQuery()的下载与使用方法
Jan 12 #Javascript
JavaScript基本对象
Jan 11 #Javascript
window.showModalDialog使用手册
Jan 11 #Javascript
新手入门常用代码集锦
Jan 11 #Javascript
javascript引用对象的方法
Jan 11 #Javascript
一份老外写的XMLHttpRequest代码多浏览器支持兼容性
Jan 11 #Javascript
You might like
2014最热门的24个php类库汇总
2014/12/18 PHP
Laravel构建即时应用的一种实现方法详解
2017/08/31 PHP
详解使用php-cs-fixer格式化代码
2020/09/16 PHP
JQuery 学习笔记 选择器之二
2009/07/23 Javascript
node.js正则表达式获取网页中所有链接的代码实例
2014/06/03 Javascript
BootStrapTable 单选及取值的实现方法
2017/01/10 Javascript
angular写一个列表的选择全选交互组件的示例
2018/01/22 Javascript
世界上最短的数字判断js代码
2019/09/09 Javascript
jQuery实现B2B网站后台管理系统侧导航
2020/07/08 jQuery
vue中全局路由守卫中替代this操作(this.$store/this.$vux)
2020/07/24 Javascript
js canvas实现五子棋小游戏
2021/01/22 Javascript
python实现获取客户机上指定文件并传输到服务器的方法
2015/03/16 Python
在Django中进行用户注册和邮箱验证的方法
2016/05/09 Python
python 获取sqlite3数据库的表名和表字段名的实例
2019/07/17 Python
在python中计算ssim的方法(与Matlab结果一致)
2019/12/19 Python
python 实现将Numpy数组保存为图像
2020/01/09 Python
完美解决python针对hdfs上传和下载的问题
2020/06/05 Python
纯CSS实现设置半个字符的样式
2014/07/03 HTML / CSS
草莓网美国官网:Strawberrynet USA
2016/12/11 全球购物
美国专营婴幼儿用品的购物网站:buybuy BABY
2017/01/01 全球购物
开业庆典答谢词
2014/01/18 职场文书
销售人员自我评价
2014/02/01 职场文书
入学生会自荐书范文
2014/02/05 职场文书
《记金华的双龙洞》教学反思
2014/04/19 职场文书
社区优秀志愿者先进事迹
2014/05/09 职场文书
优秀班组长事迹
2014/05/31 职场文书
护理专科学生自荐书
2014/07/05 职场文书
组工干部对照检查材料
2014/08/25 职场文书
党员对照检查材料整改措施思想汇报
2014/09/26 职场文书
大学生翘课检讨书范文
2014/10/06 职场文书
2014年教研工作总结
2014/12/06 职场文书
2015年度企业工作总结
2015/05/21 职场文书
go结构体嵌套的切片数组操作
2021/04/28 Golang
JavaScript实现简单拖拽效果
2021/09/15 Javascript
MYSQL如何查看进程和kill进程
2022/03/13 MySQL
MySQL 数据表操作
2022/05/04 MySQL