This alone will make many page designers become fans of Firebug desperately.
#Firefox firebug java script debugger code
You can also modify the HTML source code directly in the HTML viewer, and see the modified effect in the browser for the first time. When used with Firebug’s built-in CSS viewer, it will give a div+css page Analysis and writing bring great benefits. As shown in Figure 3, it clearly lists the parent, child, and root elements of a hml element. The DOM level is also marked at the top of the source code.
The tag folding function can help you focus on analyzing the code. You can easily distinguish the subordination and parallel relationship between each tag. The first thing you see is the formatted HTML code. Compared with the HTML viewer that comes with Firefox, it has a lot of powerful functions. The first time I saw Firebug's powerful HTML code viewer, I felt that it was unique.
Due to space limitations, we will not elaborate here, but readers who are interested in improving debug efficiency can go to Check out more detailed tutorials on Firebug's official site (see appendix).įigure 2: Debug javascript in the console Compared with monotonous alert, it is obviously more convenient. console.log ( 2 , 4 , 6 , 8 , "foo" ,bar ) .įirebug's log output has a variety of optional formats and syntax, and even color output can be customized.The simplest syntax for printing logs is like this of: In the past, you may be used to using alert to print variables, but Firebug has brought us a new friend-console.log. Even a large section of javascript programs can run correctly and get runtime information.Īnother important function of the console is to view the log of the script. Like the C shell or Python shell, you can also view the contents of variables in the console and run javascript statements directly. The program that originally seemed to be operating in a black box behind the scenes is clearly understood. You can see the parameters, URL, http header and feedback content of each XMLHttpRequests request post in the console. And it is especially useful when debugging Ajax applications. These error prompts are more detailed and have reference value than the error prompts provided by the browser itself. The console can display javascript errors and warnings in the current page, and prompt the wrong file and line number, which is convenient for debugging. The following will mainly introduce the functions of these aspects. It will divide the current page into two upper and lower frames, as shown in Figure 1.įigure 1: Firebug plug-in expansion diagramĪs you can see from Figure 1, Firebug has 6 main Tab buttons.
If you are worried that it will take up too much system resources, you can easily enable/disable this plugin, or even enable this plugin for a specific site.Īfter installing the plug-in, first use the Firefox browser to open the page to be tested, and then click the green button at the bottom right or use the shortcut key F12 to call up the Firebug plug-in. applicationĪlthough the Firebug plug-in is powerful, it has been seamlessly integrated with the Firefox browser and is simple and intuitive to use. When the author is writing this article, it coincides with the release of the official version of Firebug 1.0, which is a coincidence. If you haven't touched it before, you may want to give it a try after reading this article. This is a plug-in that makes people love it. Firebug is like an exquisite Swiss army knife, analyzing the internal details of web pages from different angles, bringing great convenience to web developers. It is a powerful assistant for developing JavaScript, CSS, HTML and Ajax. It integrates HTML viewing and editing, Javascript console, and network status monitor.
#Firefox firebug java script debugger torrent
In order to help developers who are in the torrent of Web2.0, here is a light and flexible auxiliary development tool.įirebug is a development plug-in under Firefox, which is now one of the five-star highly recommended plug-ins for Firefox. A good WEB developer needs to take into account more aspects in order to hand over an equally good job. To write beautiful HTML code to write exquisite CSS style sheets to display each page module to debug javascript to add some more lively elements to the page to use Ajax to bring a better user experience. After several years of web development work, I feel more and more that now there are higher requirements for web development.
0 kommentar(er)
