Javascript教程--从入门到精通 .pdf

上传人:Che****ry 文档编号:34233456 上传时间:2022-08-15 格式:PDF 页数:45 大小:1.04MB
返回 下载 相关 举报
Javascript教程--从入门到精通 .pdf_第1页
第1页 / 共45页
Javascript教程--从入门到精通 .pdf_第2页
第2页 / 共45页
点击查看更多>>
资源描述

《Javascript教程--从入门到精通 .pdf》由会员分享,可在线阅读,更多相关《Javascript教程--从入门到精通 .pdf(45页珍藏版)》请在taowenge.com淘文阁网|工程机械CAD图纸|机械工程制图|CAD装配图下载|SolidWorks_CaTia_CAD_UG_PROE_设计图分享下载上搜索。

1、1 Javascript教程 - 从入门到精通【完整版】(作者:未知,来源:互联网整理: Alone )JavaScript教程语言概况Internet时代,造就了我们新的工作和生活方式,其互联性、开放性和共享信息的模式,打破了传统信息传播方式的重重壁垒,为我们带来了新的机遇。随着计算机和信息时代的到来,人类社会前进的脚步在逐渐加快,每一天都有新的事情发生,每一天都在创造着奇迹。随着Internet技术的突飞猛进,各行各业都在加入Internet的行业中来。无论从管理方面,还是从商业角度来看,Internet都可以带来无限生机。通过Internet,可以实现地区、集体乃至个人的连接,从而达到一

2、种“统一的和谐”。那么怎样把自己的或公司的信息资源加入到WWW 服务器,是广大用户日益关心的问题。采用超链技术(超文本和超媒体技术)是实现这个目标最简单的、最快速的手段和途径。具体实现这种手段的支持环境,那就是HTML 超文本标识语言。通过它们可制作所需的Web 网页。通过超文本 (Hyper Text)和超媒体 (Hyper Media) 技术结合超链接 (Hyper link)的链接功能将各种信息组织成网络结构(web),构成网络文档 (Document),实现 Internet上的“漫游”。通过HTML 符号的描述就可以实现文字、表格、声音、图像、动画等多媒体信息的检索。然而采用这种超链

3、技术存在有一定的缺陷,那就是它只能提供一种静态的信息资源,缺少动态的客户端与服务器端的交互。虽然可通过CGI(Common Gateway Interface) 通用网关接口实现一定的交互,但由于该方法编程较为复杂,因而在一段时间防碍了Internet技术的发展。而 JavaScript的出现,无凝为 Internet网上用户带来了一线生机。可以这样说 ,JavaScript的出现是时代的需求 , 是当今的信息时代造就了JavaScript 。JavaScript的出现,它可以使得信息和用户之间不仅只是一种显示和浏览的关系,而是实现了一种实时的、 动态的、可交式的表达能力。从而基于CGI静态的

4、 HTML 页面将被可提供动态实时信息,并对客户操作进行反应的Web页面的取代。JavaScript脚本正是满足这种需求而产生的语言。它深受广泛用户的喜爱的欢迎。它是众多脚本语言中较为优秀的一种,它与 WWW的结合有效地实现了网络计算和网络计算机的蓝图。无凝Java 家族将占领 Internet网络的主导地位。因此,尽快掌握JavaScript脚本语言编程方法是我国广大用户日益关心的。一、什么是 JavaScriptJavaScript是一种基于对象 (Object) 和事件驱动 (Event Driven)并具有安全性能的脚本语言。使用它的目的是与HTML 超文本标记语言、 Java 脚本语

5、言(Java 小程序)一起实现在一个 Web页面中链接多个对象, 与 Web客户交互作用。从而可以开发客户端的应用程序等。它是通过嵌入或调入在标准的HTML 语言中实现的。它的出现弥补了HTML 语言的缺陷,它是 Java 与 HTML 折衷的选择,具有以下几个基本特点:脚本编写语言JavaScript是一种脚本语言,它采用小程序段的方式实现编程。像其它脚本语言一样,JavaScript同样已是一种解释性语言,它提供了一个易的开发过程。它的基本结构形式与C、C+ 、VB 、Delphi 十分类似。但它不像这些语言一样,需要先编译,而是在程序运行过程中被逐行地解释。它与HTML 标识结合在一起,

