谁帮我帮我看一段 html5 canvas的代码 不知道哪错了，显示不出效果
<html><head></head><body><canvasid="mc"width="400"height="280"style="border:1pxsolidb...
<html>
<head>
</head>
<body>
<canvas id="mc" width="400" height="280"
style="border:1px solid black"></canvas>
<script type="text/javascript">
//获取canvas元素对应的DOM对象
var canvas=document.getElementById=('mc');
//获取在canvas上绘图的CanvasRenderingContext2D对象
var ctx=canvas.getContext('2d');
//设置填充颜色
ctx.fillStyle = "red";
//填充矩形
ctx.fillRect(30,20,120,60);
//设置线条颜色
ctx.strokeStyle = "#ff0";
//填充一个矩形
ctx.fillRect|(80,60,120,60);
//设置线条颜色
ctx.strokeStyle="#00f";
//设置线条宽度
ctx.lineWidth = 10;
//绘制一个矩形边框
ctx.strokRect|(30,130,120,60);
//设置线条颜色
ctx.strokeStyle="#0ff";
//设置线条宽度
ctx.strokeStyle = "round";
//绘制一个举行边框
ctx.strokRect|(80,160,120,60);
//设置线条颜色
ctx.strokeStyle="#f0f";
//设置线条宽度
ctx.strokeStyle = "bevel";
//绘制一个举行边框
ctx.strokRect|(130,190,120,60);
</script>
</body>
</html> 展开
<head>
</head>
<body>
<canvas id="mc" width="400" height="280"
style="border:1px solid black"></canvas>
<script type="text/javascript">
//获取canvas元素对应的DOM对象
var canvas=document.getElementById=('mc');
//获取在canvas上绘图的CanvasRenderingContext2D对象
var ctx=canvas.getContext('2d');
//设置填充颜色
ctx.fillStyle = "red";
//填充矩形
ctx.fillRect(30,20,120,60);
//设置线条颜色
ctx.strokeStyle = "#ff0";
//填充一个矩形
ctx.fillRect|(80,60,120,60);
//设置线条颜色
ctx.strokeStyle="#00f";
//设置线条宽度
ctx.lineWidth = 10;
//绘制一个矩形边框
ctx.strokRect|(30,130,120,60);
//设置线条颜色
ctx.strokeStyle="#0ff";
//设置线条宽度
ctx.strokeStyle = "round";
//绘制一个举行边框
ctx.strokRect|(80,160,120,60);
//设置线条颜色
ctx.strokeStyle="#f0f";
//设置线条宽度
ctx.strokeStyle = "bevel";
//绘制一个举行边框
ctx.strokRect|(130,190,120,60);
</script>
</body>
</html> 展开
1个回答
展开全部
你这代码是手打的吗？
var canvas=document.getElementById=('mc');
应该是
var canvas=document.getElementById('mc');
多了一个等号
所有
ctx.fillRect|
后面多了一个 | （竖杠），应该去掉
所有
strokRect
少了一个 e，应该是
strokeRect
<html>
<head>
</head>
<body>
<canvas id="mc" width="400" height="280"
style="border:1px solid black"></canvas>
<script type="text/javascript">
//获取canvas元素对应的DOM对象
var canvas=document.getElementById('mc');
//获取在canvas上绘图的CanvasRenderingContext2D对象
var ctx=canvas.getContext('2d');
//设置填充颜色
ctx.fillStyle = "red";
//填充矩形
ctx.fillRect(30,20,120,60);
//设置线条颜色
ctx.strokeStyle = "#ff0";
//填充一个矩形
ctx.fillRect(80,60,120,60);
//设置线条颜色
ctx.strokeStyle="#00f";
//设置线条宽度
ctx.lineWidth = 10;
//绘制一个矩形边框
ctx.strokeRect(30,130,120,60);
//设置线条颜色
ctx.strokeStyle="#0ff";
//设置线条宽度
ctx.strokeStyle = "round";
//绘制一个举行边框
ctx.strokeRect(80,160,120,60);
//设置线条颜色
ctx.strokeStyle="#f0f";
//设置线条宽度
ctx.strokeStyle = "bevel";
//绘制一个举行边框
ctx.strokeRect(130,190,120,60);
</script>
</body>
</html>
追问
谢谢
是手打的
但复制粘贴了几次就出现了下面这两个问题：
所有
ctx.fillRect|
后面多了一个 | （竖杠），应该去掉
所有
strokRect
少了一个 e，应该是
strokeRect
还有问一下：
1、你那个图片用的是什么编译器，能显示标签错误吗
1、你的代码是怎么贴出来的，那个背景怎么弄出来的，知道现在提供那个背景吗？
2、var canvas=document.getElementById=('mc'); 这种错误太坑爹了 你有什么避免经验吗？
追答
1、哪个图片？
2、那是百度近期添加的代码高亮，你提问或回答的时候，上面那排多了一个“代码”。
3、调试 Javascript 代码我用 Firefox 加上 Web Developer 和 Firebug 插件，一般错误都能报告。
不过你这段代码 Firefox 没有报 = 和 | 错误，我是多看了几眼看出来的。
本回答由提问者推荐
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
