doc.selection对象介绍

最新推荐文章于 2021-02-16 02:21:34 发布

Sam-9527

最新推荐文章于 2021-02-16 02:21:34 发布

阅读量846

点赞数

CC 4.0 BY-SA版权

分类专栏： Js 文章标签： document.selection 选

本文链接：https://blog.youkuaiyun.com/lipinganq/article/details/51252037

Js 专栏收录该内容

17 篇文章

订阅专栏

本文介绍了如何在不同浏览器中（包括IE和其他现代浏览器）通过JavaScript实现选中文本的功能。利用`window.getSelection()`和`document.selection`，可以分别在非IE浏览器和IE中获取到用户的文本选择状态，从而实现统一的文本操作接口。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

var userSelection;
if (window.getSelection) { //在非IE浏览器（Firefox、Safari、Chrome、Opera）下可以使用window.getSelection()获得selection对象
    userSelection = window.getSelection();

} else if (document.selection) { //IE浏览器 考虑到Opera，应该放在后面

    userSelection = document.selection.createRange();
}

document.selection只有IE支持，
　　window.getSelection()也只有FireFox和Safari支持，都不是标准语法。

　　selection 对象代表了当前激活选中区，即高亮文本块，或文档中用户可执行某些操作的其它元素。

selection 对象的典型用途是作为用户的输入，以便识别正在对文档的哪一部分正在处理，或者作为某一操作的结果输出给用户。

用户和脚本都可以创建选中区。

（1）用户创建选中区的办法是：拖曳文档的一部分---选中一部分文本

（2）脚本创建选中区的办法是在文本区域或类似对象上调用 select 方法。

要获取当前选中区，请对document对象应用selection关键字：document.selection

要对选中区执行操作，请先用createRange方法从选中区创建一个文本区域对象:document.selection.createRange()

(1) document.selection.createRange() 根据当前文字选择返回 TextRange 对象，

(2) 或根据控件选择返回 ControlRange 对象。配合 execCommand，在 HTML 编辑器中很有用，比如：文字加粗、斜体、复制、粘贴、创建超链接等。selection.type选中内容的类型。

TextRange.setEndPoint(sType, oTextRange)

oTextRange 是另一个TextRange对象

sType是字符串类型有4种选择

StartToEnd

StartToStart

EndToStart

EndToEnd

object.focus();//输入框获取焦点
/**
* 根据当前选中的文字选择返回 TextRange 对象
* 为 object 建立 TextRange 对象。使用此 TextRange 对象可以检索和修改 object 内的文本
* */
var s = doc.selection.createRange();
s.setEndPoint(sType, obj.createTextRange());
return s.text.length;

实例

<html>
<body>
<p>4月13日消息，据台湾媒体报道，32岁的孙燕姿(Sng Ee Tze)和后天将满34岁的荷兰籍印度尼西亚男友纳迪姆(Nadim Van Der Ros)交往5年，曾说过"有空就结婚"的她，果然趁着宣传期尾声，于3月31日在新加坡登记注册了！昨消息传开，她未否认，仅说会选择适当时间公布喜讯，所属"美妙音乐"则表示她个性低调，婚礼只会邀请双方亲友，也不会透露细节，但据新加坡可靠消息指出，婚宴订在5月初。</p>
<button id="button">选中一些文字，然后点击本按钮</button>

<script>
var oBtn = document.getElementById("button");
oBtn.onclick = function() {
var userSelection, text;
if (window.getSelection) {
//现代浏览器
userSelection = window.getSelection();
} else if (document.selection) {
//IE浏览器考虑到Opera，应该放在后面
userSelection = document.selection.createRange();
}
if (!(text = userSelection.text)) {
text = userSelection;
}
alert(text);
};
</script>

</body>
</html>