Firebug中命令行栏(Commandlinie)的使用介绍和总结
Commandlinie是Firebug中总有用的一个特性。如果你有Microsoft Visual Studio的使用经验,你就会知道“Immediate Window”
和“Watch Window”的作用,我倒是想起了AutoCAD中的Commandline,通过快速的输入命令来完成操作。
Firebug中的命令行更像“Immediate Window”,你能够在任何时候检测代码中的值,firebug命令行的一个好处就是可以在”设计时“
就查看代码。另外还有一个优点就是你可以在命令行写js语句并且让他们立刻执行。
firebug commandline的详细的api可以在官方的地址中看到:http://getfirebug.com/commandline.html
下面来详细的介绍一下:
命令行的类型。firebug中有两种类型的命令行:1、单行模式;2、多行模式;
1、单行模式。单行模式是firebug的默认命令行模式,它允许我们一次输入一行代码。单行模式的优点是支持自动完成。
这个很强大的,就像在终端中一样,你还可以使用上下键来调入最近使用过的命令。
2、多行模式。多行模式是单行模式的加强版,它允许我们一次输入多行代码并且马上执行。
这两种模式都有各自的优势,大家可以根据自己的情况选择适合的模式。
Commandline API使用示例。
在使用之前,需要在提醒一下尽管这些API在运行时和DEBUG时都可以使用,但是他们在DEBUG时尤其有用,下面我们就来看看为什么。
API列表:
1、$(id);
2、$$(selector);
3、$x(path);
4、dir(object);
5、dirxml(node);
6、cd(window);
7、clear();
8、inspect(object [,tagname]);
9、key(object);
10、values(object);
11、debug(fn) & undebug(fn);
12、monitor(fn) & unmonitor(fn);
13、monitorEvents(object [, tagname]) & unmonitorEvents(object [, tagName]);
14、profile(title) & profileEnd();
1、$(id)。
使用过Prototype的同学看到这个一定很亲切。
对了,他的用法就和Prototype中的$一样,在单行模式中,命令会将选择的元素打印到console中
在多行模式中,你就完全可以像在Prototype中那样使用它了。
对于Prototype不熟悉的同学可以查看参考资料中的连接了解更多的情况。
2、$$()。
返回给定CSS选择器选中的元素数组。
关于CSS Selector(选择器),相信了解一些CSS的人都有一些印象,Jqueyr将Css Selector发扬的很光大。
我在console中试验了几个jquery中的常用写法,看来支持的还是不够好。
3、$x(xpath)。
返回给定xpath下的元素数组。
例如在一个包含多个p的div中,我们可以用下面的代码获得每个p。
var obj = $x('html/body/div/p');
console.log(obj[0].id);
console.log(obj[1].id);
console.log(obj[2].id);
4、dir(object)。
打印一个对象的所有属性,结果形式和在DOM标签中看到的一样。
其实这个用法和console.dir()是一样的。
var obj = $x('html/body/div/p');
dir(obj);
5、dirxml(note)。
打印xml或HTML元素的树形结构。打印的结果就像在HTML标签中看到的一样。
之前我们也接触过console.dirxml()的用法,这两个方法是一样的。
6、cd(window)。
cd是用来在框架布局的不同窗口间切换,不过据说还不是很完善。
7、clear()。
清除控制台的内容,就像在Javascript中使用Console.clear()一样。
8、inspect(object [,TabName])。
在最适合的标签中检测一个元素,也可以通过TabName指定需要打开的标签。
例如:
inspect($('txt1'),'html');
就会打开HTML标签,并且选中id为txt1的元素。
9、keys(boject)。
返回指定名称的对象的所有属性的名称数组。指定的名称可以是Javascript对象,也可以是HTML的DOM元素。
function Car(){
this.Model = "Old Model";
this.getManufactor = new function(){
return "Toyota";
}
}
var o = new car()
我们可以用keys(o)获得car对象的所有属性。
还可以获得HTML元素的所有属性名称,比如 keys($('txt5'));
10、values(object)。
返回对象包含的属性值的数组。
像keys一样,我们既可以用在javascript上,也可以用在html元素上。
11、debug(fn)和undebug(fn)。
在程序的开始处添加或删除断点。
12、monitor(FunctionName)和unmonitor(FunctionName)。
打开或关闭函数调用的记录。
通常,如果我们想知道一个函数是否被执行,我们会加入一个alert()或者console.log()来记录。
这实在是一个累人的工作,特别是如果编辑一个很大的script文件的时候,我们需要找到这个函数,加入alert,console.log
保存然后再运行,我们需要不断地保存、修改、运行来检查函数在那里被执行了。
有了firebug你就不再需要这么累了,你只需要知道这个函数,然后你就可以跟踪它,只要他被执行了,执行情况就会打印在
console窗口中。另外,console还会提供一个指向这个函数的连接。
使用方法 monitor(func1); 找到问题的原因后,我们还可以通过 unmonitor(func1)里解除对于函数的追踪。
13、monitorEvent(object [,types])和 unmonitorEvent(object [,types])。
打开或关闭对于对象动作的记录。
types表示的我们要追踪的事件类型,最常用的就是'mouse'和'key'
完整的参数类型包括:“composition”, “contextmenu”, “drag”, “focus”, “form”,
“key”, “load”, “mouse”, “mutation”, “paint”, “scroll”, “text”, “ui”, and
“xul”
不过不幸的是,这个API工作地不是很好,希望作者能够在后继的版本中完善一下。
14、profile([title])和profileEnd([title])
对于这个命令,我想看过上一篇的同学应该比较熟悉。这个就和console.profile()是一样的,用来记录页面中js的执行情况
并在结束后给出分析报告。
最后,希望每一位使用firebug来开发的同学,能够提高自己的开发效率。
[参考资料]
1、firebug commandline http://michaelsync.net/2007/09/15/firebug-tutorial-commandline-api
2、prototype http://www.prototypejs.org/
【转自】:http://www.cnblogs.com/cocowool/archive/2009/05/23/1487569.html
Firebug中命令行栏(Commandlinie)的使用介绍和总结的更多相关文章
- 【转】WriteMessage的信息在AutoCAD中命令行中实时显示
之前程序中有段发送信息到命令行上显示的代码,如下: ed.WriteMessage("开始标注横断面高程,请稍候!"); 但是发现命令行中并不马上显示,代码也明明运 ...
- SQLite中命令行程序(CLP)的使用
SQLite CLP是使用和管理SQLite数据库最常用的工具.它在所有平台上的操作方式相同.CLP其实是两个程序,它可以运行在Shell模式下以交互的方式执行查询操作,也可以运行在命令行模式下完成各 ...
- Linux中命令行编译java接口总是提示找不到符号的疑难杂症的解决
今天学习java的接口,在linux的命令行下写代码练练手吧,啪啪啪一顿猛敲,写了一个接口UsbInserface,UDisk继承UsbInterface,写完了那就编译到bin目录呗. 当时写程序的 ...
- django中命令行调试程序
(1)进入到程序manage.py所在的目录下 (2)python manage.py shell 这样可在命令行中引入models.views.class等所有的包,然后进行命令行试运行.
- Perl中命令行参数以及打开管道文件
打开管道文件 Linux提供了管道机制,可以方便应用程序之间的数据传递.在Perl中,扣开和使用管道可采用如下形式的open函数: open(Filehandle,”丨 CMD”); 其中 ...
- Linux中命令行终端切换工具screen
screen命令 本文转自:http://man.linuxde.net/screen Screen是一款由GNU计划开发的用于命令行终端切换的自由软件.用户可以通过该软件同时连接多个本地或远程的命令 ...
- nodejs中命令行中参数的获取和解析
首先,假设有如下的命令行 node abc.js arg1 arg2 arg3,现在想在abc.js中获取后面的参数arg1.arg2.arg3… var args = process.argv.s ...
- python中命令行参数
python中的命令行参数 python中有一个模块sys,sys.argv这个属性提供了对命令行参数的访问.命令行参数是调用某个程序时除程序名外的其他参数. sys.argv是命令行参数的列表 le ...
- windows中命令行窗口提权到管理员权限.windows 的 sudo
命令行环境中获取管理员权限 第一种方法 (最爽,但是被运行的命令会被当成新进程运行,运行完成后就自动关闭了.) 把以下代码复制到记事本中保存为sudo.vbs 然后移动到PATH任意目录中,如wind ...
随机推荐
- openstack libtray
OpenStack packages¶ Distributions release OpenStack packages as part of the distribution or using ot ...
- 8-10-Exercise
链接:第三次练习 A.ZOJ 3203 Light Bulb 这道题............哎~既可以用数学直接推导出来,也可以三分求,还可以二分求~~~~ NO1.数学公式 这种方法搞的不是很清楚 ...
- Log接口的重新封装
闲来没事,看见当前的项目的日志形式有点冗余,每个类都需要声明确实有点繁琐, 因此重新将logback重新封装一下,供整个工程共享使用,版本是1.0.9. 代码如下: import java.lang. ...
- Eclipse的安装以及与Tomcat的集成
1.下载indgo版本的Eclipse:http://www.eclipse.org(64位:eclipse-jee-indigo-SR2-win32-x86_64.zip) 2.解压到D:\Prog ...
- EL表达式及其定义和使用 转
作者:http://blog.csdn.net/goskalrie/article/details/51315397 简介 EL(Expression Language)表达式语言实在JSP2.0版本 ...
- 【硬件】DELLserver硬件监控及DELL系统管理工具OMSA介绍
1.1.1. DELLserver硬件监控及DELL系统管理工具OMSA介绍 本文介绍採用使用Nagios和OMSA监控DELLserver的硬件健康状态,Nagios监控的方式是NRPE模式,须要配 ...
- soap实例入门(转)
SOAP的HelloWord实例- - 1.1 前言 2005-3-2公司开会并分给我一个任务:写一个程序从福建移动的BOSS系统取出一些相关数据.我得到的资料仅仅有一个“福建移动BOSS与业务增值 ...
- careercup-链表 2.4
2.4 编写代码,以给定值x为基准将链表分割成两部分,所有小于x的结点排在大于或等于x的结点之前. 思路:将小于的结点还是保存在原来的链表中,将大于等于x的结点加入一个新的链表,最后将这两个链表链接起 ...
- android开发之自定义AutoCompleteTextView
AutoCompleteTextView,很多人都用过,有些情况下使用Google提供的ArrayAdapter作为适配器就可以完成需求,但是在实际开发中,我们经常需要开发自定义适配器来完成开发工作. ...
- 在KALI LINUX中安装JAVA JDK
1. 下载最新的JAVA JDK jdk-8u91-linux-x64 2. 解压缩文件并移动至/opt tar -xzvf jdk-8u91-linux-x64.tar.gz mv jdk1.8.0 ...