JavaScript互动页面讲解.pptxVIP

第9章JavaScript互动页面在前面的章节中我们已经用到Javascript进行页面互动。在第3章的3.1.2超级链接案例中，a标签的href属性使用了Javascript脚本，实现关闭窗口功能；在第5章的小试牛刀中，按钮元素的onclick动作使用了Javascript定义的事件。本章将系统介绍Javascript语言在互动页面制作中的应用，包括Javascript基础、流程控制和文档对象模型。了解JavaScript语言的基本语法理解DOM对象的基本概念和基本应用掌握JavaScript语言的流程控制能熟练运用JavaScript制作互动页面

内容安排JavasScript基础9.1流程控制9.2文档对象模型（DOM）9.3小试牛刀9.4

9.1JavasScript基础脚本（Script）实际上就是一段程序，用来完成某些特殊的功能。JavaScript是一种基于对象（Object）和事件驱动（EventDriven），并具有安全性能的脚本语言。它可与HTML、CSS一起实现在一个Web页面中链接多个对象，与Web客户交互的作用，从而开发出客户端的应用程序。JavaScript通过嵌入或调入到HTML文档实现其功能。JavaScript的开发环境很简单，不需要Java编译器，而是直接运行在浏览器中，因而倍受前端开发者的喜爱。

JavasScript基础在网页中插入脚本程序的方式在网页中插入JavaScript有以下几种形式：（1）在HTML文档中嵌入脚本程序在HTML文档中可同时嵌入多个JavaScript脚本程序。HTML中的嵌入的JavaScript脚本必须位于script与/script标签之间。脚本可被放置在HTML页面的body或head元素中，或者同时存在于这两个元素中。（2）引用JavaScript外部脚本文件如果已经存在一个JS脚本文件（以js为扩展名），则可以在head元素中使用script标记的src属性引用外部脚本文件的URL。采用引用脚本文件的方式，可以提高程序代码的利用率，格式为：scriptsrc=脚本文件名.js/script例如，在第5章的5.3.3Bootstrap模态框应用案例中，需要在头元素引入Bootstrap的基本js文件bootstrap.bundle.min.js。代码如下：scriptsrc=js/bootstrap.bundle.min.js/script

JavasScript基础9.1（3）在HTML标签的动作属性内添加脚本可以在元素标签内（通常为表单元素）添加动作属性脚本，以响应输入的事件。例如，在第5章的小试牛刀中，按钮元素的onclick动作使用了Javascript定义的事件。代码如下：inputtype=buttonvalue=注册onclick=window.open(../5.2/任务/task5-2.html,abc)/inputtype=buttonvalue=调查onclick=window.open(../5.2/案例5-2.html,abc)/（4）在超级链接中链接JavaScript脚本可以在超级链接中通过href属性链接到一个JavaScript脚本。其格式为：ahref=javascript:脚本热点文本/a例如，在第3章的3.1.2超级链接案例中，a标签的href属性使用了Javascript链接，点击链接会关闭窗口，代码如下:ahref=javascript:window.close()关闭窗口/a

JavasScript基础JavaScript语法JavaScript在运行过程中不需要单独编译，而是逐行解释执行，运行速度快。具有跨平台性，与操作环境无关，只依赖于浏览器本身，只要浏览器支持JavaScript就能正确执行。JavaScript语言对大小写是敏感的，所有的JavaScript语句都以分号“;”结束。1.JavaScript的注释JavaScript的注释用于对JavaScript代码进行解释，以提高程序的可读性。调试JavaScript程序时，还可以使用注释阻止代码块的执行。JavaScript有以下两种类型的注释：（1）单行注释单行注释以双斜杠开头（//）（2）多行注释多行注释以单斜杠和星号开头（/*），以星号和单斜杠结尾（*/）。

JavasScript基础9.12.JavaScript的数据类型JavaScript的基本数据类型主要有字符串（String）、数字（Number）、布尔（Boolean）、Null、Undefined，引用类型主要有数组和对象。（1）字符串（String）类型JavaScript的字符串可以是引号中的任意文本，可以使用单引号或双引号。（2）数字