Latest Version:
1.2.1 (2008-09 CHANGELOG
)
<!-- Installing Firebug Lite -->
Installing Firebug Lite 1.2
Insert this line of code into any page that you want to contain Firebug lite:
<script type='text/javascript'
src='http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js'></script>
<!-- Firebug lite as bookmarklet -->
Firebug Lite as bookmarklet
Drag the following link to your bookmark toolbar and use Firebug Lite on any page:
Firebug Lite
javascript:var firebug=document.createElement('script');firebug.setAttribute('src','http://getfirebug.com/releases/lite/1.2/firebug-lite-compressed.js');document.body.appendChild(firebug);(function(){if(window.firebug.version){firebug.init();}else{setTimeout(arguments.callee);}})();void(firebug);
Configuring Firebug Lite
Height of the firebug lite form is resizeable in latest version;
<script type="text/javascript">
firebug.env.height = 500;
</script>
Also, developers can use their own css file;
<script type="text/javascript">
firebug.env.css = "/myown/firebug.css"
</script>
<!-- Using Firebug Lite Offline -->
Using Firebug Lite Offline
Download the source
Import firebug-lite-compressed.js
or firebug-lite.js
into your site's directory. Find "firebug-lite.css" URL on the javascript file which you imported and replace this with offline address of firebug-lite.css file.
<script language="javascript" type="text/javascript"
src="/path/to/firebug/firebug-lite.js"></script>
<!-- Commands -->
Commands
Now FBLite supports all basic commands
of Firebug.
firebug.watchXHR: Use this function to watch the status of XmlHttpRequest objects.
var req = new XmlHttpRequest;
firebug.watchXHR(req);
firebug.inspect: Now elements can be inspected in javascript code:
firebug.inspect(document.body.firstChild);
On some browsers, the console object is already declared. If you observe errors in Safari, for instance, use the console commands in this fashion:
firebug.d.console.cmd.log("test");
firebug.d.console.cmd.dir([ "test" ]);
<!-- Notes -->
Notes
On some browsers, the console object is already declared. If you observe errors in Safari, for instance, use the console commands in this fashion:
firebug.d.console.cmd.log("test");
firebug.d.console.cmd.dir([ "test" ]);
Firebug Lite creates the variables "firebug" and doesn't affect or interfere HTML elements that aren't create by itself.
Console API:
Firebug adds a global variable named "console" to all web pages
loaded in Firefox. This object contains many methods that allow you to
write to the Firebug console to expose information that is flowing
through your scripts.
console.log(object[, object, ...])
Writes
a message to the console. You may pass as many arguments as you'd like,
and they will be joined together in a space-delimited line.
The first argument to log
may be a string containing printf-like string substitution patterns. For example:
console.log("The %s jumped over %d tall buildings", animal, count);
The example above can be re-written without string substitution to achieve the same result:
console.log("The", animal, "jumped over", count, "tall buildings");
These
two techniques can be combined. If you use string substitution but
provide more arguments than there are substitution patterns, the
remaining arguments will be appended in a space-delimited line, like so:
console.log("I am %s and I have:", myName, thing1, thing2, thing3);
If
objects are logged, they will be written not as static text, but as
interactive hyperlinks that can be clicked to inspect the object in
Firebug's HTML, CSS, Script, or DOM tabs. You may also use the %o
pattern to substitute a hyperlink in a string.
Here is the complete set of patterns that you may use for string substitution:
String Substitution Patterns |
%s |
String |
%d, %i |
Integer (numeric formatting is not yet supported) |
%f |
Floating point number (numeric formatting is not yet supported) |
%o |
Object hyperlink |
console.debug(object[, object, ...])
Writes a message to the console, including a hyperlink to the line where it was called.
console.info(object[, object, ...])
Writes a message to the console with the visual "info" icon and color coding and a hyperlink to the line where it was called.
console.warn(object[, object, ...])
Writes a message to the console with the visual "warning" icon and color coding and a hyperlink to the line where it was called.
console.error(object[, object, ...])
Writes a message to the console with the visual "error" icon and color coding and a hyperlink to the line where it was called.
console.assert(expression[, object, ...])
Tests that an expression is true. If not, it will write a message to the console and throw an exception.
console.dir(object)
Prints
an interactive listing of all properties of the object. This looks
identical to the view that you would see in the DOM tab.
console.dirxml(node)
Prints
the XML source tree of an HTML or XML element. This looks identical to
the view that you would see in the HTML tab. You can click on any node
to inspect it in the HTML tab.
console.trace()
Prints an interactive stack trace of JavaScript execution at the point where it is called.
The
stack trace details the functions on the stack, as well as the values
that were passed as arguments to each function. You can click each
function to take you to its source in the Script tab, and click each
argument value to inspect it in the DOM or HTML tabs.
console.group(object[, object, ...])
Writes a message to the console and opens a nested block to indent all future messages sent to the console. Call console.groupEnd()
to close the block.
console.groupCollapsed(object[, object, ...])
Like console.group()
, but the block is initially collapsed.
console.groupEnd()
Closes the most recently opened block created by a call to console.group()
or console.groupEnd()
console.time(name)
Creates a new timer under the given name. Call console.timeEnd(name)
with the same name to stop the timer and print the time elapsed..
console.timeEnd(name)
Stops a timer created by a call to console.time(name)
and writes the time elapsed.
console.profile([title])
Turns on the JavaScript profiler. The optional argument title
would contain the text to be printed in the header of the profile report.
console.profileEnd()
Turns off the JavaScript profiler and prints its report.
console.count([title])
Writes the number of times that the line of code where count
was called was executed. The optional argument title
will print a message in addition to the number of the count.
Command Line API
The Firebug command line provides these special functions for your convenience:
$(id)
Returns a single element with the given id.
$$(selector)
Returns an array of elements that match the given CSS selector.
$x(xpath)
Returns an array of elements that match the given XPath expression.
dir(object)
Prints
an interactive listing of all properties of the object. This looks
identical to the view that you would see in the DOM tab.
dirxml(node)
Prints
the XML source tree of an HTML or XML element. This looks identical to
the view that you would see in the HTML tab. You can click on any node
to inspect it in the HTML tab.
cd(window)
By
default, command line expressions are relative to the top-level window
of the page. cd() allows you to use the window of a frame in the page
instead.
clear()
Clears the console.
inspect(object[, tabName])
Inspects an object in the most suitable tab, or the tab identified by the optional argument tabName
.
The available tab names are "html", "css", "script", and "dom".
keys(object)
Returns an array containing the names of all properties of the object.
values(object)
Returns an array containing the values of all properties of the object.
debug(fn)
Adds a breakpoint on the first line of a function.
undebug(fn)
Removes the breakpoint on the first line of a function.
monitor(fn)
Turns on logging for all calls to a function.
unmonitor(fn)
Turns off logging for all calls to a function.
monitorEvents(object[, types])
Turns on logging for all events dispatched to an object. The optional argument types
may specify a specific family of events to log. The most commonly used values for types
are "mouse" and "key".
The
full list of available types includes "composition", "contextmenu",
"drag", "focus", "form", "key", "load", "mouse", "mutation", "paint",
"scroll", "text", "ui", and "xul".
unmonitorEvents(object[, types])
Turns off logging for all events dispatched to an object.
profile([title])
Turns on the JavaScript profiler. The optional argument title
would contain the text to be printed in the header of the profile report.
profileEnd()
Turns off the JavaScript profiler and prints its report.
分享到:
相关推荐
firebug-lite 可在IE等浏览器中使用 firebug-lite 可在IE等浏览器中使用 firebug-lite 可在IE等浏览器中使用 firebug-lite 可在IE等浏览器中使用
firebug-lite.js firebug-lite.min.js下载
Firebug-Lite-for-Google-Chrome™_v1.4.0.11967.crx,谷歌浏览器!
firebug源代码包含,嘿嘿 博文链接:https://xinlingwuyu.iteye.com/blog/219796
FirebugLiteLoader Firebug Lite 的 jQuery 加载器 安装 curlthis firebug-lite-loader
Firebug Lite for Google Chrome
firebug lite - 谷歌Chrome的流行Firebug港口。 *注意:这是Firebug Lite的叉子,因为较新的Chrome版本不支持原始版本**如果您之前没有使用此扩展,则只能使用您可能需要的_think_ - 您最可能与Chrome DevTools更...
NULL 博文链接:https://sch.iteye.com/blog/1424003
花了一天时间制作的theworld插件,终于可以在theworld中使用firebug了 使用方法,解压后直接拷贝到theworld安装目录下的plugin目录下即可
Firebug Lite是Firebug的一个子集。值得关注的是Firebug Lite支持IE、Opera和Safari这三款主流浏览器。 Firebug是 站长和博主的必备网络工具。它能对HTML页面的代码进行分析,并能对网页式样元素提供实时预览。另外...
针对Web开发人员的工具,专用于基于Firebug Lite(测试版)的Chrome和Opera浏览器。 它是SourceForge上的免费开放源代码插件。 主要功能:-与Firebug相同的外观-实时检查HTML并修改样式-具有自动完成代码(tab,...
谷歌浏览器用于firebug工具 firebuglite for chrome 谷歌浏览器用于firebug工具 firebuglite for chrome
firebugLite,可以for ie r firebug
好用的javascript编辑调试器,可以自动补齐javascript代码。
IE6调试神器,免安装,FirebugLite压缩包 详见:http://blog.csdn.net/konw_nothing/article/details/8903162
ng new --collection @ng-toolkit/init myApp [--provider --firebaseProject --gaTrackingCode --firebug] PWA-@ angular / pwa扩展 向您的PWA添加更新机制和服务器端呈现修复程序 ng add @ng-toolkit/pwa [--...
首先,我们会介绍一个叫做Firebug Lite的浏览器扩展,用于检查网页内容,如果你有一些网络开发背景的话,可能己经对该扩展十分熟悉了。然后,我们会介绍三种抽取网页数据的方法,分别是正则表达式、Beautiful Soup和...
从Firebug Lite chrome扩展中无耻复制XPath代码:http://getfirebug.com/firebuglite#Debug我的Chrome扩展开发得到了这个工具的大力帮助:https://github.com/Rob--W/Chrome-Extension- Reloader 支持语言:English