6、从而方便用户的使用操作。基于对象的语言JavaScript是一种基于对象的语言,同时以可以看作一种面向对象的。这意味着它能运用自己已经创建的对象。因此,许多功能可以来自于脚本环境中对象的方法与脚本的相互作用。简单性JavaScript的简单性主要体现在:首先它是一种基于Java 基本语句和控制流之上的简单而紧凑的设计, 从而对于学习 Java 是一种非常好的过渡。其次它的变量类型是采用弱类型,并未使用严格的数据类型。安全性JavaScript是一种安全性语言,它不允许访问本地的硬盘,并不能将数据存入到服务器上,不允许对网络文档进行修改和删除,只能通过浏览器实现信息浏览或动态交互。从而有效地防止

7、数据的丢失。动态性JavaScript是动态的,它可以直接对用户或客户输入做出响应,无须经过Web服务程序。它对用户的反映响应,是名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 1 页,共 45 页 - - - - - - - - - 2 采用以事件驱动的方式进行的。所谓事件驱动,就是指在主页(Home Page)中执行了某种操作所产生的动作,就称为“事件”(Event) 。比如按下鼠标、移动窗口、选择菜单等都可以视为事件。当事件发生后,可能会引起相应的事件响应。跨平台性JavaSc

8、ript是依赖于浏览器本身,与操作环境无关,只要能运行浏览器的计算机,并支持JavaScript的浏览器就可正确执行。从而实现了“编写一次,走遍天下”的梦想。实际上 JavaScript最杰出之处在于可以用很小的程序做大量的事。无须有高性能的电脑,软件仅需一个字处理软件及一浏览器,无须WEB 服务器通道,通过自己的电脑即可完成所有的事情。综合所述 JavaScript 是一种新的描述语言,它可以被箝入到 HTML 的文件之中。 JavaScript语言可以做到回应使用者的需求事件 ( 如: form 的输入) ,而不用任何的网路来回传输资料,所以当一位使用者输入一项资料时,它不用经过传给伺服端

9、 (server)处理,再传回来的过程,而直接可以被客户端 (client) 的应用程式所处理。JavaScript 和 Java 很类似,但到底并不一样! Java 是一种比 JavaScript 更复杂许多的程式语言,而JavaScript 则是相当容易了解的语言。JavaScript 创作者可以不那麽注重程式技巧,所以许多 Java 的特性在 Java Script 中并不支援。二、JavaScript和 Java 的区别虽然 JavaScript与 Java 有紧密的联系, 但却是两个公司开发的不同的两个产品。Java 是 SUN公司推出的新一代面向对象的程序设计语言,特别适合于Int

10、ernet应用程序开发;而JavaScript是 Netscape 公司的产品,其目的是为了扩展 Netscape Navigator功能,而开发的一种可以嵌入Web 页面中的基于对象和事件驱动的解释性语言,它的前身是Live Script;而 Java 的前身是 Oak语言。下面对两种语言间的异同作如下比较:基于对象和面向对象Java 是一种真正的面向对象的语言,即使是开发简单的程序,必须设计对象。JavaScript是种脚本语言,它可以用来制作与网络无关的, 与用户交互作用的复杂软件。 它是一种基于对象 (Object Based)和事件驱动( Event Driver)的编程语言。因而它

11、本身提供了非常丰富的内部对象供设计人员使用。解释和编译两种语言在其浏览器中所执行的方式不一样。Java 的源代码在传递到客户端执行之前,必须经过编译,因而客户端上必须具有相应平台上的仿真器或解释器,它可以通过编译器或解释器实现独立于某个特定的平台编译代码的束缚。JavaScript是一种解释性编程语言, 其源代码在发往客户端执行之前不需经过编译,而是将文本格式的字符代码发送给客户编由浏览器解释执行。强变量和弱变量两种语言所采取的变量是不一样的。Java 采用强类型变量检查,即所有变量在编译之前必须作声明。如: Integer x; String y; x=1234; x=4321; 其中 X=

12、1234说明是一个整数, Y=4321说明是一个字符串。JavaScript中变量声明,采用其弱类型。即变量在使用前不需作声明,而是解释器在运行时检查其数据类型,如:x=1234; y4321; 前者说明 x 为其数值型变量,而后者说明y 为字符型变量。代码格式不一样Java 是一种与 HTML 无关的格式, 必须通过像 HTML 中引用外媒体那么进行装载,其代码以字节代码的形式保存在独立的文档中。JavaScript的代码是一种文本字符格式,可以直接嵌入HTML 文档中,并且可动态装载。编写HTML 文档就像编辑文本文件一样方便。名师资料总结 - - -精品资料欢迎下载 - - - - -

