canvas 实现写字板功能<canvas> 是 HTML5 新增的，一个可以使用脚本(通常为 JavaScript)

<canvas> 是 HTML5 新增的，一个可以使用脚本(通常为 JavaScript) 在其中绘制图像的 HTML 元素。它可以用来制作照片集或者制作简单(也不是那么简单)的动画，甚至可以进行实时视频处理和渲染。

实现写字板功能

<body>
    <canvas id="canvasId" width="800px" height="500px" style="border: 1px solid pink;"></canvas>
    <script>
        let myCanvas = document.getElementById('canvasId');
        let cavs = myCanvas.getContext('2d');
        myCanvas.onmousedown = function (e) {
            var event = e || window.event;
            cavs.moveTo(event.clientX - myCanvas.offsetLeft, event.clientY - myCanvas.offsetTop);
            myCanvas.onmousemove = function (e) {
                var event = e || window.event;
                cavs.lineTo(event.clientX - myCanvas.offsetLeft, event.clientY - myCanvas.offsetTop);
                cavs.stroke()
            }
            document.onmouseup = function () {
                myCanvas.onmousemove = null
            }
        }
    </script>
</body>