yikegaya’s blog

仕事関連(Webエンジニア)と資産運用について書いてます

document.execCommandの代替(クリップボードへのコピー)

javascriptでdocument.execCommandを使ってクリップボードにテキストをコピーしているプログラムがあったんだけど最近のブラウザだとこのメソッド使えないらしく代わりになるものを探した。

クリップボードAPIってものがあってこっちを使えばいいらしい。クリップボードへのコピーの方法雑にググると現時点でdocument.execCommandが先に出てくる。

developer.mozilla.org

const target = document.getElementById('hoge')
target.readOnly = false;
const range = document.createRange();
range.selectNode(target);
window.getSelection().addRange(range);
document.execCommand('copy');
target.readOnly = true;

navigator.clipboard.writeText(value)

ただIEの場合はwindow.clipboardData使わないとダメかも

    if (window.clipboardData){
      window.clipboardData.setData("Text" , target.value);
    }

ブラウザごとの対応状況

developer.mozilla.org