Rumah > Artikel > hujung hadapan web > 如何在javascript中绘制方块
如何在javascript中绘制方块
- 藏色散人asal
- 2021-04-08 14:57:332172semak imbas
在javascript中绘制方块的方法：首先创建一个HTML示例文件；然后在body中添加canvas标签；接着在head中添加script标签，用于输入javascript代码；最后通过draw方法绘制方块即可。
本文操作环境：windows7系统、javascript1.8.5&&html5版、Dell G3电脑。
html中插入javascript画矩形
<!DOCTYPE <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8"/>
<title>canvas元素示例</title>
<script>
function draw(id)
{
var canvas = document.getElementById(id);
if(canvas == null)
return false;
var context = canvas.getContext('2d');
context.fillStyle = "#eeefff";
context.fillRect(0,0,400,300);
context.fillStyle = "green";
context.strokeStyle = "red";
context.lineWidth = 1;
context.fillRect(50,50,100,100);
context.strokeRect(50,50,100,100);
}
</script>
</head>
<body οnlοad="draw('canvas');">
<h1>canvas中画矩形</h1>
<canvas id="canvas" width="400" height="300"/>
</body>
</html>
【推荐学习：javascript高级教程】
Atas ialah kandungan terperinci 如何在javascript中绘制方块. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!
Kenyataan：
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel sebelumnya：javascript怎么移除属性Artikel seterusnya：javascript如何设置只能输入数字