ブラウザでのテキストのクリップボードへのコピーと貼り付け方法 - JavaScriptによるFirefox、Safari、Chromeの対応

1. テキストのクリップボードへのコピー方法:

方法1: document.execCommandを使用する方法

function copyToClipboard(text) {
  var textarea = document.createElement("textarea");
  textarea.value = text;
  document.body.appendChild(textarea);
  textarea.select();
  document.execCommand("copy");
  document.body.removeChild(textarea);
}
// 使用例
var textToCopy = "クリップボードにコピーするテキスト";
copyToClipboard(textToCopy);

方法2: Clipboard APIを使用する方法 (ChromeとFirefoxでサポート)

function copyToClipboard(text) {
  navigator.clipboard.writeText(text)
    .then(function() {
      console.log("テキストがクリップボードにコピーされました！");
    })
    .catch(function(error) {
      console.error("クリップボードへのコピーに失敗しました:", error);
    });
}
// 使用例
var textToCopy = "クリップボードにコピーするテキスト";
copyToClipboard(textToCopy);

2. テキストのクリップボードからの貼り付け方法:

方法1: document.execCommandを使用する方法

function pasteFromClipboard() {
  var textarea = document.createElement("textarea");
  document.body.appendChild(textarea);
  textarea.select();
  document.execCommand("paste");
  var pastedText = textarea.value;
  document.body.removeChild(textarea);
  return pastedText;
}
// 使用例
var pastedText = pasteFromClipboard();
console.log("クリップボードから貼り付けたテキスト:", pastedText);

方法2: Clipboard APIを使用する方法 (ChromeとFirefoxでサポート)

function pasteFromClipboard() {
  return navigator.clipboard.readText()
    .then(function(text) {
      console.log("クリップボードから貼り付けたテキスト:", text);
      return text;
    })
    .catch(function(error) {
      console.error("クリップボードからの貼り付けに失敗しました:", error);
      return null;
    });
}
// 使用例
pasteFromClipboard();

これらの方法を使用することで、JavaScriptを介してブラウザでテキストのクリップボードへのコピーと貼り付けが行えます。それぞれの方法は、異なるブラウザで動作することに注意してください。