HomeApplication

How to Find XPath Using Firebug

You can find XPath information for website elements using most browsers' developer tools. Firebug for Firefox allows you to copy XPath information directly to your clipboard. For most other browsers, you can find the XPath information for...
Method 1 of 4:

Using Firefox and Firebug

  1. How to Find XPath Using Firebug Picture 1How to Find XPath Using Firebug Picture 1
    Install Firebug for Firefox. Firebug is a web inspector add-on for Firefox.
    1. Click the Firefox Menu button (☰) and select "Add-ons."
    2. Click "Get Add-ons" and then click the "Get more add-ons!" button.
    3. Search for "Firebug" and then click the "Add to Firefox" button next to it.
    4. Confirm that you want to install Firebug and then restart Firefox when prompted.
  2. How to Find XPath Using Firebug Picture 2How to Find XPath Using Firebug Picture 2
    Open the website that you want to inspect. You can use Firebug to inspect any element on a website to find the XPath.
  3. How to Find XPath Using Firebug Picture 3How to Find XPath Using Firebug Picture 3
    Click the Firebug button. You'll find this in the upper-right corner of the window. This will open the Firebug panel at the bottom of the Firefox window.
  4. How to Find XPath Using Firebug Picture 4How to Find XPath Using Firebug Picture 4
    Click the element inspector button. You'll find this in the top row of buttons in the Firebug panel at the bottom of the window, directly to the right of the Firebug Options button. It looks like a box with a mouse cursor pointing at it.
  5. How to Find XPath Using Firebug Picture 5How to Find XPath Using Firebug Picture 5
    Click the web page element that you want to inspect. As you move your cursor over the web page, you'll see different elements get highlighted. Click the one that you want to find the XPath for.
  6. How to Find XPath Using Firebug Picture 6How to Find XPath Using Firebug Picture 6
    Right-click the highlighted code in the Firebug panel. When you click an element in a web page, it's related code will be highlighted in the Firebug panel at the bottom of the window. Right-click this highlighted code.
  7. How to Find XPath Using Firebug Picture 7How to Find XPath Using Firebug Picture 7
    Select "Copy XPath" from the menu. This will copy the element's XPath information to your clipboard.
    1. If you select "Copy Minimal XPath," just the basic XPath information will be copied.
  8. How to Find XPath Using Firebug Picture 8How to Find XPath Using Firebug Picture 8
    Paste the copied XPath information elsewhere. Once the code is copied, you can simply paste it anywhere else you need by right-clicking and selecting "Paste."
Method 2 of 4:

Using Chrome

  1. How to Find XPath Using Firebug Picture 9How to Find XPath Using Firebug Picture 9
    Open the website you want to inspect in Chrome. You don't need any extensions installed to be able to find the XPath information of website elements when you're using Chrome.
  2. How to Find XPath Using Firebug Picture 10How to Find XPath Using Firebug Picture 10
    Press .F12 to open the website inspector. This will appear on the right side of the window.
  3. How to Find XPath Using Firebug Picture 11How to Find XPath Using Firebug Picture 11
    Click the element inspector button. You'll find this in the top-left corner of the website inspector panel. The button looks like a box with a mouse cursor pointing at it.
  4. How to Find XPath Using Firebug Picture 12How to Find XPath Using Firebug Picture 12
    Click the element on the website that you want to inspect. You'll see the elements of the site highlight as you move your cursor over them.
  5. How to Find XPath Using Firebug Picture 13How to Find XPath Using Firebug Picture 13
    Right-click the highlighted code in the inspector panel. When you click an element with the inspector, the relevant code will highlight automatically in the inspector panel on the right side of the window. Right-click the highlighted code.
  6. How to Find XPath Using Firebug Picture 14How to Find XPath Using Firebug Picture 14
    Select "Copy" → "Copy XPath." This will copy the element's XPath information to your clipboard.
    1. Note that this just copies the minimal XPath information. Firebug for Firefox can give you the full XPath information.
  7. How to Find XPath Using Firebug Picture 15How to Find XPath Using Firebug Picture 15
    Paste the copied XPath information. You can paste your copied XPath information like you would any copied information by right-clicking in a text field and selecting "Paste."
Method 3 of 4:

Using Safari

  1. How to Find XPath Using Firebug Picture 16How to Find XPath Using Firebug Picture 16
    Click the Safari menu and select "Preferences." You'll need to enable the Develop menu in order to access the Web Inspector utility.
  2. How to Find XPath Using Firebug Picture 17How to Find XPath Using Firebug Picture 17
    Click the "Advanced" tab. This will display advanced Safari settings.
  3. How to Find XPath Using Firebug Picture 18How to Find XPath Using Firebug Picture 18
    Check the "Show Develop menu in menu bar" box. The Develop menu will appear immediately in the menu bar.
  4. How to Find XPath Using Firebug Picture 19How to Find XPath Using Firebug Picture 19
    Open the website you want to inspect. Close the Preferences menu and visit the website that contains the element that you want to the get XPath for.
  5. How to Find XPath Using Firebug Picture 20How to Find XPath Using Firebug Picture 20
    Click the Develop menu and select "Show Web Inspector." The Web Inspector panel will appear at the bottom of the window.
  6. How to Find XPath Using Firebug Picture 21How to Find XPath Using Firebug Picture 21
    Click the "Start element selection" button. It looks like a crosshair, can can be found in the top row of buttons in the Web Inspector panel.
  7. How to Find XPath Using Firebug Picture 22How to Find XPath Using Firebug Picture 22
    Click the element on the website that you want to inspect. This will highlight the code for that element in the Web Inspector panel at the bottom of the window.
  8. How to Find XPath Using Firebug Picture 23How to Find XPath Using Firebug Picture 23
    Note the XPath information at the top of the tree. You can't directly copy the XPath, but you can see the full path laid out above the code displayed in the Web Inspector. Each tab is a path expression.[1]
Method 4 of 4:

Using Internet Explorer

  1. How to Find XPath Using Firebug Picture 24How to Find XPath Using Firebug Picture 24
    Open the website you want to inspect in Internet Explorer. You don't need to install anything to find the XPath in Internet Explorer. Open the website that contains the element you want to inspect.
  2. How to Find XPath Using Firebug Picture 25How to Find XPath Using Firebug Picture 25
    Press F12 to open the developer tools. The developer tools panel will appear at the bottom of the window.
  3. How to Find XPath Using Firebug Picture 26How to Find XPath Using Firebug Picture 26
    Click the "Select element" button. You'll find this in the upper-left corner of the developer tools panel.
  4. How to Find XPath Using Firebug Picture 27How to Find XPath Using Firebug Picture 27
    Click the element on the web page that you want to inspect. This will select it and highlight the code for it in the DOM Explorer.
  5. How to Find XPath Using Firebug Picture 28How to Find XPath Using Firebug Picture 28
    Note the XPath information at the bottom of the panel. Each of the tabs along the bottom of the panel is an XPath expression for the element you have selected. You cannot copy it in XPath format like you can in Firefox with Firebug.
4 ★ | 1 Vote
clickelement

You should read it

May be interested

Application