13、- - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 2 页,共 45 页 - - - - - - - - - 3 嵌入方式不一样在 HTML 文档中,两种编程语言的标识不同,JavaScript使用.来标识,而 Java 使用.来标识。静态联编和动态联编Java 采用静态联编,即Java 的对象引用必须在编译时的进行,以使编译器能够实现强类型检查。JavaScript采用动态联编,即JavaScript的对象引用在运行时进行检查,如不经编译则就无法实现对象引用的检查。三、JavaScript程序运行环境Java 运行环境软件环境:Windows 9

14、5/98 或 Windows NT 。Netscape Navigator x.0或 Internet Explorer x.0。用于编辑 HTML 文档的字符编辑器 (WS 、WPS 、Notepad、WordPad等) 或 HTML 文档编辑器。硬件配置:首先必须具备运行Windows 95/98 或 Windows NT的基本硬件配置环境。推荐:基本内存 32M 。CRT只少需要 256 颜色,分辨率在 640X480以上。CPU只少 233以上。鼠标和其它外部设置(根据需要选用)。四、编写第一个JavaScript程序下面我们通过一个例子,编写第一个JavaScript程序。通过它可说

15、明JavaScript的脚本是怎样被嵌入到HTML 文档中的。 test1.html文档: / JavaScript Appears here. alert(这是第一个JavaScript例子 !); alert(欢迎你进入JavaScript世界 !); alert(今后我们将共同学习JavaScript知识! ); 在 Internet Explore5.0中运行行后的结果见图11 所示。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 3 页,共 45 页 - - - - - -

16、 - - - 4 图程序运行的结果说明: test.html是 HTML 文档,其标识格式为标准的HTML 格式;如同 HTML 标识语言一样, JavaScript程序代码是一些可用字处理软件浏览的文本,它在描述页面的HTML 相关区域出现。JavaScript代 码 由.说 明 。 在 标 识 .之间就可加入 JavaScript脚本。alert()是 JavaScript的窗口对象方法,其功能是弹出一个具有OK对话框并显示()中的字符串。通过标识说明:若不认识JavaScript代码的浏览器,则所有在其中的标识均被忽略;若认识,则执行其结果。使用注释这是一个好的编程习惯,它使其他人可以读

17、懂你的语言。JavaScript 以 标签结束。从上面的实例分析中我们可以看出,编写一个JavaScript程序确实非常容易的JavaScript基本数据结构JavaScript提供脚本语言的编程与C+ 非常相似,它只是去掉了语言中有关指针等容易产生的错误,并提供了功能强大的类库。对于已经具备+或语言的人来说,学习JavaScript脚本语言是一件非常轻松愉快的事。一、JavaScript代码的加入JavaScript的脚本包括在 HTML 中, 它成为 HTML 文档的一部分。与 HTML 标识相结合, 构成了一个功能强大的Internet网上编程语言。可以直接将JavaScript脚本加入

18、文档: JavaScript语言代码;JavaScript 语言代码 ; . 说明:通过标识 .指明 JavaScript脚本源代码将放入其间。通过属性 Language =JavaScript说明标识中是使用的何种语言,这里是JavaScript语言, 表示在 JavaScript中使用的语言。下面是将 JavaScript脚本加入 Web文档中的例子 : Test2.html 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 4 页,共 45 页 - - - - - - - - -

19、 5 document. Write(这是赛迪网互动学校); document. close(); 在浏览器的窗口中调用test2.html,则显示“这是赛迪网互动学校”字串。见图2 所示。图 2 说明 : Document. write()是文档对象的输出函数,其功能是将括号中的字符或变量值输出到窗口;document. close()是将输出关闭。可将 .标识放入 head. 或 .之间。将 JavaScript标识放置 . 在头部之间, 使之在主页和其余部分代码之前装载,从而可使代码的功能更强大;可以将JavaScript标识放置在. 主体之间以实现某些部分动态地创建文档。二、基本数据类

