HOW TO: Get Firebug For iPhone and iPad

Firebug is one of the most popular and powerful web development tools, and puts a wealth of web development tools at your fingertips while you browse. You can edit, debug, and monitor CSS, HTML, and JavaScript live in any web page. So far it was available as an add-on/plugin for all the major browsers, and today we’re going to show you how to get Firebug for your iPhone and iPad.

1. Browse to any webpage and save it as a bookmark ( i.e funkyspacemonkey.com )

2. Rename the bookmark to ‘Firebug’

3. Copy the following code to your clipboard

javascript:(function(F,i,r,e,b,u,g,L,I,T,E){if(F.getElementById(b))return;E=F[i+’NS’]&&F.documentElement.namespaceURI;E=E?F[i+’NS’](E,’script’):F[i](‘script’);E[r](‘id’,b);E[r](‘src’,I+g+T);E[r](b,u);(F[e](‘head’)[0]||F[e](‘body’)[0]).appendChild(E);E=new%20Image;E[r](‘src’,I+L);})(document,’createElement’,’setAttribute’,’getElementsByTagName’,’FirebugLite’,’4′,’firebug-lite.js’,’releases/lite/latest/skin/xp/sprite.png’,’https://getfirebug.com/’,’#startOpened’);

4. Edit the Firebug bookmarklet, remove the URL and paste the bookmarklet

5. Choose “Done” (on the virtual keyboard) and you’re all set

6. Now whenever you’re on a page, hitting that bookmark should fire up the Firebug console at the bottom of your iPhone/iPad’s screen.

[via]