var canvas = document.getElementById("myCanvas"); //獲取畫布
var ctx = canvas.getContext("2d"); //獲取上下文
var img = new Image(); //創建圖片對象
img.src = "img1.jpg"; //設置圖片路徑
img.onload = function() {
//當圖片加載完成后執行下面的代碼
ctx.drawImage(img,0,0); //將圖片繪制到畫布的左上角
};

var images = ["img1.jpg","img2.jpg","img3.jpg"]; //定義圖片數組
var currentIndex = 0; //定義當前索引
function changeImg() {
currentIndex++; //當前索引加1
if (currentIndex == images.length) { //如果當前索引等于圖片數量，則重置為0
currentIndex = 0;
}
var img = new Image(); //創建圖片對象
img.src = images[currentIndex]; //設置圖片路徑
img.onload = function() {
//當圖片加載完成后執行下面的代碼
ctx.drawImage(img,0,0); //將圖片繪制到畫布的左上角
};
}
setInterval(changeImg,2000); //每2秒切換一次圖片

#myCanvas {
width: 400px;
height: 300px;
border: 1px solid #ccc;
box-shadow: 0 0 10px rgba(0,0,0,0.5);
}
img {
width: 100%;
height: 100%;
}