20、型JavaScript脚本语言同其它语言一样,有它自身的基本数据类型、表达式和算术运算符以及程序的基本框架结构。JavaScript提供了四种基本的数据类型用来处理数字和文字, 而变量提供存放信息的地方, 表达式则可以完成较复杂的信息处理。1、基本数据类型在 JavaScript中四种基本的数据类型:数值(整数和实数)、字符串型(用“”号或括起来的字符或数值)、布尔型(使 True 或 False 表示)和空值。在 JavaScript的基本类型中的数据可以是常量,也可以变量。由于 JavaScript采用弱类型的形式,因而一个数据的变量或常量不必首先作声明,而是在使用或赋值时确定其数据的类型

21、的。当然也可以先声明该数据的类型,它是通过在赋值时自动说明其数据类型的。2、常量整型常量JavaScript的常量通常又称字面常量, 它是不能改变的数据。 其整型常量可以使用十六进制、 八进制和十进制表示其值。实型常量实型常量是由整数部分加小数部分表示,如12.32、193.98 。可以使用科学或标准方法表示:5E7、4e5等。布尔值布尔常量只有两种状态:True 或 False 。 它主要用来说明或代表一种状态或标志,以说明操作流程。它与是不一样的 , 可以用或表示其状态, 而 JavaScript只能用 True 或 False 表示其状态。字符型常量使用单引号()或双引号(“)括起来的一

22、个或几个字符。 如 This is a book of JavaScript 、3245 、ewrt234234 等。空值JavaScript中有一个空值 null,表示什么也没有。如试图引用没有定义的变量, 则返回一个 Null 值。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 5 页,共 45 页 - - - - - - - - - 6 特殊字符同语言一样, JavaScript中同样以有些以反斜杠()开头的不可显示的特殊字符。通常称为控制字符。3、变量变量的主要作用是存取数据

23、、提供存放信息的容器。对于变量必须明确变量的命名、变量的类型、变量的声明及其变量的作用域。变量的命名JavaScript中的变量命名同其计算机语言非常相似,这里要注意以下两点:、必须是一个有效的变量,即变量以字母开头,中间可以出现数字如test1 、text2 等。除下划线()作为连字符外,变量名称不能有空格、()、()、(,)或其它符号。、不能使用 JavaScript中的关键字作为变量。在 JavaScript中定义了多个类键字, 这些关键是 JavaScript内部使用的,不能作为变量的名称。如 Var、 int 、 double、true 不能作为变量的名称。在对变量命名时,最好把变量

24、的意义与其代表的意思对应起来,以免出现错误。变量的类型在 JavaScript中,变量可以用命令Var 作声明: var mytest; 该例子定义了一个mytest 变量。但没有赋予它的值。Var mytest= ”This is a book”该例子定义了一个mytest 变量, 同时赋予了它的值。在 JavaScript中,变量以可以不作声明,而在使用时再根据数据的类型来确其变量的类型。如:x=100 y=125 xy= True cost=19.5 等。其中 x 整数, y 为字符串, xy 为布尔型, cost 为实型。变量的声明及其作用域JavaScript变量可以在使用前先作声明

25、,并可赋值。通过使用var 关键字对变量作声明。对变量作声明的最大好处就是能及时发现代码中的错误;因为JavaScript是采用动态编译的,而动态编译是不易发现代码中的错误,特别是变量命名的方面。对于变量还有一个重要性那就是变量的作用域。在JavaScript中同样有全局变量和局部变量。全局变量是定义在所有函数体之外,其作用范围是整个函数;而局部变量是定义在函数体之内,只对其该函数是可见的,而对其它函数则是不可见的。三、表达式和运算符、表达式在定义完变量后,就可以对它们进行赋值、改变、计算等一系列操作,这一过程通常又叫称一个叫表达式来完成,可以说它是变量、常量、布尔及运算符的集合,因此表达式可

26、以分为算术表述式、字串表达式、赋值表达式以及布尔表达式等。、运算符运算符完成操作的一系列符号,在JavaScript中有算术运算符,如、 -、*、/ 等;有比较运算符如 ! 、等 ; 有逻辑布尔运算符如!(取反)、| 、|; 有字串运算如、 等。在 JavaScript主要有双目运算符和单目运算符。其双目运算符由下列组成:操作数运算符 操作数名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 6 页,共 45 页 - - - - - - - - - 7 即由两个操作数和一个运算符组成。如

