Javascript 将画布元素分配给img.src

这很有效

img.src = "assets/img.png";
img.addEventListener('load', function () {
   textureContext.drawImage(this, 0, 0);
   texture.update();
});

现在，如何使用页面上已经存在的canvas元素来插入这段代码。像这样的东西

var img = document.getElementById("canvas1");
textureContext.drawImage(img, 0, 0);
texture.update();

---

我正在寻找纯javascript解决方案。

您需要使用该方法

方法的作用是：返回一个数据URI，其中包含图像的表示形式，格式由类型参数指定（默认为PNG）。返回的图像分辨率为96 dpi

工作示例：

const canvas=document.getElementById（“canvas”）；
const img_from_canvas=document.getElementById（“img_from_canvas”）；
const context=canvas.getContext（“2d”）；
rect（10,10,150,100）；
context.fill（）；
img_from_canvas.src=canvas.toDataURL（）
画布

画布上的图像


img.src = document.getElementById("canvas1").toDataURL();