Get HTML element contained in a range

I use document.getSelection() to select text. I would like to know what type of element the selected range contains (I specifically want to see if it is an anchor tag).

 var selection = document.getSelection(); var range = selection.getRangeAt(0); 

So, I can get the range, but how can I find out which element is in this range? Happy to use plain js or jQuery.

EDIT:

Here is what I came up with:

 var updateLink = function(url) { var selection = document.getSelection(); var range = selection.getRangeAt(0); if (range != 0) { var containerElement = range.commonAncestorContainer; if (containerElement.nodeType != 1) { containerElement = containerElement.parentNode; var e = $(containerElement); e.attr('href', url); } } }//end 
+6
source share
2 answers

Try the following:

 var obj = document.getSelection(); var parentNode = $(obj.anchorNode).parent(); 

Here is jsfiddle

+2
source

You can use the cloneContents() method:

Demo

 $(document).mouseup(function(){ var range = window.getSelection().getRangeAt(0), selectionContents = range.cloneContents(); alert($(selectionContents.childNodes).filter('a').length); }); 
+1
source

All Articles