Web API Selection.type用法及代码示例

Web API Selection.type 用于获取用户选择的文本范围或插入符号的位置。 window.getSelection()用于获取选择对象。

用法:

let selection = window.getSelection( );

它带有一些实例属性，其中之一是类型.

Selection.type：它是一个只读属性，告诉用户所做的选择类型。它有 3 个可能的值。

none:未进行任何选择
caret: 当选择内容折叠或插入符号放置在选择点时。
range: 当选择一系列字符时。

示例 1：在此示例中，我们将检测选择的类型并使用Selection.type。为了检测选择的类型，我们将利用选择改变事件。输出显示类型属性的所有三个值。当您取消选择某些内容时，它会返回“none”。当您取消选择已选择的内容时，它会返回 “caret” 值。当您选择字符范围时，它返回“range”值。

HTML


<html> 
<body> 
    <h1 style="color:green">GeeksforGeeks</h1> 
    <h3>  Web API Selection.type property </h3> 
    <script>     
        document.onselectionchange = () => { 
            let selection = document.getSelection(); 
            console.log(selection.type); 
        }; 
    </script> 
</body> 
</html>

输出：

示例 2：在此示例中，我们将从文档中删除所选文本并将其打印在控制台上以便更好地理解。

HTML


<html> 
<body> 
    <h1 style="color:green">GeeksforGeeks</h1> 
    <h3>  Web API Selection.type property </h3> 
    <script>     
        document.onselectionchange = () => { 
            let selection = document.getSelection(); 
            console.log(selection.toString()) 
            selection.deleteFromDocument(); 
        }; 
    </script> 
</body> 
</html>

输出：

相关用法

注：本文由纯净天空筛选整理自nikhilkalburgi大神的英文原创作品 Web API Selection.type Property。非经特殊声明，原始代码版权归原作者所有，本译文未经允许或授权，请勿转载或复制。