~~~ // 创建新的Image对象 let image1 = new Image(); let image2 = new Image(); image1.setAttribute("crossOrigin",'Anonymous') image2.setAttribute("crossOrigin",'Anonymous') // 设置图片的源 image1.src = 'https://cdnf.nur.cn/uploadfile/2023/1121/112100391870300025525995.jpgthumb_210_150.jpg'; image2.src = 'https://cdnf.nur.cn/uploadfile/2023/1119/111909093193100018754621.jpgthumb_210_150.jpg'; // 等待两个图片都加载完成 Promise.all([ new Promise((resolve, reject) => { image1.onload = resolve; image1.onerror = reject; }), new Promise((resolve, reject) => { image2.onload = resolve; image2.onerror = reject; }), ]).then(() => { // 创建一个canvas元素 let canvas = document.createElement('canvas'); // 设定canvas的宽和高 canvas.width = Math.max(image1.width, image2.width); canvas.height = image1.height + image2.height; // 获取2D渲染上下文 let ctx = canvas.getContext('2d'); // 绘制两个图片 ctx.drawImage(image1, 0, 0); ctx.drawImage(image2, 0, image1.height); // 将合并后的图片转为DataURL let imgDataUrl = canvas.toDataURL('image/png'); // 在页面中显示合并后的图片 let img = document.createElement('img'); img.src = imgDataUrl; document.body.appendChild(img); }).catch(err => { console.error('Error loading images', err); }); ~~~