selectionNN 6 IE 4(Win) DOM n/a  

  

The selection object represents zero or more characters that have been explicitly selected in a document by the user or selected under script control. The objects are very different entities in the IE and Navigator browsers (observe compatibility ratings for properties and methods, below), and each has its own ways of providing script access to it.

 

In IE for Windows, you create a selection object via the document.selection property, which returns a selection object. To perform substantive actions on the content of the selection object, you then generate a TextRange object from the selection object (via the selection object's createRange( ) method). Use TextRange properties and methods to interact with the content. To convert a TextRange object to a visibly selected stretch of text on the page, use the TextRange object's select( ) method. This close linkage with the TextRange object means that the IE selection object is so far limited to Win32 versions. The IE selection object can include selected text inside an input (of type text) and textarea element.

 

In IE for the Macintosh, you don't have a selection object per se. Instead, it implements the Navigator 4 document.getSelection( ) method, which returns only the string contents of the selected text.

 

Navigator 4 offers script access to the text selected in a document through the use of the document.getSelection( ) method. This method is deprecated in Netscape 6, and even displays a warning (less harmful than an error) in the JavaScript Console if you use the method. In its place, Netscape 6 implements a robust selection object that offers a long list of properties and methods to interact with the object. Most of this functionality was made available starting with Netscape 6.2, including the way to create a selection object: the window.getSelection( ) method. Notice that many properties and methods of the Netscape 6 selection object have analogs with the Range object specification. In fact, it is through the Range object that scripts can highlight even discontiguous text spans on the page: create and size a Range object; then add that Range to the highlighted text via the selection object's addRange( ) method. Netscape 6 selections (as with the Range object) operate only on body content, and not on text inside editable text boxes.

 

Be aware that clicking on buttons in earlier browsers (including IE 5 for the Mac) deselects the current text selection. Therefore, all scripted action involving selections in these browsers must be triggered by onselect or onmouseup events, or functions invoked by a timer (see the window.setTimeout( ) method description in Chapter 12). More recent browsers maintain content selections while buttons are pressed.

 
Object Model Reference
 
  • document.selection
  • window.getSelection( )
 
Object-Specific Properties
 
anchorNodeanchorOffsetfocusNodefocusOffset
isCollapsedrangeCounttypetypeDetail
 
Object-Specific Methods
 
addRange( )clear( )collapse( )
collapseToEnd( )collapseToStart( )containsNode( )
createRange( )createRangeCollection( )deleteFromDocument( )
empty( )extend( )getRangeAt( )
removeAllRanges( )removeRange( )selectAllChildren( )
selectionLanguageChange( )toString( )
 
Object-Specific Event Handler Properties

None.

anchorNode, focusNodeNN 6 IE n/a DOM n/a  

Read-only  

Return a reference to the node where the user started (anchor) and ended (focus) the selection. Most typically, these are text node types. If the selection is set or extended via the addRange( ) method, these properties point to the node boundaries of the most recently added range.

 
Example
 
var anchor = selectionRef.anchorNode;
if (anchor.nodeType == 3 && anchor.parentNode.tagName == "td") {
    // process selection start inside a table cell
}
 
Value

Reference to a document tree node, or null if no selection.

 
Default

null

anchorOffset, focusOffsetNN 6 IE n/a DOM n/a  

Read-only  

Return an integer count of characters or nodes from the beginning of the anchor or focus nodes of the selection (see anchorNode and focusNode properties). If the node is a text node, the offset unit is the character; if the node is an element node, the offset unit is the node. This behavior is similar to the offset properties of a Range object. Most typically, these values count characters within text node types. If the selection is set or extended via the addRange( ) method, these properties point to the node boundary offsets of the most recently added range.

 
Example
 
var selStartOffset = selectionRef.anchorOffset;
 
Value

Integer.

 
Default

0

isCollapsedNN 6 IE n/a DOM n/a  

Read-only  

Returns Boolean true if the anchor and focus boundaries of a selection are identical.

 
Example
 
if (selectionRef.isCollapsed) {
    // selection is an insertion point
}
 
Value

Boolean value: true | false.

 
Default

true

rangeCountNN 6 IE n/a DOM n/a  

Read-only  

Returns an integer count of Range objects (which may be discontiguous in Netscape 6) within the span of the selection. A manual selection by the user always contains one Range, but the addRange( ) method can tack on multiple, discontiguous ranges to the selection. To inspect each highlighted section's properties, use the getRangeAt( ) method.

 
Example
 
var howMany = selectionRef.rangeCount;
 
Value

Integer.

 
Default

0

typeNN n/a IE 4(Win) DOM n/a  

Read-only  

Specifies whether the current selection object has one or more characters selected or is merely an insertion point.

 
Example
 
if (document.selection.type == "Text") {
    ...
}
 
Value

One of three constant values (as a string): None | Text | Control. The last one is possible only when HTML editing is engaged and control selections are possible.

 
Default

None

typeDetailNN n/a IE 5.5(Win) DOM n/a  

Read-only  

This property is supplied as a placeholder for other applications that may use the IE browser component. Such an application can provide additional selection type information as needed.

addRange( )NN 6 IE n/a DOM n/a  

addRange(RangeReference)

  

Turns a Range into a highlighted selection on the page. You can add as many discontiguous ranges to the selection as your application requires. Each addition increments the selection object's rangeCount property. Ranges may also overlap in a selection.

 
Parameters
 
  • Reference to a Range object with boundaries that have been established by Range object methods.
 
Returned Value

None.

clear( )NN n/a IE 4(Win) DOM n/a  

  

Deletes the content of the current selection in a document. For example, the event handler in the following tag deletes any selected text of the p element two seconds after the user starts making the selection:

<p onselectstart="setTimeout('document.selection.clear( )',2000);>"
 
Parameters

None.

 
Returned Value

None.

collapse( )NN 6 IE n/a DOM n/a  

collapse(nodeReference, offset)

  

Collapses the current selection to a location specified by the two parameters. Any previously highlighted selection returns to normal display.

 
Parameters
 
  • Reference to a text or element node in the document tree in which the collapsed selection should move.
  • Integer count of characters or nodes within the nodeReference node where the collapsed selection should move. The count is relative to the start of the node. Units are character for text nodes, nodes for elements.
 
Returned Value

None.

collapseToEnd( ), collapseToStart( )NN 6 IE n/a DOM n/a  

  

Collapses the current selection to a location at the start (collapseToStart( )) or end (collapseToEnd( )) of the selection object. Any previously highlighted selection returns to normal display. If the selection consists of multiple ranges, the start or end boundary used for these collapse methods are at the outermost edges of the combined selection. After the collapse, the selection contains only one range.

 
Parameters

None.

 
Returned Value

None.

containsNode( )NN 6 IE n/a DOM n/a  

containsNode(nodeReference, entirelyFlag)

  

Returns Boolean true if the current selection object contains a node passed as a parameter. The second parameter is supposed to let you loosen or tighten the definition of contains, but the behavior of the method seems backward to the intended purpose of the flag. You can assure accuracy if you pass null as the second parameter, which forces the method to define containment as containing the node in its entirety.

 
Parameters
 
  • Reference to any addressable text or element node in the document tree.
  • Boolean value or null. Observed behavior is that a value of true means the selection can contain only a part of the node for the method to return true.
 
Returned Value

Boolean value: true | false.

createRange( )NN n/a IE 4(Win) DOM n/a  

  

Creates a TextRange object from the current selection object. After a statement like the following:

var myRange = document.selection.createRange( );
 

scripts can act on the content of the selected text.

 
Parameters

None.

 
Returned Value

TextRange object.

createRangeCollection( )NN n/a IE 5.5(Win) DOM n/a  

  

Creates a TextRange collection object. This must be in anticipation of IE supporting multiple, discontiguous selections in the future.

 
Parameters

None.

 
Returned Value

TextRange collection object.

deleteFromDocument( )NN 6 IE n/a DOM n/a  

  

Removes the current selection from the document tree. The node hierarchy adjusts itself by obeying the same rules as Range.deleteContents( ).

 
Parameters

None.

 
Returned Value

None.

empty( )NN n/a IE 4(Win) DOM n/a  

  

Deselects the current selection and sets the selection object's type property to None. There is no change to the content that had been selected.

 
Parameters

None.

 
Returned Value

None.

extend( )NN 6 IE n/a DOM n/a  

extend(nodeReference, offset)

  

Moves the end (focus) boundary of the selection to the designated document tree node and offset within that node. The start (anchor) point does not move with this method.

 
Parameters
 
  • Reference to a text or element node in the document tree in which the selection's focus (end point) should move.
  • Integer count of characters or nodes within the nodeReference node where the collapsed selection should move. The count is relative to the start of the node. Units are character for text nodes, nodes for elements.
 
Returned Value

None.

getRangeAt( )NN 6 IE n/a DOM n/a  

getRangeAt(rangeIndex)

  

Returns a reference to the range within a selection object whose zero-based numeric index matches the passed parameter. For contiguous selections, the parameter should be zero. But for discontiguous selections, the getRangeAt( ) method lets you retrieve each range that had been added to the selection for individual manipulation as a Range object. Use the selection.rangeCount property to derive the number of Range objects contained by the selection object. Invoking the method does not disturb the sequence of ranges within the selection.

 
Parameters
 
  • Zero-based integer index value.
 
Returned Value

Range object reference.

removeAllRanges( )NN 6 IE n/a DOM n/a  

  

Removes all Range objects from the current selection (not from the document tree). The selection collapses, and the rangeCount property value changes to zero.

 
Parameters

None.

 
Returned Value

None.

removeRange( )NN 6 IE n/a DOM n/a  

removeRange(rangeReference)

  

Removes a single Range object from the current selection (not from the document tree). If you have a multiple-range selection, you can iterate through all Range objects, inspect each for some criterion, and delete the one(s) you want with the following sequence:

var oneRange;
var sel = window.getSelection( );
for (var i = 0; i< sel.rangeCount; i++) {
    oneRange = sel.getRangeAt(i);
    if (oneRange. someProperty == someDiscerningValue) {
        sel.removeRange(oneRange);
    }
}
 
Parameters
 
  • Reference to one of the Range objects previously added to the current selection.
 
Returned Value

None.

selectAllChildren( )NN 6 IE n/a DOM n/a  

selectAllChildren(elementNodeReference)

  

Forces the selection object to encompass the element node passed as a parameter and all of its child nodes. This method is also a shortcut to using a script to select an element node. Using this method on an element node causes the anchor and focus nodes to be that element node. Should you pass a reference to a text node, the resulting selection is collapsed in front of the first character of the text node. Invoking this method on an existing selection replaces all ranges with the new range encompassing the element.

 
Parameters
 
  • Reference to an element node in the document tree that becomes the selection.
 
Returned Value

None.

selectionLanguageChange( )NN 6 IE n/a DOM n/a  

selectionLanguageChange(RTLFlag)

  

Controls the cursor Bidi (bi-directional) level.

 
Parameters
 
  • Boolean value: true for right-to-left; false for left-to-right.
 
Returned Value

None.

toString( )NN 6 IE n/a DOM n/a  

  

Returns a string containing only body content from the selection. Tags and attributes are ignored.

 
Parameters

None.

 
Returned Value

String value.