`
278506470
  • 浏览: 10805 次
  • 性别: Icon_minigender_1
  • 来自: 武汉
社区版块
存档分类
最新评论

和alert()说再见

阅读更多

  今天网上随便了溜达了一圈,发现了一个很好的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说再见吧。

分享到:
评论
33 楼 kaka2008 2008-10-21  
    刚看到新闻这个新闻是,觉得比较新鲜,自己试着弄了弄,没出来,经LZ指点,才知道少了一句话。

    可是,昨天调试代码时,还是不自觉用了alert(),想想,还是alert()好用。

    怎么说呢,就像大家使用浏览器时,首选是IE一样。(平时用chrome,但开发时用IE)

    可能是习惯问题吧,毕竟从刚开始学就用alert.
32 楼 278506470 2008-10-21  
278506470 写道

peacock 写道
VS虽然超级庞大,但是运行速度超级快,是所有IDE开发工具最快的,只需要1秒左右的时间,简直无法想象微软是怎么做到的!而且占用内存也相当的小 VS的功能更是没的说,强!但是我还是不喜欢,感觉装个东西很麻烦!


我赞成,有同感!不喜欢在机器上装太多的东西了。
31 楼 stefenjun 2008-10-20  
一个比一个强。。真不知从哪个开始入手试试
30 楼 programming 2008-10-20  
firefox 的firebug 网页代码指向,源代码编辑,所改所见,很方便,前端开发的,如果不会,那真是少了一块金啊
29 楼 programming 2008-10-20  
firebug  firefox 插件 很好用,
28 楼 ebeach 2008-10-20  
peacock 写道
VS虽然超级庞大,但是运行速度超级快,是所有IDE开发工具最快的,只需要1秒左右的时间,简直无法想象微软是怎么做到的!而且占用内存也相当的小

VS的功能更是没的说,强!


大哥您花多少钱买地啊。
27 楼 278506470 2008-10-20  
peacock 写道
VS虽然超级庞大,但是运行速度超级快,是所有IDE开发工具最快的,只需要1秒左右的时间,简直无法想象微软是怎么做到的!而且占用内存也相当的小

VS的功能更是没的说,强!


但是我还是不喜欢,感觉装个东西很麻烦!
26 楼 peacock 2008-10-20  
VS虽然超级庞大,但是运行速度超级快,是所有IDE开发工具最快的,只需要1秒左右的时间,简直无法想象微软是怎么做到的!而且占用内存也相当的小

VS的功能更是没的说,强!
25 楼 278506470 2008-10-20  
believe 写道

278506470 写道

picora 写道
有FireDebug好用么  在IE上,我觉得这个还是比较不错的一个调试工具,功能比较全面,调试信息分类,同时可以实现过滤调试信息,允许键盘快速操作,而且是开源的,在此基础上,开发人员可以自由发挥自己的天才!   IE是大众浏览器,Fire好像很少有人在用。Fire怎么可能很少人用呢 就我知道的 我周围很多做web开发的都是在Fire上用firebug来调试javascript的


可能吧,或许我也要尝试一下Fire,感觉一下Firebug的好了。
24 楼 believe 2008-10-20  
278506470 写道
picora 写道
有FireDebug好用么


  在IE上,我觉得这个还是比较不错的一个调试工具,功能比较全面,调试信息分类,同时可以实现过滤调试信息,允许键盘快速操作,而且是开源的,在此基础上,开发人员可以自由发挥自己的天才!
  IE是大众浏览器,Fire好像很少有人在用。

Fire怎么可能很少人用呢 就我知道的 我周围很多做web开发的都是在Fire上用firebug来调试javascript的
23 楼 king_108 2008-10-20  
278506470 写道
picora 写道
有FireDebug好用么


  在IE上,我觉得这个还是比较不错的一个调试工具,功能比较全面,调试信息分类,同时可以实现过滤调试信息,允许键盘快速操作,而且是开源的,在此基础上,开发人员可以自由发挥自己的天才!
  IE是大众浏览器,Fire好像很少有人在用。



FIREFOX 怎么可能很少人在用,笑
22 楼 jltest 2008-10-20  
推荐firebug。。。。。
21 楼 share2227 2008-10-20  
哪个 兄弟给弄个调试的例子,调试器 没玩明白。
20 楼 278506470 2008-10-20  
ahrhu 写道

这个可以做什么呀!我怎么不晓得拿来有什么用处呢?? &nbsp; 可以请教一下吗?


  不知道阁下是不是做web开发的,博客提供的主要就是javascript的一个调试器,什么意思呢?就是做javascript编程的时候,IE本身不能做单步调试,那么只有我们这些开发人员想办法了,想到的办法就是利用js自己写脚本调试javascript程序,目的就是方便开发,js是一门很灵活的语言,没有统一的编程调试环境,所以只有自己想办法了。不像java,不知道我这样解释是否明白。
19 楼 278506470 2008-10-20  
black.angel_can 写道

VS不强悍的地方就是 巨BIG


有同感!太大了!
18 楼 ahrhu 2008-10-20  
这个可以做什么呀!我怎么不晓得拿来有什么用处呢??
  可以请教一下吗?
17 楼 leiliang 2008-10-20  
干什么要装vs调试器呢,ie下office里带的那个小脚本调试器功能差不了多少,还可以独立安装
16 楼 dunsword 2008-10-20  
vs调试器好是好,但是为了调个js要安个这么大家伙,有点受不了!
15 楼 black.angel_can 2008-10-20  
VS不强悍的地方就是 巨BIG
14 楼 278506470 2008-10-19  
kimmking 写道

278506470 写道

kimmking 写道
vs的调试器的强悍之处在于(不仅仅是alert logger): 1、监视表达式 2、单步 3、断点 4、本地变量的值 5、后退 如果不是.net 开发呢?是不是也要装一个vs?可以选择只安装.net核心部分,去掉c#,vb.net,c++这些东西

  好像很大的呢!有一点恐怖!

相关推荐

    jsalert,confirm,prompt的用法(附加一段有用的alert代码.pdf

    总的来说,`alert()`、`confirm()`和`prompt()`是JavaScript中最基础的用户交互手段,虽然简单但功能实用。理解并合理运用它们,可以帮助开发者构建更加互动和友好的网页应用程序。然而,为了提供更高级的用户体验,...

    扰流警报「Spoiler Alert」-crx插件

    阻止来自Facebook新闻传送的潜在电视节目和体育剧透。 SpoilerAlert是一款谷歌浏览器...现在,与SpoilerAlert说再见那些不必要的职位!只要告诉我们你要遵循什么,剩下的就做好了。 支持语言:English (United States)

    DOM学习笔记

    例如:`&lt;body onunload="alert('再见,期待您的下次访问!')"&gt;` - **Onbeforeunload**:页面即将关闭时触发的事件,可用于提示用户。例如:`您确定要离开吗?';"&gt;` - **鼠标事件与键盘事件**: - **Window.event*...

    JS监听关闭浏览器事件

    这通常涉及到`onbeforeunload`和`onunload`这两个事件处理程序。 #### 1. `onbeforeunload`事件 `onbeforeunload`事件是在用户尝试关闭窗口、标签页或者刷新页面时触发的。这是一个非常有用的事件,因为它允许...

    八种常用JavaScript小程序集锦

    &lt;body bgcolor="#fef4d9" onUnload="window.alert('再见了!欢迎下次再来!')"&gt; ``` **说明:** 这两个示例分别演示了如何在用户离开页面时弹出一个新的窗口或显示一个提示框来与用户告别。这对于增加用户的情感...

    JavaScript 正则表达式

    ')" onunload="alert('再见!')"&gt; ``` - 这段代码定义了`&lt;body&gt;`标记,在文档加载完成后会显示“网页读取完成,请慢慢欣赏!”的消息框,在用户离开文档时会显示“再见!”的消息框。 - **在JavaScript中指定**: ...

    代码\代码文件各种动画数字时钟

    &lt;body onunload="window.alert('再见!请访问我们的网站http://2929.2000y.net/')"&gt; ``` 这段代码会在用户离开页面时显示一条告别消息。 ### 5. 实现飞花和雪花特效 除了上述代码外,文章还提到了实现飞花和雪花...

    JQuery Tips相关(1)—-关于$.Ready()

    总的来说,$(document).Ready()、OnLoad事件和$(window).load()都是确保代码在适当时间执行的方法,各有优缺点。理解它们之间的区别和适用场景,能帮助开发者编写出更加高效、流畅的前端代码。在实际项目中,根据...

    javascript中运用闭包和自执行函数解决大量的全局变量问题

    但是从全局看来,这样会导致出现一些让我们难以掌控的情况的出现:变量... // 定义一个全局变量 var msg2 = “再见!” //定了另一个全局变量 [removed] = function() { alert&#40;msg1&#41;; } [removed] = function()

    JavaScript入门教程(11) js事件处理

    ')" onunload="alert('再见!')"&gt; ``` 这样,当页面加载完毕或关闭时,对应的警告框会被显示。 2. **方法二:编写特定对象特定事件的JavaScript**。这种方式相对较少用,但有时非常有用。例如: ```html ...

    每天一篇javascript学习小结(Date对象)

    在今天的学习小结中,我们将深入了解JavaScript中的Date对象,并对其基本使用方法进行梳理。Date对象是JavaScript中非常重要的内置对象,它允许我们处理日期和...希望以上的知识点对您有帮助,我们明天的学习小结再见。

    常用的javascript 验证

    alert(strMsg + "未填写!"); return true; } return false; } ``` ### 2. 判断输入是否为中文字符 (isChinese) 此函数用于判断输入的字符串`str`是否全部由中文字符组成。它首先定义了一个包含所有非中文字符...

Global site tag (gtag.js) - Google Analytics