html点击复制table内容

复制按钮

<button type="button" class="btn btn-primary btn-sm" id="copyBtn">复制</button>

js

document.querySelector('#copyBtn').addEventListener('click', () => {
        const table = document.querySelector('#datatable_id')

        //过滤掉图片
        // for (var i=0;i<table.children[0].children[0].children.length;i++)
        // {
        //     if(table.children[0].children[0].children[i].getElementsByTagName("img").length > 0) {
        //         table.children[0].children[0].children[i].getElementsByTagName("img")[0].src = "";
        //     }
        // }

        const range = document.createRange()
        // 设定range包含的节点对象
        range.selectNode(table)
        // 窗口的selection对象，表示用户选择的文本
        const selection = window.getSelection()
        // 将已经包含的已选择的对象清除掉
        if (selection.rangeCount > 0) selection.removeAllRanges()
        // 将要复制的区域的range对象添加到selection对象中
        selection.addRange(range)
        // 执行copy命令，copy用户选择的文本
        document.execCommand('copy')

        if (document.execCommand('copy')) {
            document.execCommand('copy')
            Swal.fire({title: '操作成功', text: '复制成功', icon: 'success'})
        } else {
            Swal.fire({title: '操作异常', text: '当前浏览器不支持复制功能', icon: 'error'})
        }
    })

表格数据

<table class="table table-bordered" id="datatable_id">
<thead><tr><th>1</th><th>2</th><th>3</th></tr></thead>
<tbody>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>1</td><td>2</td><td>3</td></tr>
<tr><td>1</td><td>2</td><td>3</td></tr>
</tbody>
</table>