I am trying to retrieve the CSS selectors for a specific HTML element in jQuery. For that reason I have the following code:
$(window).hover(function(e)
{
var x = e.clientX, y = e.clientY,
focusElement = document.elementFromPoint(x, y);
// GetPath.js
getPath: function( path )
{
// The first time this function is called, path won't be defined.
if ( typeof path == 'undefined' ) path = '';
// If this element is <html> we've reached the end of the path.
if ( this.is('html') )
return 'html' + path;
// Add the element name.
var cur = this.get(0).nodeName.toLowerCase();
// Determine the IDs and path.
var ID = this.attr('id'),
CLASS = this.attr('class');
// Add the #id if there is one.
if ( typeof ID != 'undefined' )
cur += '#' + ID;
// Add any classes.
if ( typeof CLASS != 'undefined' )
cur += '.' + CLASS.split(/[\s\n]+/).join('.');
// Recurse up the DOM.
return this.parent().getPath( ' > ' + cur + path );
}
$(focusElement).click(function(e)
{
e.preventDefault();
var path = $(focusElement).getPath();
$("#some", window.parent.document).text(path);
});
});
However in any case I always get an error "Uncaught TypeError: undefined is not a function" for the getPath function. This error occurs whether I put the function into the click function, the hover function, outside of the hover function or into the document.ready function or simply letting it in an external JS file. Where is my mistake?