《JavaScript+jQuery交互式Web前端开发（第2版）》 教案-教学设计 第1章 初识JavaScript.doc

博学谷——让IT教学更简单，让IT学习更有效

PAGE12

PAGE4

《JavaScript+jQuery交互式Web前端开发（第2版）》

教学设计

课程名称：

授课年级：

授课学期：

教师姓名：

年月

课题名称

第1章初识JavaScript

计划课时

4课时

教学引入

Web前端开发必备的技术包括HTML（HypertextMarkupLanguage，超文本标记语言）、CSS（CascadingStyleSheets，串联样式表）和JavaScript。HTML和CSS用于创建美观且易于理解的网页布局和页面样式，但对于具有交互性和动态性的网页，JavaScript是必不可少的。因此，学习Web前端开发并实现更为复杂的交互效果和功能不仅需要掌握HTML和CSS的基础知识，还需要掌握JavaScript技术。本章将介绍JavaScript基本概念、JavaScript开发工具、JavaScript基本使用和变量等内容，让读者对JavaScript有初步的认识。

教学目标

使学生了解JavaScript基本概念，能够描述JavaScript的作用、由来、组成和特点

使学生了解浏览器的组成，能够描述浏览器的特点以及作用

使学生掌握下载和安装VisualStudioCode编辑器的方法，能够独立下载和安装编辑器

使学生掌握JavaScript代码的引入方式，能够灵活运用行内式、内部式、外部式的方式引入JavaScript代码

使学生掌握JavaScript常用的输入输出语句，能够灵活运用prompt()、alert()、document.write()、document.log()语句

使学生掌握JavaScript注释的使用，能够合理运用单行注释、多行注释增强代码的可读性

使学生了解什么是变量，能够描述变量的概念

使学生掌握变量的命名规则，能够根据变量的命名规则为变量命名

使学生掌握变量的声明与赋值，能够声明变量并为其赋值

教学重点

JavaScript代码引入方式

JavaScript常用的输入输出语句

JavaScript注释

变量的命名规则

变量的声明与赋值

教学难点

【案例】交换两个变量的值

教学方式

课堂教学以PPT讲授为主，并结合多媒体进行教学

教

学

过

程

第一课时

（JavaScript概述、JavaScript的由来、JavaScript的组成、JavaScript的特点、浏览器、代码编辑器）

一、通过直接引入的方式导入新课

学习任何一种语言，我们都需要了解其基本概念，JavaScript也不例外。本节课将对JavaScript的基本概念和开发工具进行讲解。通过本节课的学习，让大家对JavaScript有一个初步的认识，为后续学习交互式的开发奠定基础。

二、新课讲解

知识点1-JavaScript概述

教师通过PPT的方式讲解JavaScript概述。

JavaScript的概念和作用。

HTML、CSS和JavaScript的说明。

知识点2-JavaScript的由来

教师通过PPT的方式讲解JavaScript的由来。

为什么会出现JavaScript。

JavaScript是如何走向标准化的。

JavaScript和ECMAScript的关系。

知识点3-JavaScript的组成

教师通过PPT的方式讲解JavaScript的组成。

对JavaScript的3个组成部分进行介绍。

ECMAScript

DOM

BOM

知识点4-JavaScript的特点

教师通过PPT的方式讲解JavaScript的特点。

对JavaScript的3个特点进行介绍。

简单易用

跨平台

面向对象

知识点5-浏览器

教师通过PPT的方式讲解浏览器。

浏览器的概念。

常见的浏览器及其特点。

浏览器的组成。

知识点6-代码编辑器

教师通过PPT结合实际操作的方式讲解代码编辑器。

常见的JavaScript代码编辑器。

VisualStudioCode代码编辑器的特点。

下载和安装VisualStudioCode代码编辑器。

安装中文语言扩展。

安装LiveServer扩展。

创建项目文件夹。

三、归纳总结

教师回顾本节课所讲的知识，并通过测试题的方式引导学生解答问题并给予指导。

四、布置作业

教师通过高校教辅平台（）布置本节课的作业以及下节课的预习内容。

第二课时

（JavaScript初体验、JavaScript代码引入方式、JavaScript常用的输入输出语句、JavaScript注释）

一、复习巩固

教师