Often for the purpose of scraping, one needs to find certain elements’ XPath on a webpage. How can one do that with browser Web developer tools, aka Web inspector? A picture is worth of thousand words.

find_xpath_web_dev_tools

 

In the Chrome browser web dev. tools (F12) you execute the following steps:

  1. Choose Elements tab
  2. Press Element Selector button
  3. With that button pressed you click an element in the main browser window.
  4. In the DOM-elements window you right-click that highlighted element.
  5. The context menu appears, and you choose Copy.
  6. Choose Copy XPath in a sub menu. Now you have that element’s XPath in a console buffer.

Attention!

The browser composes an element’s XPath based on its own algorithm. It might not be the way you think or the way that fits to your code. So, you have to understand XPath in nature, be acquainted with it.

Note what xpath the Chrome browser has issued for Trailing P/E element at a Yahoo finance page:

//*[@id=”main-0-Quote-Proxy”]/section/div2/section/div/section/div2/div1/div1/div/table/tbody/tr[3]/td1/span