JavaScript: API буфера обмена для чтения и записи данных

Clipboard API позволяет читать и записывать данные в буфер обмена. Это полезно для реализации функционала "копировать в буфер обмена".

Приложения могут использовать Clipboard API, чтобы дать пользователям возможность копировать текст или изображения в буфер обмена и вставлять их в другие приложения или места. Например, вы можете реализовать кнопку "Копировать" на вашей веб-странице, чтобы пользователи могли скопировать содержимое элемента, такого как адрес электронной почты или номер телефона, в буфер обмена.

<input id="ticket" type="text" value="Счастливый билет"/>
<button id="copyBtn">Копировать</button>

Метод navigator.clipboard.writeText() записывает текст в буфер обмена:

const copyButton = document.querySelector('#copyBtn');
const copyValue = document.querySelector('#ticket');

copyButton.addEventListener('click', () => {
  navigator.clipboard.writeText( copyValue.value )
    .then(() => {
      console.log('Текст успешно скопирован в буфер обмена');
    })
    .catch(err => {
      console.error('Ошибка при копировании текста в буфер обмена', err);
    });
});