Equivalent to right-click 'inspect element' in iOS simulator Safari?

css safari ionic ios-simulator safari-web-inspector
Nick T picture Nick T · Oct 27, 2015 · Viewed 7.2k times · Source

When developing a web app using ionic, it is very useful to run up the program in iOS simulator with the command line

ionic run ios -l -c -s --target="iPhone-5s"

Then by selecting desktop Safari and Develop -> iOS Simulator you can bring up the Web Inspector for the app on the simulator. All well and good.

On desktop Safari, it is very useful to right-click on an element to find it in the Web Inspector. Is there a way to do this in iOS Simulator Safari ?

I end up putting a searchable string into the HTML and Ctrl-F to find it which is more cumbersome.

Answer

Jacob Beltran picture Jacob Beltran · Oct 28, 2015

There is a target button in the web inspector window that can select an element inside the iOS Simulator. Here's a screenshot:

"Select Element" button in Web Inspector

Related questions

How to remove the border highlight on an input text element

When an HTML element is 'focused' (currently selected/tabbed into), many browsers (at least Safari and Chrome) will put a blue border around it. For the layout I am working on, this is distracting and does not look right. <…

Read More
is there a css hack for safari only NOT chrome?

im trying to find a css hack for just safari NOT chrome, i know these are both webkit browsers but im having problems with div alignments in chrome and safari, each displays differently. i have been trying to use this …

Read More
How can I force WebKit to redraw/repaint to propagate style changes?

I have some trivial JavaScript to effect a style change: sel = document.getElementById('my_id'); sel.className = sel.className.replace(/item-[1-9]-selected/,'item-1-selected'); return false; This works fine with the latest versions of FF, Opera and IE, but …

Read More