JavaScript getSelectionメソッドを使用して選択中のテキストを取得するサンプル

環境
Windows 10 home 64bit
Google Chrome 107.0.5304.122(Official Build) (64 ビット)

構文
1.テキストを選択します
document.getSelection();
2.イベント
document.onselectionchange = function() {処理コード}
selectionchange イベントは Selection API (en-US) の一部で、文書における現在のテキストの選択が変更された際に発生します。

使用例

<!DOCTYPE html>
<html>
<body>

<div>東京</div>
<div id="result"></div>

<script>
/*現在のテキストの選択イベント*/
document.onselectionchange = function(){
   let cft= document.getSelection();
   /*div要素result内容表示*/
   document.getElementById("result").textContent = "welcome" + cft;
}

</script>

</body>
</html>

実行結果
文字「東京」を選択した際に、div要素「result」に「welcome東京」が表示されます。

JavaScript

Posted by arkgame