JavaScript 如何选中文本147

##


简介
在 JavaScript 中，我们可以通过使用 `Selection` 对象来选中文本。`Selection` 对象表示当前选中的文本，它提供了一系列方法来操作选定的文本。


获取 Selection 对象
我们可以通过以下方法获取 `Selection` 对象：
```javascript
// 使用 window 对象
const selection = ();
// 使用 document 对象
const selection = ();
```


选中文本
要选中文本，我们可以使用 `Selection` 对象的 `addRange()` 方法。`addRange()` 方法接收一个 `Range` 对象作为参数，该对象表示要选择的文本范围。
我们可以通过以下方式创建 `Range` 对象：
```javascript
const range = ();
```
然后，我们可以将选定的文本范围设置为 `Range` 对象：
```javascript
(startNode, startOffset);
(endNode, endOffset);
```
其中：
* `startNode` 和 `startOffset` 表示选定文本范围的开始。
* `endNode` 和 `endOffset` 表示选定文本范围的结束。
最后，我们可以将 `Range` 对象传递给 `Selection` 对象的 `addRange()` 方法：
```javascript
(range);
```


获取选中文本
获取选中文本可以通过 `Selection` 对象的 `toString()` 方法：
```javascript
const selectedText = ();
```


操作选中文本
一旦我们选择了文本，就可以对其进行各种操作，包括：
* 复制选定的文本： `()`
* 剪切选定的文本： `()`
* 粘贴文本： `()`
* 删除选定的文本： `()`


使用案例
1. 突出显示选定的文本：
```javascript
(0).surroundContents(
('span'). = 'yellow'
);
```
2. 创建链接：
```javascript
const link = ('a');
= '';
= 'Example';
(0).surroundContents(link);
```
3. 插入表格：
```javascript
const table = ('table');
('border', '1');
(0).insertNode(table);
```


总结
`Selection` 对象提供了在 JavaScript 中操作选中文本的强大方法。通过了解如何使用 `Selection` 对象，我们可以创建交互式 Web 应用程序，以便用户可以轻松地编辑、格式化和操作文本。

2025-02-16

---

上一篇：如何在 JavaScript 中创建柱状图

下一篇：JavaScript 中 $ 符的用法