В хроме работает:
<!DOCTYPE html>
<style>
span{
background: rgba(214, 255, 0, 0.67);
}
</style>
<p>Кликни по любому слову!</p>
<script>
document.ondblclick = function() {
var selection = getSelection();
if (selection.type == 'Range' && selection.rangeCount > 0) {
var range = selection.getRangeAt(0);
range.surroundContents(document.createElement('span'));
}
}
</script>
Кстати в нем также есть getBoundingClientRect