add unique id to selected text html tag

Question

I have a function that gets the selected text of a content, but what I want to do is to get this selected text and also add a unique id to its html tag.

function getSelectedText() {
    if (window.getSelection) {
        return window.getSelection();
    } else if (document.selection) {
        return document.selection.createRange().text;
    }
    return '';
}
 $('#outline').on('click',function(){
       var text = getSelectedText();
//here want to add the unique id to this paragraph that contains this text
});

I am stuck and can't find something similar elsewhere.

possible duplicate of [Create GUID / UUID in JavaScript?](http://stackoverflow.com/questions/105034/create-guid-uuid-in-javascript) — JuniorCompressor, Mar 23 '15 at 11:27
@JuniorCompressor the problem is not at unique id, but how to get the html content of text selected — Laureta Xhaferraj, Mar 23 '15 at 11:28
Took a look http://stackoverflow.com/questions/7215479/get-parent-element-of-a-selected-text. When you find parent element of selected text it should be easy to finish this up. — Filip Krstic, Mar 23 '15 at 11:37
what's the content of `getSelectedText()`? this should be pretty straightforward — cr0ss, Mar 23 '15 at 11:40

score 0 · Answer 1 · answered Apr 27 '15 at 03:15

Here's an example of what you are looking to do.

Demo: https://jsfiddle.net/xo01kxLa/1/

function getSelectedText() {
    if (window.getSelection) {
        return window.getSelection();
    } else if (document.selection) {
        return document.selection.createRange().text;
    }
    return '';
}
function getSelectionParentElement() {
    var parentEl = null, sel;
    if (window.getSelection) {
        sel = window.getSelection();
        if (sel.rangeCount) {
            parentEl = sel.getRangeAt(0).commonAncestorContainer;
            if (parentEl.nodeType != 1) {
                parentEl = parentEl.parentNode;
            }
        }
    } else if ( (sel = document.selection) && sel.type != "Control") {
        parentEl = sel.createRange().parentElement();
    }
    return parentEl;
}
$('#outline').on('click', function () {
    var text = getSelectedText();
    var parent = getSelectionParentElement();
    $(parent).attr('id', 'id' + Math.floor((Math.random() * 1000) + 1));
});

If you only want the unique ID to be set once, then make it:

$('#outline').on('click', function () {
    var text = getSelectedText();
    var parent = getSelectionParentElement();
    if($(parent).attd('id') != '') {
            $(parent).attr('id', 'id' + Math.floor((Math.random() * 1000) + 1));
    }
});

add unique id to selected text html tag

1 Answers1