Get Element XPath of Selected Element Of IFrame using Jquery

This blog describes how to get Element XPath of selected element of IFrame using Jquery.

XPath

 

This a query language that can be used to select arbitrary parts of HTML documents in ability.

XPath is a language that describes a way to locate and process items in HTML And XML documents by using an addressing syntax based on a path through the document's logical structure or hierarchy.

 

Get XPath of Selected Element Of IFrame Using Jquery

If you want to get element`s XPath of selected element of Iframe and also add highlight css in element on mouseover , out and click event.

1. Create Project
2. Add an Iframe page
   
   a. Add required contents & element
   b. Add reference of “Highlight” css file under the page head.
   
   
3. Add Iframe parent page

a. Add Iframe

b. Add required content and element.

c. Add jquery-1.4.1.js or latest js file under head section

d. Create Jquery code and function for this functionality.

e. Add document.ready function.

f. Create function get element`s XPath.

Highlight CSS (highlight.css)

 

 

IFrame Page(Iframe.htm)

Main Page (Parent Page-Index)

Jquery Code 

Sample Screenshots
Highlight-on-mouseover


Get XPath On Click In Alert()