非常酷的 Javascript 简单调试工具Blackbird
Blackbird 是一个开源的 Javascript 调试工具,默认提供一种非常酷的方式展现 Javascript 调试信息,如下图,效果如何呢?
在我们的日常的学习或工作中,经常都会接触到 Javascript,有时为了进行一些简单的调试,我们也许会采用 alert(),但有时也是很麻烦的,比如在一个循环中,我们可能就要点击 n 次的弹出窗口了。但现在有了 Blackbird,我们就可以和 alert() 说拜拜了。
虽然有人说会很多 Javascript 类库都有类似功能,但我可不想因为进行一些简单的调试而去加载一个框架,因为 Blackbird 足够简洁和小巧了,就 4 个文件,20 多 KB:
4 个文件:
blackbird.js,blackbird.js,blackbird_icons.png,blackbird_panel.png
使用也非常简单,保持 css 文件和 png 文件在同一目录下(注:当然你也可以修改 css 文件,使之按你想要的目录方式存放。),然后在你想调试的页面的 < head> 和 < /head> 之间加载该 js 和 css 文件即可,大概代码如下:
<html>
<head>
<script type="text/javascript" src="/PATH/TO/blackbird.js"></script>
<link type="text/css" rel="Stylesheet" href="/PATH/TO/blackbird.css" />
...
</head>
...
Blackbird 支持当前的主流浏览器如 ie6+,Firefox2+,Safari2+,Opera9.5 等,并支持快捷键操作,非常方便。
F2: 显示和隐藏控制台
Shift + F2 : 移动控制台(目前只支持移动到四个角,如果支持随意拖动就更炫了。)
Alt + Shift + F2:清空控制台信息
同时,Blackbird 还提供多个公共 API:
log.toggle() 显示或隐藏 Blackbird
log.move() 移动
log.resize() 修改 Blackbird 窗口显示大小
log.clear() 清空信息
log.debug( message ) debug 信息
log.info( message ) 一般消息
log.warn( message ) 警告信息
log.error( message ) 错误信息
log.profile( label ) 计算消耗时间
使用方法也很简单,如想在 Javascript 代码里调用 Blackbird,代码如下:
log.debug( 'this is a debug message' );
log.info( 'this is an info message' );
log.warn( 'this is a warning message' );
log.error( 'this is an error message' );
或一个更详细,具体的例子:
log.profile( 'local anchors' );
var anchors = document.getElementsByTagName( 'A' );
for ( var i = 0; i < anchors.length; i++ )
{
if ( anchors[ i ].name )
{
log.debug( anchors[ i ].name );
}
}
log.profile( 'local anchors' );
以上代码来自 Blackbird 官方,演示和下载地址如下所示:
Demo:http://www.gscottolson.com/blackbirdjs/
Download:blackbirdjs-1.0.zip
License:MIT License
非常酷的 Javascript 简单调试工具Blackbird的更多相关文章
- 分享十个JavaScript在线调试工具
测试Javascript可能是网页开发中最让人忧伤的工作.这里我找一些比较好的工具来帮助大家进行测试工作.这10款是我精选的基于浏览器的JavaScript在线调试工具,希望你们对你们有用. 1.Op ...
- JavaScript简单入门(补充篇)
本文是对上一篇 JavaScript简单入门 的一些细节补充. 一.全局变量和局部变量 在<script>标签内定义的变量是当前页面中的全局变量.即 <script>标签可以直 ...
- 《javascript高级程序设计》读书笔记(一)javascript简单介绍
第一章:javascript简单介绍 Netscape Navigator 开发的javascript Javascript的实现有三部分: 1.核心(ECMAScript):提供核心语言功能. ...
- Javascript 简单实现鼠标拖动DIV
http://zhangbo-peipei-163-com.iteye.com/blog/1740078 比较精简的Javascript拖动效果函数代码 http://www.jb51.net/art ...
- 超酷的JavaScript叙事性时间轴(Timeline)类库
在线演示 Timeline 是我见过的最酷的展示事件随时间发展的javascript实现.你可以基于时间使用讲故事的方式来创建时间轴特效,整个时间轴以幻灯的方式来展示,你可以穿插图片,视频或者是网站, ...
- [Java Web] 4、JavaScript 简单例子(高手略过)
内容概览: JavaScript简介 JavaScript的基本语法 JavaScript的基本应用 JavaScript的事件处理 window对象的使用 JavaScript简介: JavaScr ...
- javascript - 简单实现一个图片延迟加载的jQuery插件
最近在看一本书<Third-Party Javascript>很不错,推荐给大家,下载地址各位自己搜索了. 步骤: 1.打开google,鉴于google基本打不开,那么就打开这个网址吧. ...
- Flash Socket简单调试工具
写了一个简单的Flash Socket调试工具,可用来简单调试本地或者外部socket服务器,使用的时候注意Flash socket的安全策略问题,有问题请联系sky-wang@qq.com.
- javascript 简单的计算器
<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx. ...
随机推荐
- js跳转整理(简记)
location.replace(URL)跳转脱离历史记录流: location.href=url;在历史记录中 子刷新父级 parent.location.replace(parent.locati ...
- HTTP.SYS
严格地说,HTTP.SYS已经不属于IIS 的范畴了,所以HTTP.SYS的配置信息也没有保存在IIS 的元数据库(Metabase) 中,而是定义在注册表中.HTTP.SYS 的注册表项的路径为HK ...
- Educational Codeforces Round 30 B【前缀和+思维/经典原题】
B. Balanced Substring time limit per test 1 second memory limit per test 256 megabytes input standar ...
- 洛谷——P1088 火星人
P1088 火星人 题目描述 人类终于登上了火星的土地并且见到了神秘的火星人.人类和火星人都无法理解对方的语言,但是我们的科学家发明了一种用数字交流的方法.这种交流方法是这样的,首先,火星人把一个非常 ...
- Superbull(最大生成树)(Kruskal)
Superbull 时间限制: 1 Sec 内存限制: 64 MB提交: 49 解决: 13[提交][状态][讨论版] 题目描述 Bessie and her friends are playin ...
- Jenkins一个任务下载多个git库代码
公司的项目是微服务架构,一个服务对应的一个git仓库,现在的需求时拉取所有仓库代码下来,指定父级的pom.xml,一次性构建打包 jenkins在默认情况下,一个任务只能配置一个git仓库地址 1.安 ...
- C#将json字符串解析成对象
首先我们在客户端生成json字符串,通过ajax把该字符串传到服务器端 //这是一个以id,email,age的json字符串 var jdata="[{\"id\&quo ...
- How to Analyze "Deadlocked Schedulers" Dumps?---WINDBG
https://blogs.msdn.microsoft.com/karthick_pk/2010/06/22/how-to-analyze-deadlocked-schedulers-dumps/ ...
- Android 智能指针学习 一
Android5.1 中智能指针涉及的文件如下: system/core/include/utils/RefBase.h system/core/libutils/RefBase.cpp system ...
- CMD_命令行
一.bat执行一闪而过 最后一个end下一行,加PAUSE 二.cmd命令:不是内部或外部命令,也不是可运行的程序或批处理文件 解决: 需将路径先切换到system32下 cd c:\WINDO ...