Cargando…
Firebug 1.5 : editing, debugging, and monitoring web pages /
"This book discusses how to become more efficient in various aspects of web development by using Firebug. It is a very easy-to-understand, step-by-step guide that explains all the features of Firebug with concise and simple examples. With this book in hand, you will be able to deal with the pai...
| Clasificación: | Libro Electrónico |
|---|---|
| Autor principal: | |
| Otros Autores: | |
| Formato: | Electrónico eBook |
| Idioma: | Inglés |
| Publicado: |
Birmingham, U.K. :
Packt Pub.,
©2010.
|
| Colección: | From technologies to solutions.
|
| Temas: | |
| Acceso en línea: | Texto completo |
Tabla de Contenidos:
- Machine generated contents note: What is Firebug?
- The history of Firebug
- The need for Firebug
- Firebug capabilities
- Installing Firebug on different browsers
- Installing Firebug on Firefox
- Installing Firebug on non-Firefox browsers
- Opening and closing Firebug
- Firebug modes
- Dock view
- Window mode
- Summary
- Console tab
- Command line JavaScript
- Errors and warnings
- Status bar error indicator
- Errors can be descriptive and informative
- Executing JavaScript commands
- HTML tab
- The hierarchy of DOM nodes (the HTML source. panel)
- Options for HTML source panel
- Editing HTML on the fly
- Editing an existing attribute of HTML element
- Editing an HTML element
- Logging events
- CSS tab
- CSS inspector
- List of CSS files
- Modifying CSS
- Script tab
- DOM tab
- Net tab
- Summary
- Viewing source live
- Seeing changes highlighted`
- Modifying the source on the fly
- How to modify the value of an HTML attribute
- Note continued: How to add a new attribute to an existing HTML element
- How to delete an HTML element
- How to modify the source for an HTML element
- Inspecting page components, editing, and reloading
- Searching within an HTML document
- Finding an HTML element on the page
- Copying HTML source for an HTML element
- Setting breakpoints on HTML element
- Summary
- Inspecting cascading rules
- Preview colors and images
- Tweaking CSS on the fly
- Enabling and disabling specific CSS rules
- Inspecting our stylesheet
- Modifying CSS from Firebug's UI
- Inspecting and tweaking the box model
- Searching under the CSS tab
- Summary
- The command line API
- $(id)
- $ $$(selector)
- $x(xpath)
- dir(object)
- dirxml(node)
- clear()
- inspect(object[, tabName])
- keys(object)
- values(object)
- debug(fn) and undebug(fn)
- monitor(functionName) and unmonitor(functionName)
- monitorEvents(object[, types])
- unmonitorEvents(object[, types])
- Note continued: profile([title]) and profileEnd()
- Columns and description of the profiler
- The console API
- console.log(object[, object, ...])
- console.debug(object[, object, ...])
- console.info(object[, object, ...])
- console.warn(object[, object, ...])
- console.error(object[, object, ...])
- console.assert(expression[, object, ...])
- console.dir(object)
- console.dirxml(node)
- console.trace()
- console.group(object[, object, ...])
- console.groupCollapsed(object[, object, ...])
- console.groupEnd()
- console.time(name)
- console.timeEnd(name)
- console.profile([title])
- console. profileEnd()
- console.countatitlep
- JavaScript debugging
- Steps to debug JavaScript code with Firebug
- Conditional breakpoints
- Summary
- Inspecting DOM
- Filtering properties, functions, and constants
- Modifying DOM on the fly
- Auto-complete
- Losing the starting element
- Adding/removing the DOM elements' attributes
- Removing attributes
- Note continued: Adding attributes
- JavaScript code navigation
- Summary
- Networkponitoring
- Description of information in the Net panel
- Load-time bar color significance
- Browser queue wait time
- Breaking down various requests by type
- Examining HTTP headers
- Analyzing the browser cache
- XMLHttpRequest monitoring
- How to find out the download speed for a resource
- Firebug extensions for analyzing performance
- Summary
- Tracking XmlHttpRequest
- Request/response headers and parameters
- GET/POST request
- Viewing live modifications on DOM
- Debugging AJAX calls using properties of a console object
- console.debug(object[, object, ...])
- console.assert(expression[, object, ...])
- console.dir(object)
- Summary
- Magical cd()
- The hierarchical console
- Configuring Firebug to our taste
- Summary
- YSlow
- Firecookie
- Pixel Perfect
- Pixel Perfect options menu
- Firefinder
- FireQuery
- CodeBurner
- SenSEO
- Page Speed
- Note continued: Summary
- Setting up an extension development environment
- Setting up the development profile
- Development preferences
- Getting started with a small "Hello World!" extension of Firebug
- The chrome.manifest file
- The install.rdf file
- The helloWorldOverlay.xul file
- The helloWorld.js file
- Packaging and installation
- Taking "Hello World!" to the next level
- The "prefs.js" file
- The "helloWorld.js" file revisited
- Summary
- Keyboard and mouse shortcuts reference
- Global shortcuts
- HTML tab shortcuts
- HTML editor shortcuts
- HTML inspect mode shortcuts
- Script tab shortcuts
- DOM tab shortcuts
- DOM and watch editor shortcuts
- CSS tab shortcuts
- CSS editor tab shortcuts
- Layout tab shortcuts
- Layout editor shortcuts
- Command line (small) shortcuts
- Command line (large) shortcuts
- Console API reference
- Command line API reference
- Firebug online resources
- Note continued: Features expected in future releases of Firebug
- Firebug 1.6
- Some improvements in this version
- Firebug 1.7
- Separate modules and panels
- Components replaced by SharedObjects
- Recode TabWatcher/DOMWindowWatcher
- Sandboxed extension loading
- Memory panel.