同问，代码相同，主函数调用，HTML已添加，控制台不报错但是就是不显示数值

main.js

var can1;

var can2;

var ctx1;

var ctx2;

var lastTime;

var deltaTime;

var canWidth;

var canHeight;

var bgPic = new Image();

var ane;

var fruit;

var mom;

var mx;

var my;

var baby;

var babyTail = [];

var babyEye = [];

var babyBody = [];

var momTail=[];

var momEye=[];

var momBodyOrange=[];

var momBodyBlue=[];

var data;

document.body.onload = game;

function game() {

init();

lastTime = Date.now();

deltaTime = 0;

gameloop();

}

function init() {

//获得canvas内容

can1 = document.getElementById("canvas1");

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

can2 = document.getElementById("canvas2");

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

can1.addEventListener('mousemove', onmouseMove, false);

bgPic.src = "img/background.jpg";

canWidth = can1.width;

canHeight = can1.height;

ane = new aneObj();

ane.init();

fruit = new fruitObj();

fruit.init();

mom = new momObj();

mom.init();

baby = new babyObj();

baby.init();

mx = canWidth * 0.5;

my = canHeight * 0.5;

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

babyTail[i] = new Image();

babyTail[i].src = "./img/babyTail" + i + ".png";

}

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

babyEye[i] = new Image();

babyEye[i].src = "./img/babyEye" + i + ".png";

}

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

babyBody[i] = new Image();

babyBody[i].src = "./img/babyFade" + i + ".png";

}

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

momTail[i] = new Image();

momTail[i].src = "./img/bigTail" + i + ".png";

}

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

momEye[i] = new Image();

momEye[i].src = "./img/bigEye" + i + ".png";

}

data=new dataObj();

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

momBodyOrange[i] = new Image();

momBodyOrange[i].src = "./img/bigSwim" + i + ".png";

momBodyBlue[i] = new Image();

momBodyBlue[i].src = "./img/bigSwimBlue" + i + ".png";

}

}

function gameloop() {

requestAnimationFrame(gameloop); //比起setInterval,setTimeout更加科学,但是有动态时间间隔

var now = Date.now();

deltaTime = now - lastTime;

lastTime = now;

if (deltaTime > 40) deltaTime = 40;

drawBackground();

ane.draw();

fruitMonitor();

fruit.draw();

ctx1.clearRect(0, 0, canWidth, canHeight);

mom.draw();

baby.draw();

momFruitsCollision();

momBabyCollision();

data.draw();

}

function onmouseMove(event) {

if (event.offsetX || event.layerX) {

mx = event.offsetX == undefined ? event.layerX : event.offsetX;

my = event.offsetY == undefined ? event.layerY : event.offsetY;

}

}

data.js

var dataObj = function() {

this.fruitNum = 0;

this.double = 1;

}

dataObj.prototype.reset=function() {

this.fruitNum = 0;

this.double = 1;

}

dataObj.prototype.draw = function() {

var w = can1.width;

var h = can1.height;

ctx1.fillStyle = "white";

ctx1.fillText = ("num" + this.fruitNum, w * 0.5, h - 50);

ctx1.fillText = ("double " + this.double, w * 0.5, h - 80);

}

collision.js

//judge the distance between mom fish and fruit

function momFruitsCollision() {

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

if (fruit.alive[i]) {

//calculate length

var l = calLength2(fruit.x[i], fruit.y[i], mom.x, mom.y);

if (l < 900) {

//fruit eaten

fruit.dead(i);

data.fruitNum++;

mom.momBodyCount++;

if(mom.momBodyCount>7){

mom.momBodyCount=7;

}

if (fruit.fruitType[i]=="blue") {

data.double = 2;

} //blue fruit

}

}

}

}

//mom baby collision

function momBabyCollision() {

var l = calLength2(mom.x, mom.y, baby.x, baby.y);

if (l < 900) {

//baby recover

baby.babyBodyCount = 0;

//data==>0

data.reset();

mom.momBodyCount=0;

}

}

在主循环中调用了吗

在主循环中调用了吗