*NOTE: You will need to upgrade to Safari version 6.0 to enable this functionality. *
With the recent release of iOS6, Apple has finally introduced a remote web inspector for debugging web applications on iOS devices. Enabling it is simple, but it’s buried under a few options on your phone.
On your device, head to Settings > Safari > Advanced
You’ll find the Web Inspector toggle there.
Once enabled, you’ll need to physically connect your iPhone or iPad to your Mac. Yes, this is Mac only at this point. In Safari’s Preferences pane under Advanced, check the Show Develop menu in the menu bar checkbox.
Select the Develop menu, and your iDevice should be a menu option. You should now be able to inspect DOM elements, modify CSS on the fly, and run Javascript commands.
As a side note, this procedure will also enable remote debugging of your PhoneGap (Cordova) and other UIWebView based projects.
Do you need professional help with developing hybrid HTML5 mobile applications?
