为什么出不来结果，控制台也没有报错呢？？？？？？？
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
<title>在canvas中填充图片，画布</title>
</head>
<style>
.canvas{
border:1px solid #000;
display:block;
margin:0 auto;
/*width:100%;
height: 500px;*/
}
</style>
<body>
<canvas id='canvas'>
浏览器不支持canvas
</canvas>
</body>
<script>
var canvas=document.getElementById("canvas");
canvas.width=800;
canvas.height=800;
var context = canvas.getContext('2d');
window.onload=function(){
//在canvas中填充图片
// var backgroundImage=new Image();
// backgroundImage.src='back.jpg';
// backgroundImage.onload=function(){
// var pattern = context.createPattern(backgroundImage,'repeat');
// context.fillStyle=pattern;
// context.fillRect(0,0,800,800);
// }
// 在canvas中填充画布canvas
var backCanvas=createBackgroundCanvas();
var pattern=context.createPattern(backCanvas,'repeat');
context.fillStyle=pattern;
context.fillRect(0,0,800,800);
// alert('2');
}
function createBackgroundCanvas(){
var backCanvas = document.createElement('canvas');
backCanvas.width=100;
backCanvas.height=100;
var backCanvasContext = backCanvas.getContext('2d');
drowStar(backCanvasContext,150,300,400,400,20);
return backCanvas;
}
function drowStar(cxt,r,R,x,y,rot){
cxt.beginPath();
for(var i=0;i<5;i++){
cxt.lineTo(Math.cos((18 + i*72 - rot)/180*Math.PI)*R+x,-Math.sin((18 + i*72 - rot)/180*Math.PI)*R+y);
cxt.lineTo(Math.cos((54 + i*72 - rot)/180*Math.PI)*r+x,-Math.sin((54 + i*72- rot)/180*Math.PI)*r+y);
}
cxt.closePath();
context.lineWidth=3;
context.strokeStyle='#fb5';
context.fillStyle='#fb3';
context.fill();
}
</script>
</html>
