firefox4还不支持canvas吗？
firefox4还不支持canvas吗？
提问于 2011-06-11 15:24:16
我尝试了以下代码，但firefox4没有显示任何内容。
<script type="text/javascript">
var canvas = document.getElementById('canvas1');
var context = canvas.getContext('2d');
context.strokeStyle = '#990000';
context.strokeRect(20,30,100,50);
alert(context);
</script>
<canvas id="canvas1" width="200px" height="200px">Your browser does not support canvas </canvas>这段代码在body标记中。
回答 3
Stack Overflow用户
回答已采纳
发布于 2011-06-11 22:27:05
您必须了解浏览器执行文件的顺序。下面是浏览器读取此代码的方式：
<script type="text/javascript">
var canvas = document.getElementById('canvas1');
var context = canvas.getContext('2d');
context.strokeStyle = '#990000';
context.strokeRect(20,30,100,50);
alert(context);
</script>
<canvas id="canvas1" width="200px" height="200px">Your browser does not support canvas </canvas>canvas主体标记开始
- 脚本标记开始
- 查找ID为
canvas1
- Canvas1的元素不存在，将Canvas保存为null(i take as nothing)
- Context =
nothing.getContext('2d');
alert(nothing)
- End Script
- Begin Canvas，因为
不显示内部的内容<代码>H121结束主体标记<代码>H222<代码>G223
因此，要使其可见，您只需像这样编辑您的代码：
<!DOCTYPE HTML>
<html>
<head>
<title>Sample by RHNVRM(aka rohan verma)</title>
</head>
<body>
<!--Canvas-->
<canvas id="canvas1" width="200px" height="200px">Your browser does not support canvas </canvas>
<!--Begin Script-->
<script>
var canvas = document.getElementById('canvas1');
var context = canvas.getContext('2d');
context.strokeStyle = '#990000';
context.strokeRect(20,30,100,50);
alert(context);
</script>
</body>
</html>注意：当使用Javascript时，不需要在HTML5中提及它。
Stack Overflow用户
发布于 2011-06-11 15:29:20
根据这个搜索，http://www.google.co.uk/search?q=firefox4+canvas Firefox4支持canvas。
Stack Overflow用户
发布于 2011-06-11 15:31:00
这对我来说很好用：
<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>
<canvas id="canvas1" width="200px" height="200px">Your browser does not support canvas </canvas>
<script type="text/javascript">
var canvas = document.getElementById('canvas1');
var context = canvas.getContext('2d');
context.strokeStyle = '#990000';
context.strokeRect(20,30,100,50);
alert(context);
</script>
<body>
</body>
</html>页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/6314691
复制相关文章
相似问题
腾讯云开发者
Copyright © 2013 - 2026 Tencent Cloud. All Rights Reserved. 腾讯云 版权所有
深圳市腾讯计算机系统有限公司 ICP备案/许可证号：粤B2-20090059 
粤公网安备44030502008569号
腾讯云计算（北京）有限责任公司 京ICP证150476号 | 京ICP备11018762号