`
278506470
  • 浏览: 10802 次
  • 性别: 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说再见吧。

分享到:
评论
73 楼 278506470 2008-11-16  
welllove53 写道
唉,可怜的人不知道有Firebug,都不知道在混什么


Firebug的确很好,但是在IE上能够运行的js并不一定能够在Firebug上正常使用,这就是我苦恼的事情。
72 楼 welllove53 2008-11-16  
唉,可怜的人不知道有Firebug,都不知道在混什么
71 楼 freedomstyle 2008-11-15  
    Firefox很好用啊!!不过楼主写出来一个也很不错哈!!
70 楼 playfish 2008-11-12  
firebug就好了,整这个东西干嘛
69 楼 278506470 2008-11-12  
baitianli2007 写道

老大你还没说这个到底怎么用呢。。。怎们进行调试啊???


直接下载提供的文件,打开“blackbird.html”文件,页面示例已经提供的使用方法和功能。或者直接看“blackbird.html”文件源码。说明已经很清楚了。
68 楼 baitianli2007 2008-11-12  
老大你还没说这个到底怎么用呢。。。
怎们进行调试啊???
67 楼 diddyrock 2008-11-08  
Venkman+moliza 蛮爽的,而且IE不遵守w3c规范的,有些事件和属性其他浏览器不支持
我现在机器上3种浏览器
IE用来调网页布局,不得不说ie的解析最准确
firefox用来日js
chrome用来上网
66 楼 hanhaify 2008-11-07  
IE8已经支持调试,功能很强的说 F12 即可看到
65 楼 278506470 2008-11-04  
kakalun 写道

楼主,我不是很明白, 该怎么使用啊?

你说的是bolg中的js调试吗 ?
64 楼 278506470 2008-11-04  
achun 写道

关键没有tree呀


你说的什么没有tree ?不明白!
63 楼 achun 2008-11-03  
关键没有tree呀
62 楼 kakalun 2008-11-03  
楼主,我不是很明白,
该怎么使用啊?
61 楼 贝特虫子 2008-11-02  
强烈推荐 firefox+firebug调试 JS!
60 楼 278506470 2008-10-30  
taelons 写道

如果用firebug,必须使用标准的js语法即w3c dom,ms dhtml的那套js语法有很多在firebug里会报错。所以最好项目一开始就用firebug调试js,并尽量使用w3c dom的js语法,否则,你可能会发现一大堆错误,根本不能运行到你想debug的代码行,先要进行大量的修改,使代码符合w3c dom标准

望而生畏,很可怕,一个成型的项目,一个成型的项目再去改,我受不了!
59 楼 taelons 2008-10-29  
如果用firebug,必须使用标准的js语法即w3c dom,ms dhtml的那套js语法有很多在firebug里会报错。所以最好项目一开始就用firebug调试js,并尽量使用w3c dom的js语法,否则,你可能会发现一大堆错误,根本不能运行到你想debug的代码行,先要进行大量的修改,使代码符合w3c dom标准
58 楼 278506470 2008-10-29  
的bug,我就是不说........
bluecrystal 写道

先用firefox+firebug调试,通过了再在ie上做兼容性测试,ie不过,再说。在绝大多数情况,ff下通过了,ie一般都过。ie6.7我都发现了好几个隐藏的很深的bug,我就是不说........

这位老兄真幽默!
既然自己发现了,就和大家分享一下经验了,不要这么保守!你告诉我,我会让全世界人帮你保密!
开玩笑了。
57 楼 bluecrystal 2008-10-29  
先用firefox+firebug调试,通过了再在ie上做兼容性测试,ie不过,再说。
在绝大多数情况,ff下通过了,ie一般都过。

ie6.7我都发现了好几个隐藏的很深的bug,我就是不说........
56 楼 king_108 2008-10-29  
应该说 在 FIREFOX 下能跑的JAVASCRIPT 绝对可以在 IE上跑
55 楼 278506470 2008-10-28  
  在IE上可以运行的javascript程序,不一定在fire上可以运行,所以这也是我一直不能使用上fire的缘故,比如对xmlDom的操作(MSDOM.DOMDocument),ms提供的很多的方法,而在fire上就没有。在就是听说IE8可以调试,我不知道这是什么意思 ?
54 楼 king_108 2008-10-28  
hideto 写道
king_108 写道
hideto 写道
afcn0 写道
楼上大哥,我找了半天没找到FireDebug,请问是什么软件,提供个连接,谢谢

这位仁兄真是幽默啊,笑死我了



这个世界是由百度和GOOGLE的

笑爆了啊,麻烦知道FireDebug这个软件的告诉我一下啊



FireBug!!!

相关推荐

    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