水果忍者是一款大受歡迎的游戲，而HTML5實現的水果忍者代碼也相當流行。下面我們來看一下HTML5水果忍者代碼的實現。

// 獲取畫布、上下文
let canvas = document.getElementById("canvas");
let ctx = canvas.getContext("2d");
// 加載圖片
let fruitList = ["apple.png", "banana.png", "cherry.png", "watermelon.png"];
let imgList = [];
for (let i = 0; i< fruitList.length; i++) {
let img = new Image();
img.src = "images/" + fruitList[i];
imgList.push(img);
}
// 水果類
class Fruit {
constructor(img, x, y, speed) {
this.img = img;
this.x = x;
this.y = y;
this.speed = speed;
}
// 更新位置
update() {
this.y += this.speed;
}
// 繪制水果
draw() {
ctx.drawImage(this.img, this.x, this.y);
}
}
// 主函數
function main() {
setInterval(() =>{
// 清空畫布
ctx.clearRect(0, 0, canvas.width, canvas.height);
// 生成水果
let fruit = new Fruit(imgList[Math.floor(Math.random() * fruitList.length)], Math.random() * (canvas.width - 100), 0, Math.random() * 5 + 2);
// 繪制水果
fruit.draw();
// 更新水果位置
fruit.update();
}, 1000 / 60);
}
main();

以上代碼實現了一個簡單的水果忍者游戲，可以在網頁中嵌入這段代碼，讓玩家在瀏覽器中玩水果忍者游戲。