27、5040、This+that等。单目运算符,只需一个操作数,其运算符可在前或后。()算术运算符JavaScript中的算术运算符有单目运算符和双目运算符。双目运算符:+(加) 、-(减)、 * (乘)、 / (除)、 %(取模)、| (按位或)、 &(按位与 )、 (右移)、 (右移,零填充)。单目运算符:- (取反)、 (取补)、 +(递加 1)、- (递减 1)。()比较运算符比较运算符它的基本操作过程是,首先对它的操作数进行比较,尔后再返回一个true 或 False 值,有个比较运算符: (大于)、=(大于等于 ) 、=(等于) 、!=( 不等于 )。()布尔逻辑运算符在 JavaSc

28、ript中增加了几个布尔逻辑运算符: ! (取反) 、&=(与之后赋值)、 &(逻辑与)、 |= (或之后赋值)、 | (逻辑或)、 = (异或之后赋值)、 (逻辑异或)、 ?: (三目操作符)、 | (或)、 =(等于)、|=( 不等于 )。其中三目操作符主要格式如下:操作数?结果:结果若操作数的结果为真,则表述式的结果为结果,否则为结果。四、范例下面是一个跑马灯效果的JavaScript文档。Test2_1.html var msg= 这是一个跑马灯效果的JavaScript文档 ; var interval = 100; var spacelen = 120; var space10=

29、; var seq=0; function Scroll() len = msg.length; window.status = msg.substring(0, seq+1); seq+; if ( seq = len ) seq = spacelen; window.setTimeout(Scroll2();, interval ); else window.setTimeout(Scroll();, interval ); function Scroll2() var out=; 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - -

30、 - 名师精心整理 - - - - - - - 第 7 页,共 45 页 - - - - - - - - - 8 for (i=1; i= len ) seq = 0; ; window.setTimeout(Scroll2();, interval ); Scroll(); 本文介绍了 JavaScript脚本是如何加入Web 页面, 并学习了 JavaScript语言中的基本数据类型、变量、常量、操作运算符等。可以看出,对于已经掌握语言的人来说,学习JavaScript真是一件非常轻松愉快的事。JavaScript程序构成JavaScript脚本语言的基本构成是由控制语句、函数、对象、方法

31、、属性等, 来实现编程的。一、程序控制流在任何一种语言中,程序控制流是必须的,它能使得整个程序减小混乱,使之顺利按其一定的方式执行。下面是JavaScript常用的程序控制流结构及语句: 、if条件语句基本格式if (表述式)语句段;. else 语句段;. 功能:若表达式为true ,则执行语句段;否则执行语句段。说明:if -else 语句是 JavaScript中最基本的控制语句,通过它可以改变语句的执行顺序。表达式中必须使用关系语句,来实现判断,它是作为一个布尔值来估算的。它将零和非零的数分别转化成false和 true 。若 if后的语句有多行,则必须使用花括号将其括起来。if语句的

32、嵌套if (布尔值)语句;else (布尔值)语句;else if(布尔值)语句;,else 语句;名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 8 页,共 45 页 - - - - - - - - - 9 在这种情况下,每一级的布尔表述式都会被计算,若为真,则执行其相应的语句,否则执行else 后的语句。、For 循环语句基本格式for (初始化;条件;增量)语句集;功能:实现条件循环,当条件成立时,执行语句集,否则跳出循环体。说明:初始化参数告诉循环的开始位置,必须赋予变量的初

33、值;条件:是用于判别循环停止时的条件。若条件满足,则执行循环体,否则跳出。增量:主要定义循环控制变量在每次循环时按什么方式变化。三个主要语句之间,必须使用逗号分隔。、while 循环基本格式while (条件)语句集;该语句与 For 语句一样,当条件为真时,重复循环,否则退出循环。For 与 while 语句两种语句都是循环语句,使用For 语句在处理有关数字时更易看懂,也较紧凑;而while 循环对复杂的语句效果更特别。、break 和 continue 语句与 C+ 语言相同,使用 break 语句使得循环从 For 或 while 中跳出, continue使得跳过循环内剩余的语句而进

34、入下一次循环。二、函数函数为程序设计人员提供了一个丰常方便的能力。通常在进行一个复杂的程序设计时,总是根据所要完成的功能,将程序划分为一些相对独立的部分,每部分编写一个函数。从而,使各部分充分独立,任务单一,程序清晰,易懂、易读、易维护。 JavaScript函数可以封装那些在程序中可能要多次用到的模块。并可作为事件驱动的结果而调用的程序。从而实现一个函数把它与事件驱动相关联。这是与其它语言不样的地方。、JavaScript函数定义Function 函数名 (参数 , 变元) 函数体 ;. Return 表达式 ; 说明:当调用函数时 , 所用变量或字面量均可作为变元传递。函数由关键字 Fun

