API Chrome предоставляет разработчикам широкий спектр функций для взаимодействия с браузером Chrome. Одной из распространенных задач является извлечение выделенного текста с веб-страницы. В этой статье мы рассмотрим различные способы достижения этой цели с помощью API Chrome, а также примеры кода.

Метод 1: использование метода window.getSelection()

Метод window.getSelection() — это встроенный метод JavaScript, позволяющий получить выделенный текст в окне браузера. Вот пример того, как вы можете его использовать:

// Get the selected text
const selectedText = window.getSelection().toString();
// Log the selected text
console.log(selectedText);

Метод 2. Использование API chrome.tabs

API chrome.tabsобеспечивает доступ к текущей вкладке и ее свойствам. Используя метод executeScript, мы можем внедрить на страницу собственный код JavaScript и получить выделенный текст. Вот пример:

// Get the selected text using chrome.tabs API
chrome.tabs.executeScript({ code: 'window.getSelection().toString();' }, (result) => {
  const selectedText = result[0];
  console.log(selectedText);
});

Метод 3. Использование сценария контента

Скрипты контента — это файлы JavaScript, которые выполняются в контексте веб-страниц. Используя сценарии содержимого, мы можем прослушивать события выбора и связываться с фоновым сценарием для получения выделенного текста. Вот пример:

Сценарий контента (content.js):

// Listen for selection events
document.addEventListener('mouseup', () => {
  const selectedText = window.getSelection().toString();
  chrome.runtime.sendMessage({ selectedText });
});

Фоновый сценарий (background.js):

// Receive message from content script
chrome.runtime.onMessage.addListener((message, sender, sendResponse) => {
  const selectedText = message.selectedText;
  console.log(selectedText);
});

В этой статье мы рассмотрели несколько методов получения выделенного текста с помощью API Chrome. Мы рассмотрели использование метода window.getSelection(), API chrome.tabsи сценариев контента. В зависимости от вашего конкретного варианта использования вы можете выбрать метод, который лучше всего соответствует вашим потребностям.

Не забудьте ознакомиться с документацией Chrome API для получения более подробной информации о каждом методе и их потенциальных ограничениях. Приятного кодирования!