JavaScriptでクリップボードにコピーさせる方法として、select()
して、document.execCommand("copy")
を呼び出すことで、要素を選択してクリップボードへのコピーコマンドを呼び出す方法を採用することが多いと思うのですが、
async function clipboardCopy(selector) { const target = document.querySelector(selector); target.select(); document.execCommand("copy"); }
この方法では明示的に画面上の項目を選択してコピーを行う都合上、hiddenタグの値等、画面に表示されていない値を取得することはできません。
そういうときにはnavigator.clipboard.writeTex
を使うと任意の文字列をコピーさせることができます。
サンプルはこんな感じです。
async function clipboardCopy(text) { await navigator.clipboard.writeText(text); } clipboardCopy("コピー対象の文字列")
Clipboard API
、今まで知らなかったのですが便利ですね✨