|
锁定老帖子 主题：和alert（）说再见
精华帖 (8) :: 良好帖 (0) :: 新手帖 (10) :: 隐藏帖 (0)
|
|
|---|---|
| 作者 | 正文 |
|
发表时间：2008-10-17
今天网上随便了溜达了一圈，发现了一个很好的javascript调试器，类似于java的控制台功能，以往调试javascript会输出n个alert的断点，调试很花时间。尽管这样的一个工具，很简单，自己也可以糊弄一个，网上既然提供了一个那又何必自己写呢，我只写网上没有的，哈哈，又开始吹了！
我写了一个很小的测试工具，供大家参考，代码如下 ：
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html>
<head>
<title> New Document </title>
<meta name="Generator" content="EditPlus">
<meta name="Author" content="">
<meta name="Keywords" content="">
<meta name="Description" content="">
<style type="text/css">
input {
border:1px solid #000000;
width:100px;
}
table{
border:1px solid #000000;
width:600px;
}
td{
padding:5px;
}
</style>
<script type="text/javascript" src="blackbird.js"></script>
<link type="text/css" rel="Stylesheet" href="blackbird.css" />
<script language="JavaScript">
<!--
var NAMESPACE = "bb" ;
//-->
</script>
</head>
<body>
<table>
<tr>
<td><input type="button" value="显示/隐藏" onclick="log.toggle()"/></td>
<td>log.toggle( )</td>
<td>显示/隐藏调试信息面板</td>
</tr>
<tr>
<td><input type="button" value="改变大小" onclick="log.resize()"/></td>
<td>log.resize( )</td>
<td>改变面板大小</td>
</tr>
<tr>
<td><input type="button" value="调试" onclick="log.debug('debug') "/></td>
<td>log.debug( Message )</td>
<td>输出调试信息</td>
</tr>
<tr>
<td>
<input type="button" value="消息" onclick="log.info(window.prompt('请输入值！','请输入值')) "/>
</td>
<td>log.info( Message )</td>
<td>输出消息</td>
</tr>
<tr>
<td><input type="button" value="警告" onclick="log.warn('worn') "/></td>
<td>log.warn( warn )</td>
<td>输出警告</td>
</tr>
<tr>
<td><input type="button" value="错误" onclick="log.error('error') "/></td>
<td>log.error( reeor )</td>
<td>输出错误信息</td>
</tr>
<tr>
<td><input type="button" value="计时" onclick="log.profile('local anchors') "/></td>
<td>log.profile( profile )</td>
<td>开始/结束计时</td>
</tr>
<tr>
<td><input type="button" value="清空" onclick="log.clear() "/></td>
<td>log.profile( )</td>
<td>清空调试消息</td>
</tr>
</table>
<br><br>
<table>
<tr>
<td>F2</td>
<td>显示/隐藏</td>
</tr>
<tr>
<td>Shift＋F2</td>
<td>移 动（move）</td>
</tr>
<tr>
<td>Alt ＋ Shift ＋ F2</td>
<td>清 空</td>
</tr>
<tr>
<td colspan="2">单击左上图标可以进行类型过滤；或者Alt ＋ 单击</td>
</tr>
</table>
</body>
</html>
注意最顶端的一行代码，很重要 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 我刚开始，就是因为这里没有写完整，一直都不能显示。
同时我将其源码js、css和图片提供给大家，让我们和alert说再见吧。 声明：ITeye文章版权属于作者，受法律保护。没有作者书面许可不得转载。
推荐链接
|
| 返回顶楼 | |
|
发表时间：2008-10-18
有FireDebug好用么
|
| 返回顶楼 | |
|
发表时间：2008-10-18
picora 写道 有FireDebug好用么
在IE上，我觉得这个还是比较不错的一个调试工具，功能比较全面，调试信息分类，同时可以实现过滤调试信息，允许键盘快速操作，而且是开源的，在此基础上，开发人员可以自由发挥自己的天才！ IE是大众浏览器，Fire好像很少有人在用。 |
| 返回顶楼 | |
|
发表时间：2008-10-18
楼上大哥，我找了半天没找到FireDebug,请问是什么软件，提供个连接，谢谢
|
| 返回顶楼 | |
|
发表时间：2008-10-18
afcn0 写道 楼上大哥，我找了半天没找到FireDebug,请问是什么软件，提供个连接，谢谢 这是一款针对firefox下javascript开发的debugger扩展。扩展自身内含了Venkman（一套针对基于mozilla浏览器的debugger环境）。也就是一个firefox的一个调试工具。 软件名称：Firefox的js debugger工具JavaScript Debugger-0.9.87.3。 可以到http://www.lupaworld.com/?action-download-itemid-3948上下载。 |
| 返回顶楼 | |
|
发表时间：2008-10-18
visual studio 2008带的脚本调试器最好使。
|
| 返回顶楼 | |
|
发表时间：2008-10-18
afcn0 写道 楼上大哥，我找了半天没找到FireDebug,请问是什么软件，提供个连接，谢谢
Firebug吧， Windows下有MS自家的Debugger足够了 PS：何必呢 
|
| 返回顶楼 | |
|
发表时间：2008-10-18
创意无限，简单实用 javascript-logger
本人自己写的javascript日志工具，大家不妨去看看. 一行js代码搞定所有的事情. GoogleCode:http://code.google.com/p/dewind/ Download:http://dewind.googlecode.com/files/beta-20081017.rar 
|
| 返回顶楼 | |
|
发表时间：2008-10-18
jzshmyt 写道 创意无限，简单实用 javascript-logger 本人自己写的javascript日志工具，大家不妨去看看. 一行js代码搞定所有的事情. GoogleCode:http://code.google.com/p/dewind/ Download:http://dewind.googlecode.com/files/beta-20081017.rar 楼上的大哥简直是天才啊，很强了，能够写出这种js调试工具，如此之前面，小弟很佩服。 |
| 返回顶楼 | |
|
发表时间：2008-10-19
vs的调试器的强悍之处在于（不仅仅是alert logger）：
1、监视表达式 2、单步 3、断点 4、本地变量的值 5、后退 |
| 返回顶楼 | |
