当阵列没有复制时如何防止.createElement视图复制

document.addEventListener('contextmenu', event => event.preventDefault());
document.addEventListener('keydown', event => {
    if ((event.ctrlKey || event.metaKey) && event.key === 'c') {
        event.preventDefault();
    }
});

.unselectable {
    -webkit-user-select: none; /* Safari */
    -moz-user-select: none; /* Firefox */
    -ms-user-select: none; /* IE10+/Edge */
    user-select: none; /* Standard syntax */
}

<div class="unselectable">This text cannot be selected.</div>

const element = document.createElement('div');
element.setAttribute('data-protected', 'true');
document.body.appendChild(element);

document.addEventListener('copy', event => {
    const selection = window.getSelection();
    if (selection.containsNode(event.target, true) && event.target.getAttribute('data-protected') === 'true') {
        event.preventDefault();
    }
});

<canvas id="myCanvas"></canvas>
<script>
    const canvas = document.getElementById('myCanvas');
    const ctx = canvas.getContext('2d');
    // 绘制内容
    ctx.fillText('This is protected content', 10, 50);
</script>