Examine webpage elements and activity
Use the Develop menu and Web Inspector to monitor webpage activity and examine the elements of a webpage.
In Safari, with the webpage you want to examine open, choose Develop, then choose an option, or choose Develop > Show Web Inspector, then click a tab.
If you don’t see the Develop menu in the menu bar, choose Safari > Preferences, click Advanced, then select “Show Develop menu in menu bar.”
Web Inspector tabs:
Elements: Navigate and inspect the DOM of the webpage.
To examine a specific webpage element, you can also Control-click it, then choose Inspect Element from the shortcut menu.
Network: See details for webpage resource requests and API requests that include documents, scripts, images, and XHRs.
Resources: View detailed data about webpage resources, including documents, scripts, and images.
Storage: Inspect any persistent data stored by the webpage, including cookies, DOM storage, Web SQL databases, IndexedDB, and application cache resources.
Console: Inspect and debug your webpages.
If you don’t see one of the tabs, click the New Tab button , then click the feature you want. At any time, you can close a tab by placing the pointer over the tab in the tab bar, then clicking the Close icon .