window.getSelection()相关用法

最新推荐文章于 2024-05-08 10:26:03 发布

原创最新推荐文章于 2024-05-08 10:26:03 发布 · 1.1k 阅读

1 ·

本内容遵循CC 4.0 BY-SA版权协议

收录于

当前文章被以下社区和专栏收录：

本文介绍了JavaScript中处理用户选区的五个关键方法：getRangeAt获取选区的起始节点，toString返回纯文本内容，containsNode检测节点是否在选区，deleteFromDocument删除选区内容，以及获取选中内容的父节点。这些方法在编辑和处理网页内容时非常实用。

相关方法：

1、getRangeAt
返回选区开始的节点（Node）
因为通常情况下用户只能选择一个范围，所以只有一个选区（range），此方法一般为getRangeAt(0)

2、toString
返回当前选区的纯文本内容。

3、containsNode
判断某一个node是否为当前选区的一部分。

4、deleteFromDocument
从页面中删除选区中的内容

5、获取选中的父节点

// startContainer启动容器
window.getSelection().getRangeAt(0).startContainer.parentNode
console.log(window.getSelection().getRangeAt(0)) console.log(window.getSelection().getRangeAt(0).startContainer)
console.log(window.getSelection().getRangeAt(0).startContainer.parentNode)