选择元素中的文本（类似于用鼠标突出显示）

根据jQuery文档select()：

触发每个匹配元素的选择事件。这将导致已绑定到该select事件的所有功能都被执行，并在匹配的元素上调用浏览器的默认select动作。

有您的解释为什么jQuery select()在这种情况下不起作用。

我的特定用例是在一个可编辑的span元素内选择一个文本范围，据我所知，此处的任何答案均未描述。

主要区别在于您必须将类型的节点传递Text给Range对象，如Range.setStart（）的文档中所述：

如果startNode是Text，Comment或CDATASection类型的Node ，则startOffset是从startNode开始的字符数。对于其他节点类型，startOffset是startNode起始之间的子节点数。

该Text节点是span元素的第一个子节点，因此要获取它，需要访问childNodes[0]span元素。其余与大多数其他答案相同。

这里是一个代码示例：

var startIndex = 1;
var endIndex = 5;
var element = document.getElementById("spanId");
var textNode = element.childNodes[0];

var range = document.createRange();
range.setStart(textNode, startIndex);
range.setEnd(textNode, endIndex);

var selection = window.getSelection();
selection.removeAllRanges();
selection.addRange(range);

其他相关文档：
范围
选择
Document.createRange（）
Window.getSelection（）

这是另一个获取字符串形式的所选文本的简单解决方案，您可以轻松地使用此字符串将div元素子代添加到代码中：

var text = '';

if (window.getSelection) {
    text = window.getSelection();

} else if (document.getSelection) {
    text = document.getSelection();

} else if (document.selection) {
    text = document.selection.createRange().text;
}

text = text.toString();

看一下Selection对象（Gecko引擎）和TextRange对象（Trident引擎）。我不知道任何实现了跨浏览器支持的JavaScript框架，但我也从没有寻找过，所以甚至jQuery都有可能。

Tim的方法非常适合我的情况-在替换以下语句后，为IE和FF选择div中的文本：

range.moveToElementText(text);

具有以下内容：

range.moveToElementText(el);

通过使用以下jQuery函数单击以选择div中的文本：

$(function () {
    $("#divFoo").click(function () {
        selectElementText(document.getElementById("divFoo"));
    })
});

Jason的代码不能用于iframe中的元素（因为范围与窗口和文档不同）。我修复了该问题，并对其进行了修改，以便用作其他任何jQuery插件（可链接）：

示例1：只需单击一下，即可选择<code>标记内的所有文本，并添加“ selected”类：

$(function() {
    $("code").click(function() {
        $(this).selText().addClass("selected");
    });
});

示例2：单击按钮时，在iframe中选择一个元素：

$(function() {
    $("button").click(function() {
        $("iframe").contents().find("#selectme").selText();
    });
});

注意：请记住，iframe源应该位于同一域中，以防止出现安全错误。

jQuery插件：

jQuery.fn.selText = function() {
    var obj = this[0];
    if ($.browser.msie) {
        var range = obj.offsetParent.createTextRange();
        range.moveToElementText(obj);
        range.select();
    } else if ($.browser.mozilla || $.browser.opera) {
        var selection = obj.ownerDocument.defaultView.getSelection();
        var range = obj.ownerDocument.createRange();
        range.selectNodeContents(obj);
        selection.removeAllRanges();
        selection.addRange(range);
    } else if ($.browser.safari) {
        var selection = obj.ownerDocument.defaultView.getSelection();
        selection.setBaseAndExtent(obj, 0, obj, 1);
    }
    return this;
}

我在IE8，Firefox，Opera，Safari，Chrome（当前版本）中对其进行了测试。我不确定它是否适用于较旧的IE版本（因为我不在乎）。

这是一个没有浏览器嗅探并且不依赖jQuery的版本：

function selectElementText(el, win) {
    win = win || window;
    var doc = win.document, sel, range;
    if (win.getSelection && doc.createRange) {
        sel = win.getSelection();
        range = doc.createRange();
        range.selectNodeContents(el);
        sel.removeAllRanges();
        sel.addRange(range);
    } else if (doc.body.createTextRange) {
        range = doc.body.createTextRange();
        range.moveToElementText(el);
        range.select();
    }
}

selectElementText(document.getElementById("someElement"));
selectElementText(elementInIframe, iframe.contentWindow);

这个线程包含非常棒的东西。但是由于“安全错误”，我无法使用FF 3.5b99 + FireBug在此页面上正确执行此操作。

pe！我可以使用此代码选择整个右侧边栏，希望它对您有所帮助：

    var r = document.createRange();
    var w=document.getElementById("sidebar");  
    r.selectNodeContents(w);  
    var sel=window.getSelection(); 
    sel.removeAllRanges(); 
    sel.addRange(r); 

PS：-我无法使用jquery选择器返回的对象，例如

   var w=$("div.welovestackoverflow",$("div.sidebar"));

   //this throws **security exception**

   r.selectNodeContents(w);