存取剪貼簿的 JavaScript 技術：

1.使用剪貼簿API (navigator.clipboard.readText):

剪貼簿 API 提供了一種安全的方式來讀取和寫入剪貼簿。以下是如何使用 navigator.clipboard.readText() 從剪貼簿快速檢索文字資料。

async function getClipboardContent() {
    try {
        const text = await navigator.clipboard.readText();
        console.log('Clipboard content:', text);
        alert('Clipboard content: '   text);
    } catch (err) {
        console.error('Failed to read clipboard contents:', err);
    }
}

// Trigger the function
getClipboardContent();

2.使用按鈕取得剪貼簿內容：
有時，您可能希望僅在使用者點擊按鈕時觸發剪貼簿讀取。具體方法如下：

Show Clipboard Content

3.處理剪貼簿存取權限：
Clipboard API 需要使用者權限，因此妥善處理可能的權限問題非常重要。以下是如何在嘗試讀取或寫入剪貼簿之前確保您擁有權限的方法：

async function getClipboardContent() {
    try {
        // Request permission to read from the clipboard
        const readPermission = await navigator.permissions.query({ name: 'clipboard-read' });
        if (readPermission.state === 'granted' || readPermission.state === 'prompt') {
            const text = await navigator.clipboard.readText();
            alert('Clipboard content: '   text);
        } else {
            alert('Clipboard read access denied');
        }
    } catch (err) {
        console.error('Failed to read clipboard contents:', err);
    }
}

async function writeToClipboard(text) {
    try {
        // Request permission to write to the clipboard
        const writePermission = await navigator.permissions.query({ name: 'clipboard-write' });
        if (writePermission.state === 'granted' || writePermission.state === 'prompt') {
            await navigator.clipboard.writeText(text);
            alert('Text copied to clipboard: '   text);
        } else {
            alert('Clipboard write access denied');
        }
    } catch (err) {
        console.error('Failed to write to clipboard:', err);
    }
}

寫入剪貼簿的範例

Copy "Hello, World!" to Clipboard

完整範例程式碼
您可以在 GitHub Gist 上找到完整的範例程式碼，以快速了解剪貼簿中的內容。

如果這篇文章讓您的開發生活變得更輕鬆，請點擊那顆心 ❤️ 並堅持下去，享受更多 JavaScript 魔法！