2014-2015学年-说课-JavaScript基础语法.ppt

《2014-2015学年-说课-JavaScript基础语法.ppt》由会员分享，可在线阅读，更多相关《2014-2015学年-说课-JavaScript基础语法.ppt（37页珍藏版）》请在淘文阁 - 分享文档赚钱的网站上搜索。

1、辽中县职业教育中心辽中县职业教育中心2014-20152014-2015学年学年第二学期第二学期北校区教师说课比赛北校区教师说课比赛 说课内容：说课内容：JavaScriptJavaScript基础语法基础语法 说课教师：侯腾飞说课教师：侯腾飞 所属部门：计算机教研室所属部门：计算机教研室 本次说课内容简介本次说课内容简介n与北大青鸟合作办学简介与北大青鸟合作办学简介nBEWEBBEWEB课程体系简介课程体系简介n本课程相关内容说明本课程相关内容说明n当前学生学习情况当前学生学习情况n本章教学安排本章教学安排n教法与学法教法与学法n教学过程简介教学过程简介n课后学生学习反馈课后学生学习反馈与北

2、大青鸟合作办学简介与北大青鸟合作办学简介学校提供环境、教师学校提供环境、教师学生服从学校管理学生服从学校管理北大青鸟提供教材及课件北大青鸟提供教材及课件北大青鸟负责和学生签署顶岗实习就业协议北大青鸟负责和学生签署顶岗实习就业协议北大青鸟承诺：当学生完成所安排的课程的学习，北大青鸟承诺：当学生完成所安排的课程的学习，并通过相关考试，北大青鸟将负责并通过相关考试，北大青鸟将负责 安排顶岗实习。安排顶岗实习。BEWEB课程体系程体系第二学期第二学期第一学期第一学期计算机与网络基础计算机与网络基础美术基础美术基础使用使用Photoshop设计网页设计网页使用使用Dreamweaver制作网页制作网页网

3、站配色与布局网站配色与布局使用使用Illustrator设计图形设计图形第第一一学学年年第三学期第三学期第四学期第四学期使用使用CSS+DIV制作网页制作网页制作制作JavaScript脚脚本特效本特效制作制作Flash动画动画毕业设计毕业设计使用使用PHP+MySql开发网站开发网站创意设计项目实战创意设计项目实战第第二二学学年年职职业业导导向向训训练练手手册册（软软技技能能）第三学年第三学年顶岗实习顶岗实习本课程相关内容说明本课程相关内容说明nJavaScriptJavaScript概念概念 JavaScriptJavaScript是一种轻型的、解释型的程序设计语言是一种轻型的、解释型的程

4、序设计语言 具有：面向对象的功能具有：面向对象的功能 可以用来：可以用来：表示表示WebWeb浏览器窗口及其内容的对象浏览器窗口及其内容的对象 客户端程序编写客户端程序编写 达到：达到：网页从静态到动态的效果网页从静态到动态的效果本课程相关内容说明本课程相关内容说明n训练技能训练技能 使用使用JavaScript实现表表单验证 使用使用JavaScript制作网制作网页广告特效广告特效 使用使用JavaScript制作制作弹出窗口特效出窗口特效 使用使用JavaScript实现时钟特效特效 使用使用JavaScript实现级联显示功能示功能 使用使用JavaScript+CSS实现CSS样式特

5、效式特效本课程相关内容说明本课程相关内容说明n本课程设计思路本课程设计思路 本课程总共本课程总共1313章，分为章，分为JavaScriptJavaScript基础语法、程基础语法、程序逻辑控制、特效制作、表单验证及综合应用五序逻辑控制、特效制作、表单验证及综合应用五部分。具体章节课时安排如下：部分。具体章节课时安排如下：第一章：第一章：6 6课时；第二章：课时；第二章：6 6课时；第三章：课时；第三章：6 6课时课时 第四章：第四章：6 6课时；第五章：课时；第五章：6 6课时；第六章：课时；第六章：6 6课时课时 第七章：第七章：6 6课时；第八章：课时；第八章：8 8课时；第九章：课时；

