DOM Inspector is one of the web developer tools included in Mozilla and Mozilla Firefox. As suggested by its name, its main purpose is to inspect the DOM tree of HTML and XML-based documents. Mozilla (a. ... Mozilla Firefox (originally known as Phoenix and briefly as Mozilla Firebird) is a free, cross-platform, graphical web browser developed by the Mozilla Foundation and hundreds of volunteers [1]. Before its 1. ... Document Object Model (DOM) is a form of representation of structured documents as an object-oriented model. ... In computing, HyperText Markup Language (HTML) is a markup language designed for the creation of web pages and other information viewable in a browser. ... The eXtensible Markup Language (XML) is a W3C recommendation for creating special-purpose markup languages. ...
A DOM node can be selected from the tree structure, or by clicking on the browser chrome. Besides DOM node, other views are also available, including box model, XBL bindings, CSS style rules, computed styles, and JavaScript objects. Document stylesheets and JavaScript objects can also be selected from the tree. The active element is highlighted with blinking red border, which is helpful in "debugging" CSS. A tree structure is a way of representing the hierarchical nature of a structure in a graphical form. ... Point and click describes the simple action of a computer user moving a cursor to a certain location on a screen (point) and then clicking a mouse button, usually the left one (click), or other pointing device. ... XBL or eXtensible Bindings Language is used to declare the behavior of XUL widgets. ... Cascading Style Sheets (CSS) is a computer language used to describe the presentation of a structured document written in HTML, XHTML or XML. The CSS specification is maintained by the World Wide Web Consortium (W3C). ... JavaScript, often mistyped as Javascript, is an object-oriented scripting language based on the concept of prototypes. ... Red re-directs here; for alternate uses see Red (disambiguation) Red is a color at the lowest frequencies of light discernible by the human eye. ...
Other than inspecting, editing is also possible, though not via a rich text interface.
External links
DOM Inspector (http://www.mozilla.org/projects/inspector/)
Introduction to the DOM Inspector (http://www.brownhen.com/DI.html)
Mozilla DOM inspector (http://www.clagnut.com/blog/340/)
The DOMInspector keeps track of all the windows that are open—all the DOMs that it knows about—so to access the DOM of a particular window in the DOMInspector, simply access that window as you would normally and then choose it from this dynamically updated menulist in the DOMInspector application.
When the DOMInspector loads a DOM, it populates the left pane with the structured, hierarchical view of the DOM and the right pane with information about the selected nodes, including attributes and their values and other data.
Once you have the DOM of the page or chrome you are interested in, you can use the tree view in the left pane of the DOMInspector to find and inspect aspects of that DOM you are interested in.