エンジニアの中氏です。

以前、ブラウザ上でクリップボードへのコピー機能の実装という記事を投稿しましたが、より便利なブラウザの Clipboard API で実装出来る方法がありますでその方法を紹介します。

Clipboard API はクリップボードの内容を読み書きするために使用する Clipboard オブジェクトを返します。 Clipboard API は切り取り、コピー、貼り付け機能をウェブアプリケーションに実装するために使用することができます。
今回は、下記にクリップボードにテキストをセットするサンプルプログラムを記載いたします。

/**
 * 指定したテキストをクリップボードにセットする
 *
 * @text {string|HTMLElement} subject
 */
function copyTextToClipboard(text) {
     navigator.clipboard.writeText(text).then(function() {
         console.log('Async: Copying to clipboard was successful!');
     }, function(err) {
         console.error('Async: Could not copy text: ', err);
     });
 }

copyTextToClipboard(文字列)
で使用します。

文字列を指定するだけで、クリップボードにセットできます。

Clipboard API ブラウザの対応状況について、現状は、Chrome と FireFox のみの対応となっています。
よって、ブラウザを判別して前回の方法と今回の方法を両方使用すれば、ほとんどのブラウザで実装可能となります。