35、ction 定义。函数名:定义自己函数的名字。参数表,是传递给函数使用或操作的值,其值可以是常量,变量或其它表达式。通过指定函数名(实参)来调用一个函数。必须使用 Return 将值返回。函数名对大小写是敏感的。、函数中的形式参数:在函数的定义中,我们看到函数名后有参数表,这些参数变量可能是一个或几个。那么怎样才能确定参数变量的个数呢?在 JavaScript中可通过 arguments .Length来检查参数的个数。例:名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 9 页,共

36、45 页 - - - - - - - - - 10 Function function_Name(exp1,exp2,exp3,exp4) Number =function _Name . arguments .length; if (Number1)document.wrile(exp2); if (Number2) document.write(exp3); if(Number3) document.write(exp4); . 三、事件驱动及事件处理、基本概念JavaScript是基于对象 (object-based)的语言。这与 Java 不同,Java 是面向对象的语言。而基于对象的

37、基本特征,就是采用事件驱动 (event-driven)。它是在用形界面的环境下,使得一切输入变化简单化。通常鼠标或热键的动作我们称之为事件( Event),而由鼠标或热键引发的一连串程序的动作,称之为事件驱动(Event Driver)。而对事件进行处理程序或函数,我们称之为事件处理程序(Event Handler )。、事件处理程序在 JavaScript中对象事件的处理通常由函数(Function)担任。其基本格式与函数全部一样,可以将前面所介绍的所有函数作为事件处理程序。格式如下:Function 事件处理名(参数表) 事件处理语句集;, 、事件驱动JavaScript事件驱动中的事件

38、是通过鼠标或热键的动作引发的。它主要有以下几个事件:()单击事件onClick 当用户单击鼠标按钮时,产生onClick 事件。同时 onClick指定的事件处理程序或代码将被调用执行。通常在下列基本对象中产生:button (按钮对象)checkbox(复选框)或(检查列表框)radio (单选钮)reset buttons(重要按钮)submit buttons(提交按钮)例:可通过下列按钮激活change() 文件: 在 onClick 等号后,可以使用自己编写的函数作为事件处理程序,也可以使用JavaScript中内部的函数。还可以直接使用 JavaScript的代码等。例:Input

39、 type=button value= onclick=alert(这是一个例子 ); () onChange改变事件当利用 text或 texturea元素输入字符值改变时发该事件,同时当在select表格项中一个选项状态改变后也会引名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 10 页,共 45 页 - - - - - - - - - 11 发该事件。例: ()选中事件onSelect 当 Text 或 Textarea 对象中的文字被加亮后,引发该事件。()获得焦点事件onF

40、ocus 当用户单击 Text 或 textarea以及 select对象时,产生该事件。此时该对象成为前台对象。()失去焦点onBlur 当 text对象或 textarea对象以及 select对象不再拥有焦点、而退到后台时,引发该文件,他与onFocas 事件是一个对应的关系。()载入文件onLoad 当文档载入时,产生该事件。onLoad一个作用就是在首次载入一个文档时检测cookie 的值,并用一个变量为其赋值,使它可以被源代码使用。()卸载文件onUnload 当 Web页面退出时引发 onUnload 事件,并可更新 Cookie 的状态。四、范例范例 1:下例程序是一个自动装载

41、和自动卸载的例子。即当装入HTML 文档时调用 loadform() 函数, 而退出该文档进入另一 HTML 文档时则首先调用unloadform()函数, 确认后方可进入。test3_1.htm 调用 范例 2:这是一个获取浏览器版本号的程序。该程序首先显示一个波浪一提示信息。之后显示浏览器的版本号有关信息。test3_2.htm 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 11 页,共 45 页 - - - - - - - - - 12 function makeArray(

42、n) this.length=n return this function hexfromdec(num) hex=new makeArray(1); var hexstring=; var shifthex=16; var temp1=num; for(x=1; x=0; x-) hexx=Math.round(temp1/shifthex - .5); hexx-1=temp1 - hexx * shifthex; temp1=hexx-1; shifthex /= 16; for (x=1; x=0; x-) hexstring+=getletter(hexx); return (hex

43、string); function getletter(num) if (num 10) return num; else if (num = 10) return A if (num = 11) return B if (num = 12) return C if (num = 13) return D if (num = 14) return E if (num = 15) return F function rainbow(text) var color_d1; var allstring=; for(i=0;itext.length;i=i+2) color_d1=255*Math.s

