第01章 JavaScript基础教学板书.docx
《第01章 JavaScript基础教学板书.docx》由会员分享，可在线阅读，更多相关《第01章 JavaScript基础教学板书.docx（17页珍藏版）》请在冰豆网上搜索。
第01章JavaScript基础教学板书
第1章JavaScript基础
JavaScript是一种基于对象的脚本编程语言，从本章中你可以了解到JavaScript是如何以及为何出现的，从它的开始到如今涵盖各种特性的实现，本章还介绍了JavaScript的具体应用及JavaScript脚本语言的开发环境。
●JavaScript和客户端脚本编程的起源
●在Web页面中使用JavaScript的方法
●编写和调试JavaScript的几种常用工具
1.1JavaScript的历史与现状
1.1.1JavaScript的发展
当Internet普及越来越广时，对于开发客户端脚本的需求也逐渐增大。
此时，大部分Internet用户仅仅通过28.8kbit/s的Modem来连接到网络，即使这时网页已经不断地变得更大和更复杂。
加剧用户痛苦的是，仅仅为了简单的表单有效性验证，就要与服务器进行多次的往返交互。
设想一下，用户填写完一个表单，点击提交按钮，等待30秒后，看到的却是一条告诉你忘记填写一个必要的字段的信息。
那时正处于技术革新最前沿的Netscape，开始认真考虑开发一种客户端语言来处理简单的问题。
当时为Netscape工作的BrendanErich，开始着手为即将在1995年发行的NetscapeNavigator2.0开发一个称之为LiveScript的脚本语言，当时的目的是同时在浏览器和服务器使用它。
Netscape与Sun公司联手及时完成了LiveScript的实现。
就在NetscapeNavigator2.0即将正式发布前，Netscape将其更名为JavaScript，目的是为了利用Java这个Internet时髦词汇。
Netscape的这一决定也实现了当初的意图，JavaScript从此变成了因特网的必备组件。
因为JavaScript1.0如此成功，Netscape在Navigator3.0中发布了JavaScript1.1版本。
恰巧那个时候，微软决定进军浏览器市场，发布了IE3.0b并搭载了一个JavaScript的克隆版，叫做Jscript（这样命名是为了避免与Netscape潜在的许可纠纷）。
微软步入浏览器领域的这重要一步当然推动了JavaScript的进行一步发展。
在微软进入后，有3种不同的JavaScript版本同时存在：
NetscapeNavigator3.0中的JavaScript、IE中的JScript以及CEnvi中的ScriptEase。
与其他编程语言不同的是，JavaScript并没有一个标准来统一其语法或特性，而这3种不同的版本恰恰突出了这个问题，随着用户担心的增加，这个语言标准化显然已经势在必行。
1997年，JavaScript1.1作为一个草案提交给ECMA（欧洲计算机制造商协会）。
第39技术委员会（TC39）被委派来“标准化一个通用、跨平台、中立于厂商的脚本语言的语法和语义”。
由来自Netscape、Sun、微软、Borland和其他一些对脚本编程感兴趣的公司的程序员组成的TC39锤炼出了ECMA-262，该标准定义了叫做ECMAScript的全新脚本语言。
在1998年，该标准成为了国际ISO标准（ISO/IEC16262）。
这个标准仍然处于发展之中。
在2005年12月，ECMA发布ECMA-357标准（ISO/IEC22537）出台，主要增加对扩展标记语言XML的有效支持。
从此，Web浏览器就开始努力（虽然有着不同成都的成功和失败）将ECMAScript作为JavaScript实现的基础。
1.1.2JavaScript在HTML中的作用
HTML超文本标识语言可用来制作所需的Web网页，通过HTML符号的描述就可以实现文字、表格、声音、图像、动画等多媒体信息的检索。
然而采用单纯的HTML技术存在一定的缺陷，那就是它只能提供一种静态的信息资源，缺少动态的效果。
这里所说的动态效果分为两种：
一种是客户端的动态效果，就是我们看到的Web页面是活动的，可以处理各种事件，例如鼠标移动时图片会有翻转效果等：
另一种是客户端与服务器端的交互产生的动态效果。
实现客户端的动态效果，JavaScript无疑是一件适合的工具。
JavaScript的出现，使得信息和用户之间不仅只是一种显示和浏览的关系，而是实现了一种实时的、动态的、交互性的表达能力。
从而基于CGI静态的HTML页面将可提供动态实时信息，并对客户操作进行反应的Web页面的取代。
JavaScript脚本正是满足这种需求而产生的语言。
JavaScript是一种基于对象和事件驱动并具有安全性能的脚本编写语言，它采用小程序段的方式实现编程，像其它脚本语言一样，JavaScript同样已是一种解释性语言，它提供了一个简易的开发过程。
它的基本结构形式与C、C++、VB、Delphi十分类似。
但它不像这些语言一样，需要先编译，而是在程序运行过程中被逐行地解释。
在HTML基础上，使用JavaScript可以开发交互式Web网页，它是通过嵌入或调入在标准的HTML语言中实现的。
JavaScript与HTML标识结合在一起，实现在一个网页中链接多个对象，与网络客户交互作用，从而可以开发客户端的应用程序，其作用主要体现在以下几个方面。
动态性。
JavaScript是动态的，它可以直接对用户或客户输入做出响应，无须经过Web服务程序。
它对用户的反映响应，是采用以事件驱动的方式进行的。
所谓事件驱动，就是指在主页中执行了某种操作所产生的动作，就称为“事件”。
比如按下鼠标、移动窗口、选择菜单等都可以视为事件。
当事件发生后，可能会引起相应的事件响应。
跨平台。
JavaScript是依赖于浏览器本身，与操作环境无关，只要能运行浏览器的计算机，并支持JavaScript的浏览器就可以正确执行。
相对安全性。
JavaScript是客户端脚本，通过浏览器解释执行。
它不允许访问本地的硬盘，并且不能将数据存入到服务器上，不允许对网络文档进行修改和删除，只能通过浏览器实现信息浏览或动态交互，从而有效地防止数据的丢失。
节省客户端与服务器端的交互时间。
随着WWW的迅速发展。
有许多服务器提供的服务要与客户端进行交互，如确定用户的身份、服务的内等等，这项工作通常由CGI/PERL编写相应的接口程序与用户进行交互来完成。
很显然，通过网络与用户的交互过程一方面增大了网络的通信量，另一方面影响了服务器的服务性能。
服务器为一个用户运行一个CGI时，需要一个进程为它服务，它要占用服务器的资源（如CPU服务、内存耗费等），如果用户填表出现错误，交互服务占用的时间就会相应增加。
被访问的热点主机与用户交互越多，服务器的性能影响就越大。
而JavaScript是一种基于客户端浏览器的语言，用户在浏览中填表、验证的交互过程只是通过浏览器对调入HTML文档中的JavaScript源代码进行解释执行来完成的，即使是必须调用CGI的部分，浏览器只将用户输入验证后的信息提交给远程的服务器，大大减少了服务器的开销。
1.1.3Ajax
Ajax即“AsynchronousJavaScriptandXML”（异步JavaScript和XML），Ajax并非缩写词，而是由JesseJamesGaiiett创造的名词，是指一种创建交互式网页应用的网页开发技术。
Ajax描述了把JavaScript和Web服务器组合起来的编程范型，JavaScript是Ajax的核心技术之一，在Ajax技术架构中起着不可替代的作用。
Ajax是一种Web应用程序开发的手段，它采用客户端脚本与Web服务器交换数据，所以不必采用中断交互的完整页面刷新，就可以动态地更新Web页面。
使用Ajax技术可以不必刷新整个页面，只是对页面的局部进行更新，而且还可以节省网络宽带，提高网页加载速度，从而缩短用户等待时间，改善用户的操作体验。
1.2JavaScript的运行
1.2.1JavaScript代码的装载与解析
当一个HTML页面被装载时，它会装载并解析过程中遇到的任何JavaScript。
Script标签可以出现在文档的head中，也可以出现在body中。
如果有指向外部JavaScript文件的链接，它会先装载该链接，再继续解析页面。
嵌入第三方的脚本时，如果远程服务器因负担过重而无法及时返回文件，就有可能导致页面的装载时间显著变长。
代码解析是浏览器取得代码并将之转化成可执行代码的过程。
这个过程的第一步是检查代码的语法是否正确，如果不正确，过程会立即失败。
如果一个包含语法错误的函数被运行，将很可能会得到一条错误消息，显示函数还没定义。
当浏览器确认代码合法之后，它会解析script块中所有的变量和函数。
如果要调用的函数来自其他script块或者其他文件，请确保它在当前script元素之前装载。
1.2.2在HTML页面中嵌入JavaScript
JavaScript的脚本包括在HTML中，它成为HTML文档的一部分，与HTML标识相结合，构成动态的、能够交互的网页。
1．引入JavaScript脚本代码到HTML文档中
如果需要把一段JavaScript插入HTML页面，我们需要使用script标签（同时使用type属性来定义脚本语言）。
这样，和就可以告诉浏览器JavaScript从何处开始，到何处结束。
浏览器载入嵌有JavaScript脚本的HTML文档时，能自动识别JavaScript脚本代码起始标记和结束标记，并将其间的代码按照解释JavaScript脚本代码的方法加以解释，然后将解释结果返回HTML文档并在浏览器窗口显示。
【例1-1】将JavaScript脚本嵌入到HTML文档中。
JavaScriptTest
document.write（"HelloWorld!
"）;
在例1-1的代码中除了script标记对之间的内容外，都是最基本的HTML代码，可见script标记对将JavaScript脚本代码封装并嵌入到HTML文档中。
script标记对将JavaScript脚本代码封装，同时告诉浏览器其间的代码为JavaScript脚本代码，然后调用document文档对象的write（）方法写字符串到HTML文档中。
下面重点介绍script标记的几个属性：
（1）language属性：
用于指定封装代码的脚本语言及版本，有的浏览器还支持perl、VBScript等，所有浏览器都支持JavaScript（当然，非常老的版本除外），同时language属性默认值也为JavaScript；
（2）type属性：
指定script标记对之间插入的脚本代码类型；
（3）src属性：
用于将外部的脚本文件内容嵌入到当前文档中，一般在较新版本的浏览器中使用，使用JavaScript脚本编写的外部脚本文件必须使用.js为扩展名，同时在script标记对中不包含任何内容，如下：
下面讨论