[JS]第一课 写文字与警告框

编程

今天是我们学习编程的第一节正式课，编程是一项非常有趣的智力游戏，让我们赶紧开始今天的课程吧！^ _ ^

知识目标：

使用fillText方法在画布上写文字
使用ctx（画笔）的font属性设置文字的字体和大小
使用alert方法，在浏览器窗口中弹出警告框

项目目标：

在游戏界面上写出飞机大战游戏的分数

计算机英语

fill 填充、alert 警告 、text 文本、font 字体

练习一：画飞机

让我们先复习一下上节课的内容吧~ 画图片方法
（1）在画布上画四架飞机，四架飞机的位置为正方形的四个角

画飞机

在预留代码文件中编写代码：

enemy.onload=function(){
  ctx.drawImage(enemy, 100, 100);
  ctx.drawImage(enemy, 200, 100);
  ctx.drawImage(enemy, 100, 200);
  ctx.drawImage(enemy, 200, 200);
}

练习二：fillText方法---写文字

方法格式：

ctx.fillText(1, 2 , 3); 

1处写你要显示在页面上的文字，2处写文字位置的X坐标，3处写文字位置的Y坐标。
注意：fillText，T要大写
示例：

ctx.fillText("飞机大战",100,200);

写文字

练习三：ctx.font 设置文字的大小和字体

使用格式：

ctx.font = "1  2";

（1）ctx(画笔)的font属性用于设置文字的字体和大小；
（2）从上面可以看出，font属性后面是一个等号，等号后面是一对双引号，双引号里面用空格分成了两部分，在1处放置文字的大小，2处放置文字的字体；
（3）设置文字的大小为40px，字体为楷体，在画布（100,200）处写“飞机大战”，代码如下：

ctx.font=“40px  楷体”;
ctx.fillText(“飞机大战”,100,200);

练习三：警告框（alert方法）

基本格式：

alert（     ）;

alert方法用于在浏览器中弹出一个警告框；
括号中填写要在警告框中显示的内容；
示例：

alert("你好，世界！");

运行代码，在浏览器中会弹出一个警告框如下：

警告框

巩固练习

1.将你好朋友的名字写在画布上任意位置，要求：使用隶书，字体大小为40px；
2.在警告框上显示你好朋友的名字；