6、第九章：8 8课时课时 第十章：第十章：1010课时；第十一章：课时；第十一章：8 8课时；课时；第十二章：第十二章：8 8课时；第十三章：课时；第十三章：1212课时。课时。当前所教班级学生情况当前所教班级学生情况n春季班学生和秋季班学生春季班学生和秋季班学生n男生和女生男生和女生n走读生和住宿生走读生和住宿生n爱学习的和不爱学习的爱学习的和不爱学习的n爱劳动的和不爱劳动的爱劳动的和不爱劳动的本章教学安排本章教学安排n本章共分为两节，每节又都包含五小节本章共分为两节，每节又都包含五小节n第一节：我的第一个第一节：我的第一个JSJS程序（程序（2 2课时）课时）n 为什么要学习为什么要学习Ja

7、vaScriptJavaScriptn 什么是什么是JavaScriptJavaScriptn JavaScript JavaScript的基本结构的基本结构n JavaScript JavaScript简单应用简单应用n 实现案例实现案例我的第一个我的第一个JSJS程序程序n第二节：计算每日温差（第二节：计算每日温差（2 2课时）课时）n 变量的声明和赋值变量的声明和赋值n 数据类型数据类型n 运算符运算符n 注释注释n 实现案例实现案例计算每日温差计算每日温差n上机实战上机实战（2 2课时）课时）教法与学法教法与学法n案例分析法案例分析法n任务驱动法任务驱动法n分组讨论法分组讨论法教学过程

8、简介教学过程简介n上课问好上课问好n安全教育：安全教育：n 禁止吃零食禁止吃零食n 禁止插座充电禁止插座充电n 禁止使用化妆用品禁止使用化妆用品n 禁止带有手脚上的交流禁止带有手脚上的交流n导入导入n多媒体讲解多媒体讲解本章任务本章任务n唐诗鉴赏唐诗鉴赏n问候语显示问候语显示n根据输入的学生成绩计算平均分根据输入的学生成绩计算平均分n计算员工工资计算员工工资本章目标本章目标n掌握掌握JavaScript的基本结构的基本结构n掌握掌握JavaScript在页面中的应用在页面中的应用n掌握脚本的基本语法掌握脚本的基本语法示例文字示例文字回顾回顾HTML-1n常用的常用的HTML标签有哪些？标签有哪

9、些？n请说说表格的基本结构以及请说说表格的基本结构以及跨行、跨列的用法跨行、跨列的用法？单元格内容单元格内容 单元格内容单元格内容 标签名称 说说 明明界定一个完整的界定一个完整的HTML文档文档定义文档的头部定义文档的头部设定显示在浏览器左上方的标题内容设定显示在浏览器左上方的标题内容定义文档的主体定义文档的主体定义文字的字体、字号和颜色定义文字的字体、字号和颜色定义文本的段落定义文本的段落在文本中插入一个换行在文本中插入一个换行插入一张图像插入一张图像插入一条水平分隔线插入一条水平分隔线定义超级链接定义超级链接实现页面中的滚动文字或图片实现页面中的滚动文字或图片回顾回顾HTML-2n请简述

10、表单的基本结构？常用表单元素有哪些？请简述表单的基本结构？常用表单元素有哪些？n如何使用样式表定义统一的字体外观和文本框的细边如何使用样式表定义统一的字体外观和文本框的细边框样式？框样式？表单的基本结构：表单的基本结构：常用的表单元素有：常用的表单元素有：文本框（文本框（text）、密码框（）、密码框（password）、单选按钮（）、单选按钮（radio）、）、复选框（复选框（checkbox）、列表框（）、列表框（和和）、）、按钮（按钮（button、submit和和reset）、多行文本框（）、多行文本框（）。）。统一的字体外观：统一的字体外观：font-family:黑体黑体;font

11、-size:18px;color:#FF0000;细边框样式：细边框样式：border-width:1px;border-style:solid;为什么要学习为什么要学习JavaScriptn表单验证表单验证示例：贵美网上商城注册示例：贵美网上商城注册n页面动态效果页面动态效果示例：层的切换、树形菜单示例：层的切换、树形菜单JavaScript的组成的组成DOMJavaScriptECMAScriptBOMnECMAScript:核心语法核心语法nDOM:文档对象模型文档对象模型nBOM:浏览器对象模型浏览器对象模型ECMAScriptn语法标准语法标准语法语法变量和数据类型变量和数据类型运算