44、in(i/(text.length/3); color_h1=hexfromdec(color_d1); allstring+=+text.substring(i,i+2)+; return allstring; 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 12 页,共 45 页 - - - - - - - - - 13 function sizefont(text) var color_d1; var allstring=; var flag=0; for(i=0,j=0;i=

45、7) flag=1; if (flag=1) j=j-1; if (j=0) flag=0; allstring+= + text.substring(i,i+1) + ; return allstring; document.write() document.write() document.write( sizefont(这是一个获取WEB 浏览器的程序 ) document.write() document.write(浏览器名称 : +navigator.appName+); document.write(版本号 : +navigator.appVersion+); document.

46、write(代码名字 : +navigator.appCodeName+); document.write(用户代理标识 : +navigator.userAgent); 名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 13 页,共 45 页 - - - - - - - - - 14 输出结果图 1 所示。图 1本讲介绍了 JavaScript程序设计的有关内容。程序流、函数、事件是我们学习掌握JavaScript编程的重点。基于对象的 JavaScript语言JavaScript语

47、言是基于对象的( Object-Based ),而不是面向对象的( object-oriented)。之所以说它是一门基于对象的语言,主要是因为它没有提供象抽象、继承、重载等有关面向对象语言的许多功能。而是把其它语言所创建的复杂对象统一起来,从而形成一个非常强大的对象系统。虽然 JavaScript语言是一门基于对象的,但它还是具有一些面向对象的基本特征。它可以根据需要创建自己的对象,从而进一步扩大JavaScript的应用范围,增强编写功能强大的Web 文档。一、对象的基础知识1、对象的基本结构JavaScript中的对象是由属性 (properties)和方法(methods) 两个基本的

48、元素的构成的。 前者是对象在实施其所需要行为的过程中,实现信息的装载单位,从而与变量相关联;后者是指对象能够按照设计者的意图而被执行,从而与特定的函数相联。2、引用对象的途径一个对象要真正地被使用,可采用以下几种方式获得:o 引用 JavaScript内部对象;o 由浏览器环境中提供;o 创建新对象。这就是说一个对象在被引用之前,这个对象必须存在,否则引用将毫无意义,而出现错误信息。从上面中我们可以看出JavaScript引用对象可通过三种方式获取。要么创建新的对象,要么利用现存的对象。、有关对象操作语句JavaScript不是一纯面向对象的语言, 它设有提供面向对象语言的许多功能,因此 Ja

49、vaScript设计者之所以把它你“基于对象”而不是面向对象的语言,在JavaScript中提供了几个用于操作对象的语句和关键字及运算符。(1) For.in语句格式如下:For(对象属性名 in 已知对象名)说明:o 该语句的功能是用于对已知对象的所有属性进行操作的控制循环。它是将一个已知对象的所有属性反复置给一个变量;而不是使用计数器来实现的。名师资料总结 - - -精品资料欢迎下载 - - - - - - - - - - - - - - - - - - 名师精心整理 - - - - - - - 第 14 页,共 45 页 - - - - - - - - - 15 o 该语句的优点就是无需

50、知道对象中属性的个数即可进行操作。例:下列函数是显示数组中的内容:Function showData(object) for (var X=0; X30;X+) document.write(objecti);该函数是通过数组下标顺序值,来访问每个对象的属性,使用这种方式首先必须知道数组的下标值,否则若超出范围,则就会发生错误。而使For.in语句,则根本不需要知道对象属性的个数,见下:Function showData(object) for(var prop in object) document.write(objectprop);使用该函数时,在循环体中,For 自动将的属性取出来,直

展开阅读全文
相关资源
相关搜索

当前位置:首页 > 教育专区 > 高考资料

本站为文档C TO C交易模式,本站只提供存储空间、用户上传的文档直接被用户下载,本站只是中间服务平台,本站所有文档下载所得的收益归上传人(含作者)所有。本站仅对用户上传内容的表现方式做保护处理,对上载内容本身不做任何修改或编辑。若文档所含内容侵犯了您的版权或隐私,请立即通知淘文阁网,我们立即给予删除!客服QQ:136780468 微信:18945177775 电话:18904686070

工信部备案号:黑ICP备15003705号© 2020-2023 www.taowenge.com 淘文阁