<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Document</title>
<meta http-equiv="X-UA-Compatible" content="IE=edge, chrome=1">
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no, minimal-ui">
</head>
<body>
<textarea id="test" cols="30" rows="10">Привет!!! У textarea есть свойства selectionStart/selectionEnd, которые позволяют узнать позицию выделенного текста!</textarea><br>
<button onclick="getParts(); ">Выдели часть текста и нажми</button>
<div id="result"></div>
<script>
function getParts() {
var textarea = document.getElementById("test");
var resultElement = document.getElementById("result");
var html = [];
html.push("Выделены символы: ".bold() + textarea.selectionStart + "\u2026" + textarea.selectionEnd);
html.push("Текст до выделения: ".bold() + textarea.value.slice(0, textarea.selectionStart));
html.push("Выделенный текст: ".bold() + textarea.value.slice(textarea.selectionStart, textarea.selectionEnd));
html.push("Текст после: ".bold() + textarea.value.slice(textarea.selectionEnd));
textarea.value = "Было выделено: " + textarea.value.slice(textarea.selectionStart, textarea.selectionEnd);
resultElement.innerHTML = html.join("<hr>")
}
</script>
</body>
</html>