12、符运算符逻辑控制语句逻辑控制语句关键字、保留字关键字、保留字对象对象n编码遵循编码遵循ECMAScript标准标准浏览器对象模型浏览器对象模型nBOM文档对象模型文档对象模型nDOM脚本的执行原理脚本的执行原理应用应用服务器服务器IEIE解析解析HTML标签和标签和JavaScript脚本脚本从服务器端下载含从服务器端下载含JavaScript的页面的页面返回响应返回响应客户端请求含客户端请求含JS的页面的页面发送请求发送请求1用户输入用户输入23JavaScript的基本语法的基本语法 输出输出Hello World!document.write(Hello World!);JavaScri

13、pt的使用方式的使用方式nHtml页面内嵌页面内嵌JS代码代码n外部外部JS文件文件n简短缩写方式简短缩写方式常见的输入和输出常见的输入和输出n警告（警告（alert）alert(“(“提示信息提示信息”);”);n提示（提示（prompt）prompt(“(“提示信息提示信息”,“”,“输入框的默认信息输入框的默认信息”);”);演示案例演示案例n需求描述需求描述弹出弹出“我的第一个我的第一个JSJS程序程序”消息框消息框演示案例演示案例n思路分析思路分析创建创建HTML文件文件在在中添加中添加使用使用alert()弹出消息出消息JavaScript核心语法核心语法核心语法核心语法数据类型数

14、据类型变量变量运算符号运算符号控制语句控制语句注释注释语法约定语法约定输入输入/输出输出变量的声明和赋值变量的声明和赋值 var count;count=5;定义变量定义变量赋值赋值“var”用于声明变量的关键字用于声明变量的关键字“count”变量名变量名var x,y,z=10;var count=10;同时声明和赋值变量同时声明和赋值变量声明多个变量声明多个变量数据类型数据类型n数据类型数据类型undefinedbooleanstringnumberNull使用使用typeof函数函数查看数据看数据类型型ntypeof运算符返回值如下：运算符返回值如下：undefined：变量被声明后，

15、但未被赋值：变量被声明后，但未被赋值string：用单引号或双引号来声明的字符串用单引号或双引号来声明的字符串boolean：true或或falsenumber：整数或浮点数整数或浮点数object：javascript中的对象、数组和中的对象、数组和null类型转换类型转换nparseInt(String)将字符串转换为整型数字将字符串转换为整型数字 如如:parseInt (“86”)将字符串将字符串“86”转换为整型值转换为整型值86nparseFloat(String)将字符串转换为浮点型数字将字符串转换为浮点型数字 如如:parseFloat(“34.45”)将字符串将字符串“34.

16、45”转换为浮点值转换为浮点值34.45运算符号运算符号类型运算符运算符算术运算符算术运算符+-*/%+-赋值赋值运算符运算符=比比较较运算符运算符 =!=逻辑逻辑运算符运算符&|!注释注释alert(恭喜你！注册会员成功恭喜你！注册会员成功);/在页同上弹出注册会员成功的提示框在页同上弹出注册会员成功的提示框/*使用使用for循环运行循环运行“document.write(Hello World);”5次次使用使用document.write在页面上输出在页面上输出“Hello World”*/n单行注释以单行注释以/开始，以行末结束，例如：开始，以行末结束，例如：n多行注释以多行注释以 /

17、*开始，以开始，以 */结束，符号结束，符号 /*/指指示中间的语句是该程序中的注释。例如：示中间的语句是该程序中的注释。例如：演示案例演示案例n需求描述需求描述需要计算一天的温差（温差需要计算一天的温差（温差=当日的最高气温当日的最高气温-当日的当日的最低气温）。最低气温）。在页面接收用户输入的最高气温和最低气温，计算后在页面接收用户输入的最高气温和最低气温，计算后在页面显示结果在页面显示结果演示案例演示案例n思路分析思路分析prompt()函数接收气温函数接收气温值计算温差计算温差打印温差打印温差总结总结n大家简述一下大家简述一下JavaScript脚本的基本结构？脚本的基本结构？nJavaScript在页面中的应用有哪几种？请举例在页面中的应用有哪几种？请举例ntypeof返回类型都有哪些？返回类型都有哪些？总结并布置作业总结并布置作业