第11次课-使用JavaScript实现网页特效.ppt

了解JavaScript概念、基本语法及常用特效，行为的概念、行为的动作（常用动作）和事件（常用事件）以及Dreamweaver内置的主要行为；熟练掌握如何使用Dreamweaver编写JavaScript特效、创建行为；会用JavaScript和行为制作网页特效。 网页特效与交互的实现 学习目标 JavaScript概念、基本语法及常用特效 行为的概念、行为的常用动作和常用事件 使用JavaScript制作网页特效（难点） 使用Dreamweaver内置行为制作网页特效（难点） 本节重点 网页特效与交互的实现 1.1 JavaScript概念 JavaScript是由网景公司开发的一种跨平台，面向对象(object-oriented)的网页脚本语言(它是一种解释性语言，代码执行不需预编译 )，是目前流行的网页特效设计语言。 JavaScript代码可直接嵌入HTML文件中，随网页一起传送到客户端浏览器，然后通过浏览器来解释执行。 1 JavaScript概述 注意：Java 和 JavaScript 是相同的吗？－－不相同 Java是一种功能强大的高级编程语言。 JavaScript是给浏览器解释执行的脚本语言。 1.2 JavaScript可以为我们做什么 （1）JavaScript 为 HTML 设计师提供了一种编程工具 HTML 创作者往往都不是程序员，但是 JavaScript 却是一种只拥有极其简单的语法的脚本语言！几乎每个人都有能力将短小的代码片断放入他们的 HTML 页面当中。 (2) JavaScript 可以将动态的文本放入 HTML 页面 类似于这样的一段 JavaScript 声明可以将一段可变的文本放入 HTML 页面：document.write(h1 + name + /h1) 1 JavaScript概述 1.2 JavaScript可以为我们做什么 (3) JavaScript 可以对事件作出响应 可以将 JavaScript 设置为当某事件发生时才会被执行，例如页面载入完成或者当用户点击某个 HTML 元素时。 (4) JavaScript 可以读写 HTML 元素 JavaScript 可以读取及改变 HTML 元素的内容。 (5) JavaScript 可被用来验证数据 在数据被提交到服务器之前，JavaScript 可被用来验证这些数据。 (6) JavaScript 可被用来检测访问者的浏览器 JavaScript 可被用来检测访问者的浏览器，并根据所检测到的浏览器，为这个浏览器载入相应的页面。 (7) JavaScript 可被用来创建 cookies JavaScript 可被用来存储和取回位于访问者的计算机中的信息。 1 JavaScript概述 1.3 HTML网页中使用JavaScript的3种方法 1 JavaScript概述 方法1：在HTML标记中直接写入JavaScript代码 例： html head title在HTML标记中直接写入JavaScript代码/title /head body p onmouseover=alert(欢迎您学习JavaScript!)鼠标移过来/p /body /html 1.3 HTML网页中使用JavaScript的3种方法 1 JavaScript概述 方法2：将JavaScript代码放入script…/script标签中 例： html head title将JavaScript代码放入script标签中/title /head body script type=text/javascript alert(欢迎您学习JavaScript!); /script /body /html 1.3 HTML网页中使用JavaScript的3种方法 1 JavaScript概述 方法3：将代码独立存储为以 .js 为扩展名的文件，利用在head标签之间添加带src属性的script标签将该文件调入 例： html head title将JavaScript代码放入.js文件中/title script src=“welcome.js/script /head body /body /html welcome.js文件内容如下： document.write(欢迎您学习JavaScript!); 1.4 JavaScript如何与老的浏览器打交道 1 JavaScript概述 那些不支持 JavaScript 的浏览器会把脚本作为页