如果你的代码和教程一致的话，在画海葵之前要先清理画布。在

aneObj.prototype.draw = function () {

ctx.clearRect(0,0,画布宽，画布高);//加上这个

}

/**

 * ane.js

 */

var aneObj = function()

{

    this.x = [];

    this.len = [];

};

aneObj.prototype.num = 50;

aneObj.prototype.init = function () {

    for(var i = 0;i<aneObj.num;i++){

        this.x[i] = i * 16 + Math.random()*20;

        this.len[i] = 200 + Math.random()*50;

    }

};

aneObj.prototype.draw = function () {

    ctx2.save();

    ctx2.globalAlpha = 0.6;

    ctx2.strokeStyle='#3b154e';

    ctx2.lineCap='round';

    ctx2.lineWidth = 10;

    for(var i = 0;i<50;i++){

        ctx2.beginPath();

        console.log('begin draw');

        ctx2.moveTo(this.x[i],canHeight);

        ctx2.lineTo(this.x[i],canHeight-this.len[i]);

        ctx2.stroke();

        console.log('over draw');

    }

    ctx1.restore();

};

/**

 * main.js

 */

document.body.onload = game;

var can1;

var can2;

var ctx1;

var ctx2;

var canWidth;

var canHeight;

var lasttime;

var deltatime;

var bgPic = new Image();

var ane;

var fruit;

function game(){

    init();

    lasttime = Date.now();

    deltatime = 0;

    gameloop();

}

function init(){

    can1 = document.getElementById('can1');//z-index = 1 最外层  鱼  浮游物  ui  特效

    ctx1 = can1.getContext('2d');

    can2 = document.getElementById('can2');//背景  海葵  果实

    ctx2 = can2.getContext('2d');

    bgPic.src = './src/background.jpg';

    canWidth = can1.width;

    canHeight = can1.height;

    ane = new aneObj();

    ane.init();

    fruit = new fruitObj();

    fruit.init();

    console.log("main---fruil.init");

}

function gameloop(){

    window.requestAnimationFrame(gameloop);

        var now = Date.now();

        deltatime = now - lasttime;

        lasttime = now;

        drawBackground();

        ane.draw();

        fruit.draw();

}

现在果实也没有显示   搞不明白

gameloop里第一句没分号，且不同浏览器不同对象  应该这样写

window.requestAnimFrame = (function(){
    return  window.requestAnimationFrame       || 
            window.webkitRequestAnimationFrame || 
            window.mozRequestAnimationFrame    || 
            window.oRequestAnimationFrame      || 
            window.msRequestAnimationFrame     || 
            function( callback ){
                window.setTimeout(callback, 1000 / 60);//定义每秒执行60次动画
            };
})();

这样还不行的话，只能看你的全部代码  查查看了

设置canvas画笔对象属性要在画之前，设置完再画，才有作用效果的

ctx2.save();
	ctx2.globalAlpha = 0.6;
	ctx2.strokeStyle = "#3b154e";
	ctx2.lineCap = "round";
	ctx2.lineWidth = 20;
	for(var i = 0; i < this.num; i++){
		ctx2.beginPath();
		ctx2.moveTo(this.x[i], canHeight);
		ctx2.lineTo(this.x[i], canHeight - this.len[i]);
		ctx2.stroke();
	}
	ctx2.restore();