在此页

• 概念和用法
• Selection API interfaces
• 扩展到其它接口
• 规范
• 浏览器兼容性
• 另请参阅
• 相关话题

The Selection API provides functionality for reading and manipulating the range of text selected by the user.

概念和用法

To retrieve the current text range the user has selected, you can use the Window.getSelection() or Document.getSelection() method, storing the return value — a Selection object — in a variable for futher use.

Once your selection is in a variable, you perform a variety of operations on it, for example copying the selection to a text string using Selection.toString() , adding a range (as represented by a standard 范围 object) to the selection (or removing one) with Selection.addRange() / Selection.removeRange() , or changing the selection to be the entire contents of a DOM node using Selection.selectAllChildren() .

You can run code in response to the selection being changed, or a new selection being started, using the GlobalEventHandlers.onselectionchange and GlobalEventHandlers.onselectstart event handlers.

Selection API interfaces

Selection

Represents the range of text selected by the user or the current position of the caret.

扩展到其它接口

Window.getSelection() , Document.getSelection()

返回 Selection object representing the range of text selected by the user or the current position of the caret. Document.getSelection() is basically an alias of Window.getSelection() .

GlobalEventHandlers.onselectstart

Represents the event handler that is called when a selectstart event is fired on the current object (i.e. when a new range of text is about to be selected by the user).

GlobalEventHandlers.onselectionchange

Represents the event handler that is called when a selectionchange event is fired on the current object (i.e. when the selected text range changes).

规范

规范	状态	注释
选定 API The definition of 'Selection' in that specification.	工作草案	The Selection API specification is based on the HTML Editing APIs specification and focuses on the Selection-related functionality.
HTML Editing APIs The definition of 'Selection' in that specification.	编者草案	Initial (older) definition, which is now outdated.

浏览器兼容性

Selection

The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request. 更新 GitHub 上的兼容性数据

	桌面						移动
	Chrome	Edge	Firefox	Internet Explorer	Opera	Safari	Android webview	Chrome for Android	Firefox for Android	Opera for Android	Safari on iOS	Samsung Internet
Selection	Chrome 1	Edge 12	Firefox 1 注意事项 1 注意事项 GlobalEventHandlers.onselectionchange and GlobalEventHandlers.onselectstart event handlers are supported as of Firefox 52.	IE 9	Opera 9	Safari 1	WebView Android 1	Chrome Android 18	Firefox Android 4 注意事项 4 注意事项 GlobalEventHandlers.onselectionchange and GlobalEventHandlers.onselectstart event handlers are supported as of Firefox 52.	Opera Android 10.1	Safari iOS 1	Samsung Internet Android 1.0
addRange	Chrome 1	Edge 12	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
anchorNode	Chrome 1	Edge 12	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
anchorOffset	Chrome 1	Edge 12	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
collapse	Chrome Yes	Edge 12	Firefox Yes	IE 9	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
collapseToEnd	Chrome Yes	Edge 12	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
collapseToStart	Chrome Yes	Edge 12	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
containsNode	Chrome Yes	Edge 12	Firefox 4 注意事项 4 注意事项 Before Firefox 35, the method didn't throw if node was null .	IE 不支持 No	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 4 注意事项 4 注意事项 Before Firefox 35, the method didn't throw if node was null .	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
deleteFromDocument	Chrome Yes	Edge 12	Firefox 55	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 55	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
empty() as alias of removeAllRanges()	Chrome Yes	Edge 12	Firefox 55	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 55	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
extend	Chrome Yes	Edge 12	Firefox Yes	IE 不支持 No	Opera Yes	Safari Yes	WebView Android 不支持 No	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
focusNode	Chrome Yes	Edge 12	Firefox 3.6	IE 10	Opera Yes	Safari 5.1	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
focusOffset	Chrome Yes	Edge 12	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
getRangeAt	Chrome Yes	Edge 12	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
isCollapsed	Chrome 1	Edge 12	Firefox Yes	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
修改 非标	Chrome Yes	Edge ≤79	Firefox 4	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 4	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
rangeCount	Chrome Yes	Edge 12	Firefox Yes	IE Yes	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
removeAllRanges	Chrome Yes	Edge 12	Firefox Yes	IE Yes	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
removeRange	Chrome 58	Edge 12	Firefox Yes	IE ?	Opera 45	Safari 不支持 No	WebView Android 58	Chrome Android 58	Firefox Android Yes	Opera Android 43	Safari iOS 不支持 No	Samsung Internet Android 7.0
selectAllChildren	Chrome Yes	Edge 12	Firefox Yes	IE Yes	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
setBaseAndExtent	Chrome Yes	Edge 12	Firefox 53	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 53	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
setPosition() as alias of collapse()	Chrome Yes	Edge 14	Firefox 55	IE ?	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 55	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes
toString	Chrome 1	Edge ≤18	Firefox Yes	IE ?	Opera Yes	Safari ?	WebView Android Yes	Chrome Android Yes	Firefox Android Yes	Opera Android Yes	Safari iOS ?	Samsung Internet Android Yes
type	Chrome Yes	Edge 12	Firefox 57	IE Yes	Opera Yes	Safari Yes	WebView Android Yes	Chrome Android Yes	Firefox Android 57	Opera Android Yes	Safari iOS Yes	Samsung Internet Android Yes

图例

完整支持

完整支持

不支持

不支持

兼容性未知 ?

兼容性未知

实验。期望将来行为有所改变。

实验。期望将来行为有所改变。

非标。预期跨浏览器支持较差。

见实现注意事项。

另请参阅

• Key quote generator : A simple demo showing typical usage of the Selection API to capture the current selection at any point and copy selections into a list ( see it live also ).
• 范围 对象。

元数据

• 最后修改： May 10, 2019

相关话题

1. 接口

   1. Selection
2. 特性

   1. Document.onselectionchange
   2. GlobalEventHandlers.onselectstart
3. 方法

   1. Document.getSelection()
   2. Window.getSelection()
4. 事件

   1. Document : selectionchange
   2. Document : selectstart