javascript综合

windows对象


每个HTML文档的顶层对象.

属性

frames[] 子桢数组.每个子桢数组按源文档中定义的顺序存放.

feames.length 子桢个数.

self 当前窗口.

parent 父窗口(当前窗口是中一个子窗口).

top 顶层窗口(是所有可见窗口的父窗口).

status 浏览器状态窗口上的消息.

defaultStatus 当status无效时,出现在浏览器状态窗口上的缺省消息.

name 内部名,为由window.open()方法打开的窗口定义的名字.


方法

alert("message") 显示含有给定消息的"JavaScript Alert"对话框.

confirm("message") 显示含有给定消息的"Confirm"对话框(有一个OK按钮和一个Cancel按钮).如果用户单击OK返回true,否则返回false.

prompt("message") 显示一个"prompt"对话框,要求用户根据显示消息给予相应输入.

open("URL","name") 打开一个新窗口,给予一个指定的名字.

close() 关闭当前窗口.

document 文挡对象详解

---------------------------------------------------------------------
注:页面上元素name属性和JavaScript引用的名称必须一致包括大小写
   否则会提示你一个错误信息 "引用的元素为空或者不是对象"
---------------------------------------------------------------------

Navigator

frame对象


它是整个浏览器窗口的子窗口,除了status,defaultStatus,name属性外,它拥有window对象的全部属性.


location对象


含有当前URL的信息.

属性

href 整个URL字符串.

protocol 含有URL第一部分的字符串,如http:

host 包含有URL中主机名:端口号部分的字符串.如//www.cenpok.net/server/

hostname 包含URL中主机名的字符串.如http://www.cenpok.net

port 包含URL中可能存在的端口号字符串.

pathname URL中"/"以后的部分.如~list/index.htm

hash "#"号(CGI参数)之后的字符串.

search "?"号(CGI参数)之后的字符串.
document对象


含有当前文档信息的对象.

属性

title 当前文档标题,如果未定义,则包含"Untitled".

location 文档的全URL.

lastModified 含有文档最后修改日期.

referrer 调用者URL,即用户是从哪个URL链接到当前页面的.

bgColor 背景色(#xxxxxx)

fgColor 前景文本颜色.

linkColor 超链接颜色.

vlinkColor 访问过的超链颜色.

alinkColor 激活链颜色(鼠标按住未放时).

forms[] 文档中form对象的数组,按定义次序存储.

forms.length 文档中的form对象数目.

links[] 与文档中所有HREF链对应的数组对象,按次序定义存储.

links.length 文档中HREF链的数目.

anchors[] 锚(...)数组,按次序定义存储.

anchors.length 文档中锚的数目.


方法

write("string") 将字符串突出给当前窗口.(字符串可以含有HTML标记)

writeln("string") 与write()类似,在结尾追加回车符,只在预定格式文本中(

...
或
...
)生效.

clear() 清当前窗口.

close() 关闭当前窗口.
form对象


属性

name

中的NAME属性的字符串值.

method 中METHOD属性的类值,"0"="GET" ,"1"="POST" .

action 中ACTION属性的字符串值.

target 表格数据提交的目标,与标记中相应属性一致.

elements[index] elements属性包含form中的各个元素.

length 表格中的元素个数.


方法

submit() 提交表格.

事件处理器onSubmit() 用户单击一个定义好的按钮提交form时运行的代码.


text和textarea对象

属性

name NAME属性的字符串值.

value 域内容的字符串值.

defaultValue 域内容的初始字符串值.


方法

focus() 设置对象输入焦点.

blur() 从对象上移走输入焦点.

select() 选定对象的输入区域.


事件处理器

onFocus 当输入焦点进入时执行.

onBlur 当域失去焦点时执行.

onSelect 当域中有部分文本被选定时执行.

onChange 当域失去焦点且域值相对于onFocus执行有所改变时执行.         

 

属性

name NAME属性的字符串值.

value 复选框内容的字符串值.如果设置了,则为"on",否则为"off".

checked 复选框内容的布尔值.如果设置了,则为true,否则为false .

defaultChecked 反映(CHECKED)属性的布尔值(缺省状态).


方法

click() 选定复选框,并使之状态为"on".


事件处理器

onClick 当用户单击Checkbox时执行.


单选按钮(radio)对象


属性

name NAME属性的字符串值.

length radio对象中单选按钮的个数.

value VALUE属性的字符串值.

checked 布尔值,按下为true,否则为false .

defaultChecked 反映CHECKED属性值的布尔值.


方法

click() 选定单选按钮.


事件处理器

onClick 当单选按钮被选定时执行.
select对象

属性

length select对象中对象的个数.

name 由NAME=属性定义的select对象的内部名.

selectedIndex select对象中当前被选option的下标.

options 该属性对应于在HTML中定义select对象时标记中的内容,它有如下属性:

text 标记后的文本串.

value VALUE属性的值,当Submit按钮被按下时,该值被提交.

defaultSelected 反映标记的SELECTED属性的布尔值.

selected 反映option的当前选择状态的布尔值.


事件处理器

onFocus 当输入焦点进入域时执行.

onBlur 当域失去输入焦点时执行.

onChange 当域失去焦点且如果域的值相对于onFocus执行时有所改变,则执行onChange.


Button对象


表格中有三种类型按钮,由标记中的TYPE属性定义:

.submit (type="SUBMIT")

.reset (type="RESET")

.custom (type="BUTTON")

所有按钮对象都有如下成分:

属性

value VALUE属性的字符串值.

name NAME属性的字符串值.


方法

click() 选定按钮


事件处理器

onClick 当按钮被单击时执行.
submit和reset对象


属性

value VALUE=属性的内容.

name NAME=属性的内容.


方法

click() 选定按钮


事件处理器

onClick 当按钮被单击时执行.


password对象


属性

defaultValue VALUE=属性的内容.

name NAME=属性的内容.

value 目前输入password域的数据.


方法

focus() 将焦点带入password域.

blur 将焦点从password域移出.

select() 选定password域中的当前数据,以备修改.


navigator对象


该对象用于确定用户访问时使用的Navigator版本.

属性

appCodeName 相对于用户浏览器的"codename"

appName 相对于用户浏览器的实际名字.

appVersion 相对于用户浏览器的版本号.

userAgent 该属性反映用户浏览器的全部信息.

 

 

string对象为操作字符串的内容提供了很多方法.


属性

length 字符串的长度,即字符串中字符的个数.


方法

big(),blink(),bold(),fixed(),italics(),small(),sub(),strike(),sup(),fontColor(color),fontSize(size)

以上方法为字符串增加相应的HTML标记.

charAt(index) 返回字符串中index处的字符.

indexOf(searchValue,[fromIndex]) 该方法在字符串中寻找第一次出现的searchValue.如果给定了fromIndex,则从

字符串内该位置开始搜索,当searchValue找到后,返回该串第一个字符的位置.

lastIndexOf(searchValue,[fromIndex]) 从字符串的尾部向前搜索searchValue,并报告找到的第一个实例.

substring(indexA,indexB) 获取自indexA到indexB的子串.

toLowerCase(),toUpperCase() 将字符串中所有字符全部转换成大写,小写.
Date对象


要使用Date对象,必须先生成一个Date实例:

变量名=new Date();

方法

getDay(),getDate(),getHours(),getMinutes(),getMonth(),getSeconds(),getTime(),

getTimeZoneOffset(),getYear()

还有setDay... ...

toGMTString() 用GMT格式返回当前时间. (Sun,12 Feb 1999 14:19:22 GMT)

toLocaleString 用locale格式返回当前时间. (03/11/99 14:19:22)

parse(date) 将普通date字符串转换成豪秒形式,从而给setTime()做参数.
Math对象


属性

LN10 (10的自然对数)

PI (3.1415926...)

SQRT1_2 (1/2的平方根)

方法

abs(x) 返回x的绝对值

acos(x) 返回x的arc cosine值

asin(x) 返回x的arc sin值

atan(x) 返回x的arc tangent值

ceil(x) 返回大于等于x的最小整数

cos(x) 返回x的cosine值

exp(x) 返回e的x次方

floor(x) 返回小于等于x的最大整数

log(x) 返回x的

max(x,y) 返回x,y中的大值

min(x,y) 返回x,y中的小值

pow(x,y) 返回x的y次方

round(x) 舍入到最近整数,(小于或等于0.5小数舍去)

sin(x) 返回x的sin值

sqrt(x) 返回x的平方根

tan(x) 返回x的tangent值     

本文列举了各种JavaScript对象与数组,同时包括对上述每一对象或数组所完成工作的简短描述,以及与其相关的属性方法,以及事件处理程序,还注明了该对象或数组的父对象用户同样可能需要参考Online Companion中的超级文本Object Hierarchy页面(http://www.netscapepress.com/support/javascript/10-9.htm),以便了解这些对象之间是如何相互关联的。
　　顺便提一下,记住,这里把所有作为另一对象的子对象的对象看作该对象的属性请参见第十章中与此相关的注解。

　　B.1 anchor对象
　　使用标记创建的HTML描点能被一个链接作为目标如果锚点包括HREF=特性,则它也是一个链接对象。
　　anchor对象是document对象的一个属性,它本身没有属性方法或者事件处理程序。

　　B.2 anchors数组
　　anchors数组是document对象的一个属性,是文档内所有anchor对象的一个列表如果anchor也是一个link(链接),则它会同时出现在anchors和links数组中。
　　属性
　　length 文档内的锚点个数

　　B.3 array对象
　　array对象是Netscape Navlgator 3.0 beta 3中引入的一个新的对象,因而,它不能在Netscape 2.0中使用它是一个内置对象,而不是其它对象的属性。
　　属性
 　length 数组中的值个数

　　B.4 button对象
　　它是form对象的一个属性,使用标记来创建。
　　属性
　　name HTML标记中的NAME=特性
　　value HTML标记中的VALUE=特性
　　方法
　　click 模拟鼠标单击一按钮
　　事件处理程序
　　Onclick

　　B.5 checkbox 对象
　　它是form对象的一个属性,使用标记来创建。
　　属性
　　checked 复选框的选择状态
　　defaultChecked 标记的CHECKED=特性
　　name 标记的NAME=特性
　　value 标记的VALUE=特性
　　方法
　　click 模拟鼠标单击按钮
　　事件处理程序
　　onclick

　　B.6 Date对象
　　它是一个内置对象——而不是其它对象的属性,允许用户执行各种使用日期和时间的过程。
  　方法
　　getDate() 查看Date对象并返回日期
　　getDay() 返回星期几
　　getHours() 返回小时数
　　getMinutes() 返回分钟数
　　getMonth() 返回月份值
　　getSeconds() 返回秒数
　　getTime() 返回完整的时间
　　getTimezoneoffset() 返回时区偏差值(格林威治平均时间与运行脚本的计算机所处时区设置之间相差的小时数)
　　getYear() 返回年份
　　parse() 返回在Date字符串中自从1970年1月1日00:00:00以来的毫秒数(Date对象按照毫秒数的形式存储从那时起的日期和时间)但是注意,该方法当前不能正确运行
　　setDate() 改变Date对象的日期
　　setHours() 改变小时数
　　setMinutes() 改变分钟数
　　setMonth() 改变月份
　　setSeconds() 改变秒数
　　setTime() 改变完整的时间
　　setYear() 改变年份
　　toGMTString() 把Date对象的日期(一个数值)转变成一个GMT时间字符串,返回类似下面的值:Weds,15 June l997 14:02:02 GMT(精确的格式依赖于计算机上所运行的操作系统而变)
　　toLocaleString() 把Date对象的日期(一个数值)转变成一个字符串,使用所在计算机上配置使用的特定日期格式
　　UTC() 使用Date UTC(年、月、日、时、分、秒),以自从1970年1月1日00:00:00(其中时、分、秒是可选的)以来的毫秒数的形式返回日期

　　B.7 document对象
　　该对象是window和frames对象的一个属性,是显示于窗口或框架内的一个文档。
　　属性
　　alinkColor 活动链接的颜色(ALINK)
　　anchor 一个HTMI锚点,使用标记创建(该属性本身也是一个对象)
　　anchors array 列出文档锚点对象的数组()(该属性本身也是一个对象)
　　bgColor 文档的背景颜色(BGCOLOR)
　　cookie 存储于cookie.txt文件内的一段信息,它是该文档对象的一个属性
　　fgColor 文档的文本颜色(标记里的TEXT特性)
　　form 文档中的一个窗体(

)(该属性本身也是一个对象)
　　forms anay 按照其出现在文档中的顺序列出窗体对象的一个数组(该属性本身也是一个对象)
　　lastModified 文档最后的修改日期
　　linkColor 文档的链接的颜色,即标记中的LINK特性(链接到用户没有观察到的文档)
　　link 文档中的一个标记(该属性本身也是一个对象)
　　links array 文档中link对象的一个数组,按照它们出现在文档中的顺序排列(该属性本身也是一个对象)
　　location 当前显示文档的URL。用户不能改变document.location(因为这是当前显示文档的位置)。但是,可以改变window.location (用其它文档取代当前文档)window.location本身也是一个对象,而document.location不是对象
　　referrer 包含链接的文档的URL,用户单击该链接可到达当前文档
　　title 文档的标题((TITLE>)
　　vlinkColor 指向用户已观察过的文档的链接文本颜色,即标记的VLINK特性
　　方法
　　clear 清除指定文档的内容
　　close 关闭文档流
　　open 打开文档流
　　write 把文本写入文档
　　writeln 把文本写入文档,并以换行符结尾

　　B.8 elements数组
　　它是form对象的一个属性,列举了窗体内各元素的一个数组。
　　属性
　　1ength 窗体内的元素个数
　　B.9 form对象
　　它是document对象的一个属性,文档内的一个窗体。
　　属性
　　action 包含了为一个窗体提交的目标URL的字符串
　　button 窗体内的一个按钮,使用标记来创建(该属性本身也是一个对象)
　　checkbox 复选框,使用标记来创建 (该属性本身也是一个对象)
　　elements array 一个数组,按照其出现于窗体内的顺序列举各窗体元素(该属性本身也是一个对象)
　　encoding 窗体的MIME编码
  　hidden 窗体里的一个隐藏元素()。窗体对象的一个属性(该属性本身也是一个对象)
　　length 窗体里的元素的个数
　　method 输入窗体的数据传送到服务器上的方式,即(FORM)标记中的METHOD特性
　　radio 设置在窗体里的单选按钮()(该属性本身也是一个对象)
　　reset 窗体里的复位按钮((1NPUT TYPE=”RESET”>)(该属性自身也是一个对象)
　　select 窗体里的选择框()(该属性本身也是一个对象)
　　submit 窗体里的提交按钮()(该属性本身也是一个对象)
　　target 提交窗体后,显示回应信息的窗口的名字
　　text 窗体里的文本元素()(该属性本身也是一个对象)
　　textarta 窗体里的文本区元素()(该属性本身也是一个对象)<br>　　方法<br>　　submit 提交窗体(与使用Submit按钮的作用相同)事件处理程序<br>　　onsubmit</p> <p>　　B.10 forms数组<br>　　该数组是document对象的一个属性,即列举了文档内的各窗体的一个数组。<br>　　属性<br>　　length 文档内窗体的个数</p> <p>　　B.11 frame对象<br>　　它是window对象的一个属性,窗口内的一个框架。除了个别例外,frame对象与window对象的作用相同。<br>　　属性<br>　　frames array 列举该框架内的各个子框架的一个数组(该属性本身也是—个对象)<br>　　length 该框架内的框架数<br>　　name 框架的名字(<FRAME>标记里的NAME特性)<br>　　parent 包含本框架的父窗口的同义词<br>　　self 当前框架的同义词<br>　　window 当前框架的同义词<br>　　方法<br>　　clearTimeout() 用来终止setTimeout方法的工作<br>　　setTimeout() 等待指定的毫秒数,然后运行指令</p> <p>　　B.12 frames数组<br>　　它既是window对象,也是frame对象的属性,列举了window或者frame对象内的各框架。<br>　　属性<br>　　length 窗口或框架对象内的框架数</p> <p>　　B.13 hidden对象<br>　　糊为form对象的一个属性,窗体内的一个隐藏元素(<INPUT TYPE=”HIDDEN”>)。<br>　　属性<br>　　name 标记内的名字(NAME特性)<br>　　value 标记内的VALUE=特性</p> <p>　　B.14 history对象<br>　　它为window对象的一个属性,该窗口的历史列表。<br>　　属性<br>　　length 历史列表中的项目数<br>　　方法<br>　　back 加载历史列表中的上一个文档<br>　　forward 加载历史列表中的下一个文档<br>　　go 加载历史列表中的一个指定文档,通过文档在列表中的位置来指定</p> <p>　　B.15 image对象<br>　　它是document对象的一个属性,是使用(1MG)标记内嵌入文档里的一幅图像这是Netscape Navigator 3.0 beta 3引入的新对象。<br>　　属性<br>　　border <IMG>标记的BORDER特性<br>　　complete 表示浏览器是否完整地加载了图像的一个布尔值<br>　　height HEIGHT特性<br>　　hspace HSPACE特性<br>　　lowsrc LOWSRC特性<br>　　src SRC特性<br>　　vsPace VSPACE特性<br>　　width WIDTH特性<br>　　事件处理程序<br>　　Onload 图象载入<br>　　Onerror 载入错误<br>　　Onabort 取消</p> <p>　　B.16 images数组<br>　　它是document对象的一个属性,文档中所有图像的列表。<br>　　属性<br>　　length 文档内的图像个数</p> <p>　　B.17 link<br>　　它是document对象的一个属性,文档内的一个<A HREF=>标记。<br>　　属性<br>　　hash 以散列号(#)开始的一个字符串,用于指定URL内的一个锚点<br>　　host 包括冒号和端口号的URL的主机名部分<br>　　hostname 与host属性相同,除了不包括冒号和端口号外<br>　　href 完整的URL<br>　　pathname URL的目录路径部分<br>　　port URL的:端口部分<br>　　protocol URL类型(http:、ftp:、gopher:等等)<br>　　search 以一个问号开始的URL中的一部分,用于指定搜索信息<br>　　target 当用户单击一链接(TARGET特性)时,用于显示被引用文档内容的窗口<br>　　事件处理程序<br>　　Onclick 点击<br>　　Onmouseover 鼠标移到对象上</p> <p>　　B.18 links数组<br>　　它是document对象的一个属性,文档内所有链接的一个列表。<br>　　属性<br>　　length 文档内的链接数</p> <p>　　B.19 location对象<br>　　它为document对象的一个属性,该文档的完整URL，请不要把它与window.location属性相混淆,后者可用来加载一个新文档,并且window.location属性本身并不是一个对象，同时,window.location可以用脚本修改,而document.location则不能。<br>　　属性<br>　　hash 以散列号(#)开始的一个字符串,用于指定URL内的一个锚点<br>　　host 包括冒号和端口号的URL的主机名部分<br>　　hostname 与host属性相同,除了不包括冒号和端口号之外<br>　　href 完整的URL<br>　　pathname URL的目录路径部分<br>　　port URL的:端口部分<br>　　protocol URL的类型(http:、ftp:、gopher:等等)<br>　　search 以问号(?)开始的URL中的一部分,用于指定搜索信息<br>　　target 用户单击链接(TARGET特性)时,用于显示被引用文档的内容的窗口</p> <p>　　B.20 math对象<br>　　该对象不是其它对象的一个属性,而是一个内置对象,包含了许多数学常量和函数。<br>　　属性<br>　　E 欧拉常量,自然对数的底(约等于2.718)<br>　　LN2 2的自然对数(约等于0.693)<br>　　LN10 10的自然对数(约等于2.302)<br>　　LOG2E 以2为底的e的对数(约等于1.442)<br>　　LOG10E 以10为底的e的对数(约等于o.434)<br>　　PI ∏的值(约等于3.14159)<br>　　SQRT1_2 0.5的平方根(即l除以2的平方根,约等于o.707)<br>　　SQRT2 2的平方根(约等于1.414)<br>　　方法<br>　　abs() 返回某数的绝对值(即该数与o的距离,例如,2与一2的绝对值都是2)<br>　　acos() 返回某数的反余弦值(以弧度为单位)<br>　　asin() 返回某数的反正弦值(以弧度为单位)<br>　　atan() 返回某数的反正切值(以弧度为单位)<br>　　ceil() 返回与某数相等,或大于该数的最小整数(ceil(-22.22)返回-22;ceil22,22)返回23;ceil(22)返回22)<br>　　cos() 返回某数(以弧度为单位)的余弦值<br>　　exp() 返回en<br>　　floor() 与ceil相反(floor(一22.22)返回一23;floor(22.22)返回22; floor(22)返回22)<br>　　10g() 返回某数的自然对数(以e为底)<br>　　max() 返回两数间的较大值<br>　　min() 返回两数问的较小值<br>　　pow() 返回m的n次方(其中,m为底,n为指数)<br>　　random() 返回0和1之间的一个伪随机数(该方法仅在Netscape<br>　　Navigator的UNIX版本中有效)<br>　　round() 返回某数四舍五入之后的整数<br>　　sin() 返回某数(以弧度为单位)的正弦值<br>　　sqrt() 返回某数的平方根<br>　　tan() 返回某数的正切值</p> <p>　　B.2l navigator对象<br>　　该对象不是其它对象的属性,而是一个内置对象它包含了有关加载文档的浏览器的信息。<br>　　属性<br>　　appCodeName 浏览器的代码名(例如,Mozilla)<br>　　appName 浏览器的名字<br>　　appVersion 浏览器的版本号<br>　　userAgent 由客户机送到服务器的用户与代理头标文本<br>　　方法<br>　　javaEnabled JavaScript中当前并没有该方法,但是不久之后将会添加上它将查看浏览器是否为兼容JavaScript的浏览器,如果是,继续查看JavaScript是否处于支持状态。</p> <p>　　B.22 options数组<br>　　该数组是select对象的一个属性,即选择框中的所有选项(<OPTION>)的一个列表。<br>　　属性<br>　　defaultSelected 选项列表中的缺省选项<br>　　index 选项列表中某选项的索引位置<br>　　length 选项列表中的选项数(<OPTIONS>)<br>　　name 选项列表的名字(NAME特性)<br>　　selected 表示选项列表中某选项<OPTION>是否被选中的一个布尔类型值<br>　　selectedIndex 选项列表中已选中的<OPTION>的索引(位置)<br>　　text 选项列表中<OPTION>标记后的文本<br>　　value 选项列表中的VALUE=特性</p> <p>　　B.23 Password 对象<br>　　它是document对象的一个属性,一个<INPUT TYPE=”PASSWORD”>标记。<br>　　属性<br>　　defaultValue password对象的缺省值(VAlUE=特性)<br>　　name 对象的名字(NAME=特性)<br>　　value 该域具有的当前值最初与VALUE=特性(defauttValue)相同,但是,如果脚本修改了该域中的值,则该值将改变<br>　　方法<br>　　focus 把焦点从该域移开<br>　　blur 把焦点移到该域<br>　　select 选择输入区域</p> <p>　　B.24 radio对象<br>　　它是form对象的一个属性,窗体内的一组单选按钮(选项按钮)(<INPUT TYPE=”RADIO”>)。<br>　　属性<br>　　checked 复选框或选项按钮(单选按钮)的状态<br>　　defaultChecked 复选框或选项按钮(单选按钮)的缺省状态<br>　　length 一组单选按钮中的按钮数<br>　　name 对象的名字(NAME=特性)<br>　　value VALUE=特性<br>　　方法<br>　　click 模拟鼠标单击按钮<br>　　事件处理程序<br>　　onclick 点击</p> <p>　　B.25 reset 对象<br>　　它是form对象的一个属性,复位按钮(<INPUT TYPE=”RESET”>)。<br>　　属性<br>　　name 对象的名字(NAME=特性)<br>　　value VALUE=特性<br>　　方法<br>　　click 模拟鼠标单击按钮<br>　　事件处理程序<br>　　onclick 点击</p> <p>　　B.26 select对象<br>　　它是form对象的一个属性,选择框(<SELECT>)。<br>　　属性<br>　　length 选项列表中的选项数(<OPTIONS>)<br>　　name 选项列表的名字(NAME特性)<br>　　options 列表中的选项数<br>　　selectedlndex 选项列表中已选中的<OPTION>的索引(位置)<br>　　text 选项列表中(OPTION)标记之后的文本<br>　　value 选项列表中的VALUE=特性<br>　　方法<br>　　blur 把焦点从选项列表中移走<br>　　focus 把焦点移到选项列表中<br>　　事件处理程序<br>　　Onblur 失去焦点时事件<br>　　onchange 更改<br>　　Onfocus 聚焦事件</p> <p>　　B.27 string对象<br>　　它不是另一个对象的属性,而是一个内置对象,即一串字符字符串输入脚本中时必须位于引号内。<br>　　属性<br>　　length 字符串中的字符个数<br>　　方法<br>　　anchor() 用来把字符串转换到HTML锚点标记内(<A NAME=>)<br>　　big() 把字符串中的文本变成大字体(<BIG>)<br>　　blink() 把字符串中的文本变成闪烁字体(<BLINK>)<br>　　bold() 把字符串中的文本变成黑字体(<B>)<br>　　charAt() 寻找字符串中指定位置的一个字符<br>　　fixed() 把字符串中的文本变成固定间距字体(<TT>)<br>　　fontcolor() 改变字符串中文本的颜色(<FONT COLOR=>)<br>　　fontsize() 把字符串中的文本变成指定大小(<FONTSIZE=>)<br>　　indexOf() 用来搜索字符串中的某个特殊字符,并返回该字符的索引位置<br>　　italics() 把字符串中的文本变成斜字体(<I>)<br>　　lastlndexOf() 与indexof相似,但是向后搜索最后一个出现的字符<br>　　link() 用来把字符串转换到HTML链接标记中(<A HREF=>)<br>　　small() 把字符串中的文本变成小字体(<SMALL>)<br>　　strike() 把字符串中的文本变成划掉字体(<STRIKE>)<br>　　sub() 把字符串中的文本变成下标(subscript)字体((SUB>)<br>　　substring() 返回字符串里指定位置间的一部分字符串<br>　　sup() 把字符串中的文本变成上标(superscript)字体(<SUP>)<br>　　toLowerCase() 把字符串中的文本变成小写<br>　　toUpperCase() 把字符串中的文本变成大写</p> <p>　　B.28 submit对象<br>　　它是form对象的一个属性,窗体中的一个提交按钮(<INPUT TYPE=”SUBMIT”>)。<br>　　属性<br>　　name 对象的名字(NAME=特性)<br>　　value VALUE=特性<br>　　方法<br>　　click 模拟鼠标单击按钮<br>　　事件处理程序<br>　　Onclick 点击</p> <p>　　B.29 text对象<br>　　它是form对象的一个属性,宙体中的一个文本域(<INPUT TYPE=”TEXT”>)。<br>　　属性<br>　　defaultValue text对象的缺省值(VALUE=特性)<br>　　name 该对象的名字(NAME=特性)<br>　　Value 该域具有的当前值,最初与VALUE=特性(defaultValue)相同但是,如果脚本修改了该域中的值,则该值将改变<br>　　方法<br>　　blur 把焦点从文本框移开<br>　　focus 把焦点移到文本框<br>　　select 选择输入区域<br>　　事件处理程序<br>　　Onblur 失去焦点事件<br>　　Onchange 更改<br>　　Onfocus 聚焦事件<br>　　Onselect 选取事件</p> <p>　　B.30 textarea对象<br>　　它是form对象的一个属性,宙体中的一个文本区域(<TEXTAREA>)。<br>　　属性<br>　　defaultValue textarea对象的缺省值(VALUE=特性)<br>　　name 该对象的名字(NAME=特性)<br>　　value 该域具有的当前值,最初与VALUE=特性(defaultValue)相同,但是,如果脚本修改了该域中的值,则该值将改变了。<br>　　方法<br>　　blur 把焦点从文本区移开<br>　　focus 把焦点移到文本区<br>　　select 选择输入区域事件处理程序<br>　　事件处理程序<br>　　Onblur 失去焦点事件<br>　　Onchange 更改<br>　　Onfocus 聚焦事件<br>　　Onselect 选取事件</p> <p>　　B.31 window对象<br>　　它是一个顶层对象,而不是另一个对象的属性即浏览器的窗口。<br>　　属性<br>　　defaultStatus 缺省的状态条消息<br>　　document 当前显示的文档(该属性本身也是一个对象)<br>　　frame 窗口里的一个框架((FRAME>)(该属性本身也是一个对象)<br>　　frames array 列举窗口的框架对象的数组,按照这些对象在文档中出现的顺序列出(该属性本身也是一个对象)<br>　　history 窗口的历史列表(该属性本身也是一个对象)<br>　　length 窗口内的框架数<br>　　location 窗口所显示文档的完整(绝对)URL(该属性本身也是一个对象)不要把它与如document.location混淆,后者是当前显示文档的URL。用户可以改变window.location(用另一个文档取代当前文档),但却不能改变document.location(因为这是当前显示文档的位置)<br>　　name 窗口打开时,赋予该窗口的名字<br>　　opener 代表使用window.open打开当前窗口的脚本所在的窗口(这是Netscape Navigator 3.0beta 3所引入的一个新属性)<br>　　parent 包含当前框架的窗口的同义词。frame和window对象的一个属性<br>　　self 当前窗口或框架的同义词<br>　　status 状态条中的消息<br>　　top 包含当前框架的最顶层浏览器窗口的同义词<br>　　window 当前窗口或框架的同义词,与self相同<br>　　方法<br>　　alert() 打开一个Alert消息框<br>　　clearTimeout() 用来终止setTimeout方法的工作<br>　　close() 关闭窗口<br>　　confirm() 打开一个Confirm消息框,用户可以选择OK或Cancel,如果用户单击OK,该方法返回true,单击Cancel返回false<br>　　blur() 把焦点从指定窗口移开(这是Netscape Navigator 3.0 beta 3引入的新方法)<br>　　focus() 把指定的窗口带到前台(另一个新方法)<br>　　open() 打开一个新窗口<br>　　prompt() 打开一个Prompt对话框,用户可向该框键入文本,并把键入的文本返回到脚本<br>　　setTimeout() 等待一段指定的毫秒数时间,然后运行指令事件处理程序<br>　　事件处理程序<br>　　Onload() 页面载入时触发<br>　　Onunload() 页面关闭时触发</p> <p> </p> <p> </p> <table width="100%" border="0"> <tbody> <tr> <td valign="top" height="570"> <p><strong><em><strong>JavaScript</strong></em> </strong>是网景（Netscape）公司开发的一种基于客户端浏览器、面向（基于）对象、事件驱动式的网页脚本语言。JavaScript语言的前身叫作Livescript。</p> <ul> <li><strong>JavaScript的特点：</strong> </li> </ul> <ol> <ol> <ol> <li>简单、易学、易用； </li> <li>跨平台；IE、Navigator </li> <li>符合ECMA（欧洲计算机制造协会）标准，可移植； </li> <li>事件驱动式的脚本程序设计思想； </li> <li>动态、交互式的操作方式。 </li> </ol> </ol> </ol> <ul> <li><strong>JavaScript的作用：</strong> </li> </ul> <ol> <ol> <ol> <li>交互式操作； </li> <li>表单验证； </li> <li>网页特效； </li> <li>Web游戏 </li> <li>服务器脚本开发等。 </li> </ol> </ol> </ol> <ul> <li><strong>JavaScript的编写环境：</strong>文本编辑器<br><br></li> <li><strong>JavaScript的执行平台：</strong>Web浏览器<br><br></li> <li><strong>JavaScript的执行方式：</strong>解释执行（由上而下）<br><br></li> <li><strong>JavaScript的版本：</strong>JavaScript1.0——JavaScript1.4<br><br></li> <li><strong>浏览器对JavaScript的支持：</strong> </li> </ul> <ol> <ol> <ol> <li>JavaScript/IE3.0、JavaScript1.2/IE4.0； </li> <li>微软允许用户自行设置对JavaScript处理模式。 </li> </ol> </ol> </ol> <ul> <li><strong>JavaScript与Java、VBScript、JScript的关系：</strong> </li> </ul> <p>　　 JavaScript与Java的区别体现在：<br><br>　　 首先，它们是两个公司开发的不同的两个产品，Java是SUN公司推出的新一代面向对象的程序设计语言，特别适合于Internet应用程序开发；而JavaScript是Netscape公司的产品，其目的是为了扩展Netscape Navigator功能而开发的一种可以嵌入Web页面中的基于对象和事件驱动的解释性语言。<br><br>　　 其次，JavaScript是基于对象的，而Java是面向对象的，即Java是一种真正的面向对象的语言，即使是开发简单的程序，必须设计对象。JavaScript是种脚本语言，它可以用来制作与网络无关的，与用户交互作用的复杂软件。它是一种基于对象和事件驱动的编程语言。因而它本身提供了非常丰富的内部对象供设计人员使用。<br><br>　　 第三，两种语言在其浏览器中所执行的方式不一样。Java的源代码在传递到客户端执行之前，必须经过编译，因而客户端上必须具有相应平台上的仿真器或解释器，它可以通过编译器或解释器实现独立于某个特定的平台编译代码的束缚。JavaScript是一种解释性编程语言，其源代码在发往客户端执行之前不需经过编译，而是将文本格式的字符代码发送给客户，由浏览器解释执行。<br><br>　　 第四，两种语言所采取的变量是不一样的。Java采用强类型变量检查，即所有变量在编译之前必须作声明。JavaScript中变量声明，采用其弱类型。即变量在使用前不需作声明，而是解释器在运行时检查其数据类型。<br><br>　　 第五，代码格式不一样。Java是一种与HTML无关的格式，必须通过像HTML中引用外媒体那么进行装载，其代码以字节代码的形式保存在独立的文档中。JavaScript的代码是一种文本字符格式，可以直接嵌入HTML文档中，并且可动态装载。编写HTML文档就像编辑文本文件一样方便。<br><br>　　 第六，嵌入方式不一样。在HTML文档中，两种编程语言的标识不同，JavaScript使用<script>...</script>来标识，而Java使用<applet> ... </applet> 来标识。<br><br>　　 第七，静态绑定和动态绑定。Java采用静态联编，即Java的对象引用必须在编译时的进行，以使编译器能够实现强类型检查，如不经编译则就无法实现对象引用的检查。JavaScript采用动态联编，即JavaScript的对象引用在运行时进行检查。</p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>JavaScript的格式：</strong> </li> </ul> <ol> <ol> <ol> <li>JavaScript区分大小写； </li> <li>JavaScript脚本程序须嵌入在HTML文件中； </li> <li>JavaScript脚本程序中不能包含HTML标记代码；（双引号） </li> <li>每行写一条脚本语句； </li> <li>语句末尾可以加分号； </li> <li>JavaScript脚本程序可以独立保存为一个外部文件，但其中不能包含<script></script>标签。 </li> </ol> </ol> </ol> <ul> <li><strong>JavaScript脚本程序的几种基本格式：</strong> </li> </ul> <ol> <ol> <ol> <li><script><br>    document.write("Hello World!!!");<br></script><br><br></li> <li><script language="JavaScript"><br>    document.write("Hello World!!!");<br></script><br><br></li> <li><script language="JavaScript" type="text/JavaScript"><br>    document.write("Hello World!!!");<br></script><br><br></li> <li><script language="JavaScript1.2"><br>    document.write("Hello World!!!");<br></script><br><br></li> <li><script src="hello.js"></script><br><br>注意：document.write("Hello World!!!"); 必须保存为一个外部文件：hello.js <br><br></li> <li><script language="JavaScript"><br><!--<br>    document.write("Hello World!!!");<br>--><br></script><br><br></li> <li>使用JavaScript协议：<br><br><a href="JavaScript:alert('Hello World!!!')">请单击</a><br><br><a href="#" οnclick="alert('Hello World!!!')">请单击</a><br><br><a href="JavaScript://" οnclick="alert('Hello World!!!')">请单击</a> </li> </ol> </ol> </ol> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>JavaScript的数据类型：</strong> </li> </ul> <ol> <ol> <ol> <li>数值：整数、浮点数； </li> <li>逻辑值：布尔值； </li> <li>字符串值： </li> <li>空值： </li> <li>未定义值： </li> </ol> </ol> </ol> <ul> <li><strong>JavaScript数据的表示：</strong> </li> </ul> <ol> <ol> <ol> <li>整数：由正负号、数字构成，八进制、十进制、十六进制； </li> <li>浮点数：由正负号、数字和小数点构成，常规记数法、科学记数法； </li> <li>逻辑值：true、false </li> <li>字符串值：单引号、双引号 </li> <li>空值：null </li> <li>未定义值：根本不存在的对象、已定义但没有赋值的量； </li> </ol> </ol> </ol> <ul> <li><strong>JavaScript常量：</strong> </li> </ul> <ol> <ol> <ol> <li>布尔常量：true　　false </li> <li>整数常量：3721　　0007　　0xaff（0Xaff） </li> <li>浮点数常量：3.14　　.001　　3.721e+3　　-3.721E-3 </li> <li>字符串常量："你的E-mail地址有误！" </li> <li>含转义字符的字符串常量：<br><br> <table width="450" border="0"> <tbody> <tr> <th width="120">转义字符</th> <th>意义</th> </tr> <tr> <td align="center">/b</td> <td>退格（Backspace）</td> </tr> <tr> <td align="center">/f</td> <td>换页（Form feed）</td> </tr> <tr> <td align="center">/n</td> <td>换行（New line）</td> </tr> <tr> <td align="center">/r</td> <td>返回（Carriage return）</td> </tr> <tr> <td align="center">/t</td> <td>制表符（Tab）</td> </tr> <tr> <td align="center">/'</td> <td>单引号（'）</td> </tr> <tr> <td align="center">/"</td> <td>双引号（"）</td> </tr> <tr> <td align="center">//</td> <td>反斜线（/）</td> </tr> </tbody> </table> <br><font color="#0000ff"><span class="样式1">document.write("我爱/'JavaScript/'") <br><br>document.write("文件在c://windows//下") <br><br>document.write("<pre>未满十八岁/n不得进入！</pre>") <br><br>document.write("未满十八岁<br>不得进入！") <br><br>document.alert("密码不对/n请重新输入！") </span><br><br></font></li> <li>数组常量：<br><br><span class="样式1"><font color="#0000ff">hobby=["听音乐","看电影"]<br>hobby[0]、hobby[1]<br><br>hobby=["听音乐",,"看电影",] <br>hobby[0]、hobby[1]、hobby[2]、hobby[3]</font></span> </li> </ol> </ol> </ol> <ul> <li><strong>JavaScript变量：</strong> </li> </ul> <ol> <ol> <ol> <li>变量命名规则： <br><br> <ul> <li>首字符必须是大写或小写的字母或下划线（_）或美元符（$）; </li> <li>后续的字符可以是字母、数字、下划线或美元符; </li> <li>变量名称不能是保留字； </li> <li>长度是任意； </li> <li>区分大小写； </li> <li>约定：集中置顶；<br>　　　使用局部变量；<br>　　　易于理解；　　stdId<br>　　　避免混乱。　　usrname　　usrName<br><br></li> </ul> </li> <li>声明变量：<br><br> <ul> <li><span class="样式1"><font color="#0000ff">var stdId;</font></span> </li> <li><span class="样式1"><font color="#0000ff">var name,sex;</font></span> </li> <li><span class="样式1"><font color="#0000ff">var total=3721;</font></span> </li> <li><span class="样式1"><font color="#0000ff">var notNull=true;</font></span> </li> <li><span class="样式1"><font color="#0000ff">var name="李小龙"，sex="先生";</font></span> </li> <li><span class="样式1"><font color="#0000ff">var i=j=0;</font></span> <br><br></li> </ul> </li> <li>变量赋值：<br><br><font color="#0000ff">stdId = 2004007;</font><br><br></li> <li>变量作用域：（方式、位置）<br><br> <ul> <li>全局变量：省略var，或在函数外声明 </li> <li>局部变量：在函数内声明 </li> <li>全局变量可在整个脚本中被使用，可在不同的窗口中相互引用（指定窗口名） </li> <li>例：<br><span class="样式1"><font color="#0000ff"><Script><br>var langJS = "JavaScript"; //langJS是全局变量<br>test(); </font></span> <p class="样式1">function test() {<br>    var langVBS = "VBScript"; //langVBS是局部变量<br>    document.write("<LI>" + langJS);<br>    document.write("<LI>" + langVBS); <br>}</p> <p class="样式1">document.write("<LI>" + langJS);<br>document.write("<LI>" + langVBS);<br></Script></p> </li> </ul> </li> </ol> </ol> </ol> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>JavaScript表达式：</strong> </li> </ul> <ol> <ol> <ol> <li>算术表达式； </li> <li>字符串表达式； </li> <li>关系（比较）表达式； </li> <li>逻辑表达式。 </li> </ol> </ol> </ol> <ul> <li><strong>JavaScript运算符：</strong> </li> </ul> <ol> <ol> <ol> <li>根据处理对象的数目：<br><br> <ul> <li>单元运算符； </li> <li>二元运算符； </li> <li>三元运算符。<br><br></li> </ul> </li> <li>根据功能：<br><br> <ul> <li><font color="#ff0000"><span class="样式2">赋值运算符；</span><br><br><br></font>=　　+=　　-=　　*=　　/=　　%=（取余）<br><br></li> <li><font color="#ff0000"><span class="样式2">算术运算符；</span><br><br><br></font>+　　-　　*　　/　　%（取余）　　++（递增）　　--（递减）　- <br><br>例１： <br><font color="#0000ff"><span class="样式1"><Script><br>var x = 11; <br>var y = 5;<br><br>with (document) {<br>    write("x = 11, y = 5");<br>    write("<LI>x + y 是 ", x + y);<br>    write("<LI>x - y 是 ", x - y);<br>    write("<LI>x * y 是 ", x * y);<br>    write("<LI>x / y 是 ", x / y);<br>    write("<LI>x % y 是 ", x % y);<br>    write("<LI>++ x 是 ", ++ x);<br>    write("<LI>-- y 是 ", -- y);<br>}</span><br><span class="样式1"></Script></span><br><br></font>例２：<br><font color="#0000ff"><span class="样式1"><Script><br>var x = y = 3; <br><br>with (document) {<br>    write("x = 3, y = 3 <br>");<br>    write("若x = y++ 运算之后：");<br>    x = y++;//y→x，y+1→y<br>    write("x 是 ", x, "; y 是 ", y, "<br>");<br>    write("再作x = ++y 运算：");<br>    x = ++y;//y+1→x，y+1→y<br>    write("x 是 ", x, "; y 是 ", y);<br>}<br></Script></span><br><br></font></li> <li><font color="#ff0000"><span class="样式2">字符串运算符；</span><br><br></font>+　　+=<br><br></li> <li><font color="#ff0000"><span class="样式2">比较运算符；</span><br><br><br></font>==　　!=　　===（值及类型）　　!==（值及类型）<br><　　<=　　>　　>=<br><br>例：<br><span class="样式1"><font color="#0000ff"><Script><br>var x = 5; //x 是数值5<br>var y = '5'; //y 是字符串5<br>var z = 6; //x 是数值6<br><br>with (document) {<br>    write("x = 5, y = '5', z = 6");<br>    write("<LI>x == y 吗？", x == y);<br>    write("<LI>x === y 吗？", x === y);<br>    write("<LI>x != y 吗？", x != y);<br>    write("<LI>x !== y 吗？", x !== y);<br>    write("<LI>x <= z 吗？", x <= z);<br>    write("<LI>y <= z 吗？", y <= z);<br>    //类型自动转换<br>}<br></Script><br><br></font></span></li> <li><font color="#ff0000"><span class="样式2">逻辑运算符；</span><br><br><br></font>&&　　||　　! <br><br>例１：<br><font color="#0000ff"><span class="样式1"><Script><br>var t = true;<br>var f = false;<br><br>with(document) {<br>write("<OL><LI>true && true 的结果是 ", t && t);<br>write("<LI>true && false 的结果是 ", t && f);<br>write("<LI>false && true 的结果是 ", f && t);<br>write("<LI>false && false 的结果是 ", f && f);<br>write("<LI>true && (1==1) 的结果是 ", t && (1==1));<br>write("<LI>false && 'A' 的结果是 ", f && 'A');<br>write("<LI>'A' && false 的结果是 ", 'A' && f);<br>write("<LI>true && 'A' 的结果是 ", t && 'A');<br>write("<LI>'A' && true 的结果是 ", 'A' && t);<br>write("<LI>'A' && 'B' 的结果是 ", 'A' && 'B');<br>    //&&：有一个不是逻辑值，只要第一个操作数的值为flase，则返回第一个操作数的值flase，否则，返回第二个操作数的值<br>}<br></span><span class="样式1"></Script></span><br><br></font>例２：<br><font color="#0000ff"><span class="样式1"><Script><br>var t = true;<br>var f = false;<br><br>with(document) {<br>write("<OL><LI>true || true 的结果是 ", t || t);<br>write("<LI>true || false 的结果是 ", t || f);<br>write("<LI>false || true 的结果是 ", f || t);<br>write("<LI>false || false 的结果是 ", f || f);<br>write("<LI>true || (1==1) 的结果是 ", t || (1==1));<br>write("<LI>false || 'A' 的结果是 ", f || 'A');<br>write("<LI>'A' || false 的结果是 ", 'A' || f);<br>write("<LI>true || 'A' 的结果是 ", t || 'A');<br>write("<LI>'A' || true 的结果是 ", 'A' || t);<br>write("<LI>'A' || 'B' 的结果是 ", 'A' || 'B');<br>    //||：有一个不是逻辑值，只要第一个操作数为的值true、字符或非零的数字，则返回第一个操作数的值，否则，返回第二个操作数的值<br>}<br></span><span class="样式1"></Script></span><br><br></font>例３：<br><span class="样式1"><font color="#0000ff"><Script><br>with(document) {<br>    write("<LI>!true 的结果是 ", !true);<br>    write("<LI>!false 的结果是 ", !false);<br>    write("<LI>!'A' 的结果是 ", !'A');<br>    write("<LI>!0 的结果是 ", !0);}<br></Script><br><br></font></span></li> <li><span class="样式2"><font color="#ff0000">逐位运算符；<br><br></font></span></li> <li><font color="#ff0000"><span class="样式2">特殊运算符。</span><br><br></font>1、new运算符：创建对象（实例）<br><br>　　　 格式：对象名称=new 对象类型（参数）<br><br>2、this运算符：表示当前对象<br><br>　　　 格式：this[.属性]<br><br>例：<br><span class="样式1"><font color="#0000ff"><Script><br>function validate(obj) {<br>    alert("你输入的值是："+ obj.value);<br>} </font></span><span class="样式1"><font color="#0000ff"></Script><br>请输入任意字符：<BR><br><INPUT TYPE="text" onKeyup="validate(this)"><br><br></font></span>3、条件运算符：三元运算符<br><br>格式：<条件表达式> ? 第一个值：第二个值<br><br>例：<br><span class="样式1"><font color="#0000ff">NS = (document.layers) ? 1 : 0;<br>IE = (document.all) ? 1: 0;</font></span> <br><br><span class="样式1"><font color="#0000ff">window.screen.width>800 ? imgheight=100:imgheight=100<br>window.screen.width>800 ? imgleft=15:imgleft=122</font></span> <br><br><span class="样式1"><font color="#0000ff"><Script><br>function showSex() {<br>onOroff = document.forms[0].sex[0].checked<br>status = (onOroff)? "帅哥" : "美女"<br>alert("Hello! " + status)<br>}<br></Script> </font></span> <p class="样式1">请输入你的性别：<br><FORM onClick=showSex()><br><INPUT TYPE=radio NAME=sex>男生<br><INPUT TYPE=radio NAME=sex>女生<br></FORM></p> <br><br></li> </ul> </li> <li>运算符执行的优先顺序：<br><br> <table width="450" border="0"> <tbody> <tr> <th width="70">类型</th> <th>运算符</th> </tr> <tr> <td align="center">括号</td> <td>()</td> </tr> <tr> <td align="center">一元</td> <td>! ~ - ++ -- typeof void delete </td> </tr> <tr> <td align="center">算术</td> <td>* / + - </td> </tr> <tr> <td align="center">位位移</td> <td><< >> >>> </td> </tr> <tr> <td align="center">比较</td> <td>< <= > >= == != </td> </tr> <tr> <td align="center">位逻辑</td> <td>& ^（xor） | </td> </tr> <tr> <td align="center">逻辑</td> <td>&& || </td> </tr> <tr> <td align="center">三元条件</td> <td>?</td> </tr> <tr> <td align="center">赋值</td> <td>= += -= *= /= %= <<= >>= >>>= &= ^= |= </td> </tr> </tbody> </table> </li> </ol> </ol> </ol> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td><strong>　</strong></td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>JavaScript语句：</strong> </li> </ul> <ol> <ol> <li>注释语句：<br><br> <ul> <li>单行注释：//注释文字 </li> <li>多行注释：/*<br>　　　　　 注释文字<br>　　　　　*/<br><br></li> <li>例：<br><font color="#0000ff"><span class="样式1">/***************************************<br>*             源 码 之 家               *<br>*        http://www.mycodes.net         *<br>*      下载:http://www.mycodes.net      *<br>*     论坛http://www.mycodes.net/bbs    *<br>*****************************************/</span><br><br></font></li> </ul> </li> <li>with语句： （对象操作语句）<br><br> <ul> <li>功能：为一段程序建立默认对象。 </li> <li>格式：<br>with (<对象>){<br>　　<语句组><br>｝<br><br></li> <li>例１：<br><font color="#0000ff"><span class="样式1">with (document) {<br>    write ("限时抢购物品：");<br>    write ("<Li>ViewSonic 17/" 显示器。");<br>    write ("<Li>EPSON 打印机。");<br>}<br></span><br></font></li> <li>例２：<br><font color="#0000ff"><span class="样式1">document.write ("限时抢购物品：");<br>document.write ("<Li>ViewSonic 17/" 显示器。");<br>document.write ("<Li>EPSON 打印机。");<br></span><br></font></li> </ul> </li> <li>if...else语句：<br><br>格式1：<br><br><br>if (<表达式>)<br>    <语句1>;<br>else<br>    <语句2>;<br><br>if (<表达式>) <语句1>;<br>else <语句2>;<br><br>例：<br><font color="#0000ff"><span class="样式1"><Script> <br>var now = new Date();<br>var hour = now.getHours();<br><br>if (6 < hour && hour < 18)<br>    document.write ("辛勤工作才能快乐收割！");<br>else<br>    document.write ("休息一下，充电后再出发。");<br></Script></span><br><br></font>格式2：<br><br><br>if (<表达式>){<br>    <语句组1><br>}else{<br>    <语句组2><br>}<br><br><br><br>格式3：<br><br><br>if (<表达式1>){<br>    <语句组1><br>}else if (<表达式2>){<br>    <语句组2><br>}else{<br>    <语句组3><br>} <br><br><br>例1：<br><font color="#0000ff"><span class="样式1"><Script> <br>var now = new Date();<br>var day = now.getDay();<br>var dayName;<br><br>if (day == 0) dayName = "星期日";<br>else if (day == 1) dayName = "星期一";<br>else if (day == 2) dayName = "星期二"; <br>else if (day == 3) dayName = "星期三";<br>else if (day == 4) dayName = "星期四"; <br>else if (day == 5) dayName = "星期五";<br>else dayName = "星期六"; <br><br>document.write ("今天是快乐的", dayName);<br></Script></span><br><br></font>例2：<br><font color="#0000ff"><span class="样式1"><Script> <br>var now = new Date();<br>var day = now.getDay();<br>var dayName;<br><br>if (day = 0) dayName = "星期日";<br>else if (day = 1) dayName = "星期一";<br>else if (day = 2) dayName = "星期二"; <br>else if (day = 3) dayName = "星期三";<br>else if (day = 4) dayName = "星期四"; <br>else if (day = 5) dayName = "星期五";<br>else dayName = "星期六"; <br><br>document.write ("今天是快乐的", dayName);<br></Script></span><br><br></font></li> <li>while语句：<br><br>格式1：<br><br>while (<表达式>)<br>    语句；<br><br>格式2：<br><br>while (<表达式>){<br>    <语句组><br>}<br><br><br>例：<br><span class="样式1"><font color="#0000ff"><Script> <br>var i = 5;<br><br>while ( i > 0 ) {<br>    document.write("i = " ,i ,"<BR>");<br>    i--;<br>} </font></span> <p class="样式1"></Script><br></p> </li> <li>do...while语句：<br><br>格式：<br><br>do {<br>    <语句组><br>} while (<表达式>) <br> <br><br>例：<br><span class="样式1"><font color="#0000ff"><Script> <br>var i = 5;<br><br>do {<br>    document.write("i = " ,i ,"<BR>");<br>    i--;<br>} while ( i > 0 ) </font></span> <p><font color="#0000ff"><span class="样式1"></Script></span><br></font></p> </li> <li>for语句：<br><br>格式：<br><br>for (<初始表达式>；<条件表达式>；<变动量表达式>){<br>    <语句组><br>}<br> <br><br>例：<br><span class="样式1"><font color="#0000ff"><Script> <br>for ( var i = 5; i > 0; i-- ) {<br>    document.write("i = " ,i ,"<BR>");<br>} </font></span> <p class="样式1"></Script><br></p> </li> <li>for...in语句：重复执行指定对象的所有属性<br><br>格式：<br><br>for ( 变量 in 对象 ){<br>    <语句组><br>} <br><br>例：<br><span class="样式1"><font color="#0000ff"><Script><br>function member(name, sex) {//构造函数member<br>    this.name = name;<br>    this.sex = sex;<br>}<br><br>function showProperty(obj, objString) {<br>var str = "";<br>for (var i in obj)<br>    str += objString + "." + i + " = " + obj[i] + "<BR>";<br> return str;<br>}<br><br>papa = new member("杨宏文", "男生");//建立对象实例papa<br>document.write(showProperty(papa, "papa")) </font></span> <p class="样式1"></Script><br></p> </li> <li>break语句：<br><br>格式：break<br><br>例：<br><span class="样式1"><font color="#0000ff"><Script> <br>var i = 5;<br>while ( i > 0 ) {<br>    if ( i == 3 ) break;<br>    document.write("i = " ,i ,"<BR>");<br>    i--;<br>} </font></span> <p class="样式1"></Script></p> </li> <li>continue语句：<br><br>格式：continue<br><br>例：<br><span class="样式1"><font color="#0000ff"><Script> <br>var i = 5;<br>while ( i > 0 ) {<br>    i--; <br>    if ( i == 3 ) continue; <br>    document.write("i = " ,i ,"<BR>"); <br>} </font></span> <p class="样式1"></Script></p> </li> <li>switch语句：<br><br>格式：<br><br>switch (<表达式>) {<br>    case <数值1>:<语句组1><br>                 break;<br>    case <数值2>:<语句组2><br>                 break;<br>    ...<br>    default <语句组> <br>} <br><br><br>例：<br><span class="样式1"><font color="#0000ff"><Script> <br>function greet(givenSex) {<br>switch(givenSex) { <br>    case "帅哥" : alert("你好啊！");<br>                  break;<br>    case "美女" : alert("你好啊！");<br>                  break;<br>}<br>}<br></Script> </font></span> <p class="样式1">请输入性别：<br><FORM><br><INPUT TYPE="radio" NAME="sex" onClick="greet('帅哥')"><br>帅哥<br><INPUT TYPE="radio" NAME="sex" onClick="greet('美女')"><br>美女<br></FORM></p> </li> </ol> </ol> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>对象：</strong><br><br>对象是一组具有属性和方法的经过组织的数据。<br><br></li> <li><strong>默认对象：</strong> </li> </ul> <ol> <ol> <ol> <li><span class="样式2"><font color="#ff0000">日期对象；</font></span>（日期基线：1970年1月1日00：00：00）<br><br><strong>建立日期对象(实例)：</strong><br><br>　　格式：日期对象名称=new Date([日期参数]) <br><br>　　日期参数：1.省略；<br>　　　　　　　2.英文-数值格式：月 日，公元年 [时：分：秒] <br>　　　　　　　　　如：<font color="#0000ff"><span class="样式1">today=new Date("October 1,2008 12:00:00")</span><br></font>　　　　　　　3.数值格式：公元年，月，日，[时，分，秒] <br>　　　　　　　　　如：<font color="#0000ff"><span class="样式1">today=new Date(2008,10,1)</span><br><br></font><strong>日期对象的方法：<br><br></strong>　　格式：日期对象名称.方法（[参数]）<br><br>获取当地时间： <br> <table width="450" border="0"> <tbody> <tr> <td align="center" width="180">getYear()</td> <td>返回年份数</td> </tr> <tr> <td align="center">getFullYear()</td> <td>返回年份数</td> </tr> <tr> <td align="center">getMonth()</td> <td>返回月份数（0--11）</td> </tr> <tr> <td align="center">getDate()</td> <td>返回日期数（1--31）</td> </tr> <tr> <td align="center">getDay()</td> <td>返回星期数（0--6）</td> </tr> <tr> <td align="center">getHours()</td> <td>返回时数（0--23）</td> </tr> <tr> <td align="center">getMinutes()</td> <td>返回分数（0--59）</td> </tr> <tr> <td align="center">getSeconds()</td> <td>返回秒数（0--59）</td> </tr> <tr> <td align="center">getMilliseconds()</td> <td>返回毫秒数（0--999）</td> </tr> <tr> <td align="center">getTime()</td> <td>返回对应日期基线的毫秒</td> </tr> <tr> <td align="center">Date.parse(日期字串)</td> <td>返回对应日期基线的毫秒</td> </tr> <tr> <td align="center">setTime(时间值)</td> <td>指定一日期对象的值</td> </tr> <tr> <td align="center">toGMTString()</td> <td>以GMT格式表示日期对象</td> </tr> <tr> <td align="center">toUTCString()</td> <td>以GMT格式表示日期对象</td> </tr> </tbody> </table> <br><br></li> <li><span class="样式2"><font color="#ff0000">数组对象；</font></span> <br><br><strong>建立数组对象：</strong><br><br>　　 格式１：数组对象名称=new Array([元素个数])<br>　　 格式２：数组对象名称=new Array([[元素1][，元素2，...]])<br>　　 格式３：数组对象名称=[元素1[，元素2，...]]<br><br>　　 例：<br>　　　　 <font color="#0000ff"><span class="样式1">fruit=new Array(3);// fruit=new Array();<br>　　　　 fruit[0]="苹果";<br>　　　　 fruit[1]="梨子";<br>　　　　 fruit[2]="橘子";<br><br>　　　　 fruit=new Array("苹果"，"梨子"，"橘子");</span><br><br><span class="样式1">　　　　 fruit=["苹果"，"梨子"，"橘子"];</span><br><br></font><strong>数组对象的属性：</strong><br><br>　　格式：数组对象名称.属性<br><br>　　属性：length　　数组长度<br><br>　　例：<br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">var fruit = new Array("苹果", "梨子", "橘子");<br>var i;<br><br>for (i=0; i < fruit.length; i++) {<br>    document.write("fruit [", i, "] = ", fruit[i], "<br>")<br>}<br><br></Script></p> <br><strong>数组对象的方法：</strong><br><br>　　格式：数组对象名称.方法([参数])<br><br>　　方法： <table width="450" border="0"> <tbody> <tr> <td align="center" width="180">join([分隔符])</td> <td>数组元素组合为字符串</td> </tr> <tr> <td align="center">toString()</td> <td>以字符串表示数组</td> </tr> <tr> <td align="center">reverse()</td> <td>数组反转</td> </tr> <tr> <td align="center">valueOf()</td> <td>返回数组值</td> </tr> </tbody> </table> <br>　　 例：<br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">var fruit = new Array("苹果", "梨子", "橘子");<br><br>document.write("<LI>", fruit.join());<br>document.write("<LI>", fruit.join("、"));<br>document.write("<LI>", fruit.toString());<br>document.write("<LI>", fruit.reverse().join());<br>document.write("<LI>", fruit.valueOf());<br><br></Script><br></p> <strong>二维数组：</strong><br><br>　　 例：<br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">var fruit = new Array(3);<br>fruit[0] = new Array("苹果", 2);<br>fruit[1] = new Array("梨子", 4);<br>fruit[2] = new Array("橘子", 2);<br><br>for (i=0; i < fruit.length; i++) {<br>  for (j=0; j < fruit[0].length; j++) {<br>    document.write("fruit [", i, "][", j, "] = ", fruit[i][j],"<br>");<br>  }<br>  document.write("<br>");<br>}<br><br></Script></p> </li> <li><span class="样式2"><font color="#ff0000">字符串对象；</font></span> <br><br><strong>建立字符串对象：</strong><br><br>　　格式：字符串对象名称=new String(字符串常量)<br>　　格式：字符串变量名称="字符串常量"<br><br><strong>字符串对象的属性：</strong><br><br>　　格式：字符串对象名称.属性<br><br>　　属性：length　　 字符串长度 <br><br><strong>字符串对象的方法：</strong><br><br>　　格式：字符串对象名称.方法<br><br>　　方法： <table width="620" border="0"> <tbody> <tr> <td align="center" width="250">bold()</td> <td>粗体</td> </tr> <tr> <td align="center">italtics()</td> <td>斜体</td> </tr> <tr> <td align="center">strike()</td> <td>删除线</td> </tr> <tr> <td align="center">fontsize(字级大小)</td> <td>文字大小</td> </tr> <tr> <td align="center">fontcolor(#rrggbb)</td> <td>文字颜色</td> </tr> <tr> <td align="center">sup()</td> <td>上标</td> </tr> <tr> <td align="center">sub()</td> <td>下标</td> </tr> <tr> <td align="center">toUpperCase()</td> <td>大写</td> </tr> <tr> <td align="center">toLowerCase()</td> <td>小写</td> </tr> <tr> <td align="center">charAt(索引)</td> <td>返回索引位置的字符</td> </tr> <tr> <td align="center">charCodeAt(索引)</td> <td>返回索引位置的ASCII字符码，十进制表示</td> </tr> <tr> <td align="center">indexOf("字串"[,索引])</td> <td>返回字串在对象中的索引位置</td> </tr> <tr> <td align="center">lastIndexOf("字串"[,索引])</td> <td>返回字串在对象中的索引位置（反向搜索）</td> </tr> <tr> <td align="center">search("字串")</td> <td>返回字串在对象中的索引位置</td> </tr> <tr> <td align="center">replace("字串1","字串2")</td> <td>字串2替换字串1</td> </tr> <tr> <td align="center">slice(索引i[,索引j])</td> <td>返回索引i倒索引j-1的子串</td> </tr> <tr> <td align="center">split(["字串"][,限制])</td> <td>将字串从对象中删除</td> </tr> <tr> <td align="center">substr(start[,length])</td> <td>返回特定长度的字串</td> </tr> <tr> <td align="center">substring(索引i[,索引j])</td> <td>返回索引i倒索引j-1的子串</td> </tr> <tr> <td align="center">link("url")</td> <td>设置链接</td> </tr> <tr> <td align="center">match(/匹配字符/)</td> <td> <table> <tbody> <tr> <td valign="top" width="33%"> <p>/d </p> </td> <td valign="top" width="67%"> <p>匹配一个数字字符。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/D </p> </td> <td valign="top" width="67%"> <p>匹配一个非数字字符。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/n </p> </td> <td valign="top" width="67%"> <p>匹配一个换行符。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/r </p> </td> <td valign="top" width="67%"> <p>匹配一个回车符。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/s </p> </td> <td valign="top" width="67%"> <p>匹配一个空格符。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/S </p> </td> <td valign="top" width="67%"> <p>匹配任意非空格符。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/t </p> </td> <td valign="top" width="67%"> <p>匹配一个table符。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/W </p> </td> <td valign="top" width="67%"> <p>匹配任何非单词符。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/num </p> </td> <td valign="top" width="67%"> <p>匹配正整数num。 </p> </td> </tr> <tr> <td valign="top" width="33%"> <p>/n/ </p> </td> <td valign="top" width="67%"> <p>匹配八进制，十六进制，十进制的escape值。 </p> </td> </tr> </tbody> </table> </td> </tr> <tr> <td align="center">toString()</td> <td>返回字符串</td> </tr> <tr> <td align="center">valueOf()</td> <td>返回字符串值</td> </tr> </tbody> </table> <br>　　例1：<br><font color="#0000ff"><span class="样式1"><Script><br>var str = "JavaScript";<br><br>document.write(str.bold(),"<BR>");<br>document.write(str.fixed(),"<BR>");<br>document.write(str.fontcolor("red"),"<BR>");<br>document.write(str.fontsize(5),"<BR>");<br><br></Script></span><br><br></font>　　例2：<br><span class="样式1"><font color="#0000ff"><Script><br><br>var str = "JavaScript";<br>var num = 1234;<br><br>document.write(str.toUpperCase(), "<BR>"); <br>document.write(num.toString().charAt(2),"<BR>");<br>document.write(str.substring(0,4), "<BR>"); </font></span> <p class="样式1"></Script></p> <br>　　例3：<br><span class="样式1"><font color="#0000ff"><Script><br><br>var str = "JavaScript"; </font></span> <p class="样式1">document.write(str, " 有 ", str.length, " 个字<BR>");<br>document.write(str.fontcolor("green"), " 不是 ");<br>document.write(str.substr(0,4).fontcolor("red"));<br>document.write(" 也不是 ", str.replace("Java", "VB"));</p> <p class="样式1"></Script></p> <br>　　例4：<br><span class="样式1"><font color="#0000ff"><Script><br><br>var str = "hubert@abc.com.cn";<br>var idx = str.search("@");<br>var usr = str.substr(0,idx); </font></span> <p class="样式1">document.write(usr.toUpperCase().fontsize(7), "<BR>");<br>document.write("你的电子信箱是", str);</p> <p class="样式1"></Script></p> <br>　　例5：<br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">function isEmail(){<br>  var str = document.form1.add.value;<br>  if (str.indexOf("@") == -1)<br>    alert("请填写正确的EMail地址");<br>  else<br>    alert("OK!");<br>}</p> <p class="样式1"></Script></p> <p class="样式1"><FORM name="form1"><br>请输入你的 EMail 地址：<br><INPUT TYPE="text" name="add"><br><INPUT TYPE="button" value="开始检查" onClick="isEmail()"><br></FORM></p> </li> <li><span class="样式2"><font color="#ff0000">布尔对象；<br><br></font></span><strong>建立布尔对象：</strong><br><br>　　 格式：布尔对象名称=new Boolean(转换值) <br>　　 转换值：null、未定义、0、或false均转换成false<br><br><strong>布尔对象的方法：</strong> <br><br>　　格式：布尔对象名称.方法 <br>　　方法：toString() <br>　　　　　valueOf() <br>　　例：<br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">x = new Boolean();<br>y = new Boolean(true);<br>z = new Boolean(0);<br><br>document.write(x, "<br>");<br>document.write(y, "<br>");<br>document.write(z, "<br>");<br><br></Script></p> </li> <li><span class="样式2"><font color="#ff0000">数学对象；（静态对象）<br><br></font></span><strong>数学对象的属性：</strong><br><br>　　格式：Math.属性<br>　　属性： <table width="450" border="0"> <tbody> <tr> <td align="center" width="160">E</td> <td>自然对数的底数</td> </tr> <tr> <td align="center">LN2</td> <td>2的自然对数</td> </tr> <tr> <td align="center">LN10</td> <td>10的自然对数</td> </tr> <tr> <td align="center">LOG2E</td> <td>以2为底e的对数</td> </tr> <tr> <td align="center">LOG10E</td> <td>以10为底e的对数</td> </tr> <tr> <td align="center">PI</td> <td>圆周率</td> </tr> <tr> <td align="center">SQRT1_2</td> <td>1/2的平方根</td> </tr> <tr> <td align="center">SQRT2</td> <td>2的平方根</td> </tr> </tbody> </table> <br><br><strong>数学对象的方法：</strong><br><br>　　格式：Math.方法（参数）<br>　　方法： <table width="450" border="0"> <tbody> <tr> <td align="center" width="160">ceil(数值)</td> <td>大于等于该数值的最小整数</td> </tr> <tr> <td align="center">floor(数值)</td> <td>小于等于该数值的最大整数</td> </tr> <tr> <td align="center">min(数值1,数值2)</td> <td>最小值</td> </tr> <tr> <td align="center">max(数值1,数值2)</td> <td>最大值</td> </tr> <tr> <td align="center">pow(数值1,数值2)</td> <td>数值1的数值2次方</td> </tr> <tr> <td align="center">random()</td> <td>0倒1的随机数</td> </tr> <tr> <td align="center">round(数值)</td> <td>最接近该数值的整数</td> </tr> <tr> <td align="center">sqrt(数值)</td> <td>开平方根</td> </tr> <tr> <td align="center" colspan="2">abs、sin(弧度)、cos、tan、asin、acos、atan、exp、log</td> </tr> </tbody> </table> <br>　　例1：<br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">with (document) {<br>    write("<LI>2 的平方根值是 ", Math.sqrt(2));<br>    write("<LI>2 ³ = ", Math.pow(2,3));<br>    write("<LI>最接近 3.14 的整数是 ", Math.round(3.14));<br>}<br><br></Script></p> <br>　　例2： <br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">var now = new Date();<br>var firstDay = new Date("Nov 10, 1999");<br>var duration = now - firstDay;<br>var msPerDay = 24 * 60 * 60 * 1000; //换算成毫秒<br>days = Math.round(duration/msPerDay);</p> <p><span class="样式1"><font color="#0000ff">document.write("本网站已经开幕" + days + "天了");<br><br></Script><br><br></font></span>例3：<br><span class="样式1"><font color="#0000ff"><Script><br><br>var promote = new Array(3);<br>promote[0] = "拍卖区又有新货到了，赶快来捡便宜啊......"<br>promote[1] = "成为会员，马上享受八折优惠，还可以参加抽奖！";<br>promote[2] = "庆祝访问人数突破十万人次，填问卷就送大奖，快来啊！";</font></span></p> <p class="样式1">index = Math.floor(Math.random() * promote.length);<br>document.write(promote[index]);<br><br></Script></p> </li> <li><span class="样式2"><font color="#ff0000">数值对象；</font></span> </li> <li><span class="样式2"><font color="#ff0000">函数对象；<br><br></font></span></li> <li><span class="样式2"><font color="#ff0000">自定义对象。</font></span> <br><br> <ul> <li><strong>自定义对象； </strong> <ul> <li>构造函数定义对象类型； </li> <li>建立对象实例。 </li> </ul> </li> <li>例：<br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">function member(name, sex) {<br>    this.name = name;<br>    this.sex = sex;<br>}<br><br>var papa = new member("杨宏文", "男生");<br>var mama = new member("黄雅玲", "女生");<br>var doggy = new member("奇　奇", "宠物狗");<br><br>document.write(papa.name);<br>document.write("是", papa.sex);</p> <p class="样式1"></Script></p> </li> <li><strong>动态的定义对象属性；</strong> </li> <li>例：<br>为指定的对象实例定义属性：<font color="#0000ff"><span class="样式1">papa.hobby="看电视";</span><br></font>为对象定义属性：<span class="样式1"><font color="#0000ff">member.prototype.hobby=null;<br>　　　　　　　　papa.hobby="上网"; <br>　　　　　　　　mama.hobby="逛街"; <br>　　　　　　　　doggy.hobby="啃骨头"; <br><br></font></span></li> <li><strong>定义对象的方法；</strong> <ul> <li>构造函数定义对象方法名； </li> <li>建立方法的描述函数。 </li> </ul> </li> <li>例：<br><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">function member(name, sex) {<br>  this.name = name;<br>  this.sex = sex;<br>  this.display = display;<br>}<br><br>function display() {<br>  var str = this.name + "是" + this.sex;<br>  document.write("<LI>" + str);<br>}<br><br>var papa = new member("杨宏文", "男生");<br>var mama = new member("黄雅玲", "女生");<br>var doggy = new member("奇　奇", "宠物狗");</p> <p class="样式1">papa.display();<br>mama.display();<br>doggy.display();<br><br></Script></p> </li> </ul> </li> <li><font color="#ff0000"><span class="样式2">利用对象原型（prototype）为默认对象定义属性：</span><br><br></font><span class="样式1"><font color="#0000ff"><Script> </font></span> <p class="样式1">String.prototype.replaceAll = strReplace;<br>function strReplace(findText, replaceText) {<br>  var str = new String(this);<br>  while (str.indexOf(findText)!=-1) {<br>    str = str.replace(findText, replaceText);<br>  }<br>  return str;<br>}<br><br>myStr = "告诉你 － 如果你正在寻找一本能帮助你彻底研究" +<br>"JavaScript的书籍，请你一定要认明碁峰的" +<br>"JavaScript教学范本，让你事半功倍，功力大增。";<br>document.write("<LI>原稿是：<BLOCKQUOTE>" + myStr +"</BLOCKQUOTE>");<br>document.write("<LI>利用Replace()将「你」改成「您」："<br>+"<BLOCKQUOTE>" + myStr.replace('你','您') +"</BLOCKQUOTE>");<br>document.write("<LI>利用自定义的字符串方法 - 全部取代"<br>+"<BLOCKQUOTE>" + myStr.replaceAll('你','您') +"</BLOCKQUOTE>");</p> <p class="样式1"></Script></p> </li> </ol> </ol> </ol> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>默认函数：</strong> </li> </ul> <ol> <ol> <ol> <li>编码函数 escape()：将非字母、数字字符转换成ASCII码<br><br>例：<font color="#0000ff">sample/unescape</font><br><br></li> <li>译码函数 unescape()：将ASCII码转换成字母、数字字符<br><br>例：<font color="#0000ff">sample/unescape</font><br><br></li> <li>求值函数 eval()：<br><br>格式：eval(<表达式>)<br><br>例1：字符串运算<br><font color="#0000ff"><Script> <p>x = 1 + 2;<br>y = "1 + 2";<br>z = eval("1 + 2");<br><br>document.write("<LI>1 + 2 = ", x);<br>document.write("<LI>/"1 + 2/" = ", y);<br>document.write("<LI>eval(/"1 + 2/") = ", z);<br><br></Script></p> </font><br>例2：对象操作<br><font color="#0000ff"><Script><br><br>function show(obj){<br>    var str=eval("document.form."+obj+".value");<br>    alert(str);<br>}<br></Script><br><br><form name="form" id="form"><br>姓名：<br> <input name="name" type="text" id="name"><br> <input type="button" name="Button" value="Button" οnclick=show("name")><br></form></font><br><br></li> <li>数值判断函数 isNaN()：是否为数值<br><br>格式：isNaN(<量>)<br><br>例：<br><font color="#0000ff"><Script> <p>var x = 15;<br>var y = "黄雅玲";<br><br>document.write("<LI>x 不是数值吗？",isNaN(x));<br>document.write("<LI>y 不是数值吗？",isNaN(y));<br><br></Script></p> </font></li> <li>整数转换函数 parseInt()：将不同进制（二、八、十六）的数值转换成十进制整数<br><br>格式：parseInt(数值字串[，底数]) <br>底数省略，则按内容转换：<br>　　　　　0x　0X　　十六进制　　<br>　　　　　0　　八进制<br>　　　　　其它　　十进制<br><br>例：<br><font color="#0000ff"><Script> <p>// 二进位转成十进位<br><br>document.write("1101₂ = " ,parseInt("1101", 2),"₁₀<br>");</p> <p>// 十六进位转成十进位</p> </font> <p><font color="#0000ff">document.write("BFFF₁₆ = " ,parseInt("BFFF", 16),"₁₀<br>");<br><br></Script><br></font></p> </li> <li>浮点数转换函数 parseFloat()：将数值字串转换成浮点数<br><br>格式：parseFloat (数值字串)<br><br>例：<br><font color="#0000ff"><Script> <p>document.write(parseInt("3.1234A56"), "<br>");<br>document.write(parseFloat("3.1234A56"), "<br>");<br><br></Script></p> </font></li> </ol> </ol> </ol> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>函数：</strong> </li> </ul> <blockquote> <p>独立于主程序的、具有特定功能的一段程序代码块。</p> </blockquote> <ul> <li><strong>函数的定义：</strong> </li> </ul> <blockquote> <p>格式：<br><font color="#0000ff">function 函数名([参数[,参数...]]){<br>    <语句组><br>    [return <表达式>；] <br>}</font> </p> <p>约定：<br>1、函数名：易于识别；（同变量命名规则）<br>2、程序代码：模块化设计；<br>3、函数位置：按逻辑顺序，集中置顶。（<head>...</head>）</p> </blockquote> <ul> <li><strong>return语句：</strong> </li> </ul> <blockquote> <p>格式：<br><font color="#0000ff">return <表达式>；<br><br></font>功能：返回表达式的值。 </p> </blockquote> <ul> <li><strong>函数的调用：</strong> </li> </ul> <blockquote> <p>格式：<br><font color="#0000ff">函数名([参数[,参数...]])</font> </p> <p>例1：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">function showName(name){<br>    document.write ( "我是" + name );<br>}</font></p> <p><font color="#0000ff">showName("黄雅玲");</font></p> <p><font color="#0000ff"></Script></font></p> <p>例2：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">function showName(name){<br>    str="我是" + name;<br>    return str;<br>}</font></p> <p><font color="#0000ff">document.write(showName("黄雅玲"));</font></p> <p><font color="#0000ff"></Script></font><br></p> </blockquote> <p>  </p> <ul> <li><strong>事件：</strong> <p>用户对浏览器所做的特定的动作（操作），是实现交互操作的一种机制。</p> </li> </ul> <table width="100%" border="0"> <tbody> <tr> <th width="80">事件名称</th> <th>适用对象</th> <th>意义</th> <th>说明</th> </tr> <tr> <td align="center">Abort</td> <td align="center">image</td> <td align="center">终止</td> <td>当图形尚未完全加载前</td> </tr> <tr> <td align="center">Blur</td> <td align="center"> </td> <td align="center">失去焦点</td> <td> </td> </tr> <tr> <td align="center">Change</td> <td align="center">t/pw/ta/select</td> <td align="center">改变</td> <td> </td> </tr> <tr> <td align="center">DragDrop</td> <td align="center">window</td> <td align="center">拖曳</td> <td> </td> </tr> <tr> <td align="center">Error</td> <td align="center"> </td> <td align="center">img/win</td> <td>错误加载文件或图形时发生错误</td> </tr> <tr> <td align="center">Focus</td> <td align="center"> </td> <td align="center">取得焦点</td> <td> </td> </tr> <tr> <td align="center">Move</td> <td align="center">window</td> <td align="center">移动</td> <td> </td> </tr> <tr> <td align="center">Reset</td> <td align="center">form</td> <td align="center">重置</td> <td> </td> </tr> <tr> <td align="center">Submit</td> <td align="center">form</td> <td align="center"> </td> <td> </td> </tr> <tr> <td align="center" colspan="4">Click/DblClick、KeyDown/KeyPress/KeyUp、Load/Unload、MouseDown/MouseUp/MouseOver/MouseOut/MouseMove</td> </tr> </tbody> </table> <p> </p> <ul> <li><strong>事件处理程序：</strong> </li> </ul> <blockquote> <p>浏览器响应某个事件，实现用户的交互操作而进行的处理（过程）。</p> </blockquote> <ul> <li><strong>事件处理程序的调用：</strong> <blockquote> <p>浏览器等待用户的交互操作，并在事件发生时，自动调用事件处理程序（函数），完成事件处理过程。</p> <p><strong>HTML标签属性：</strong><br><br>格式：<br><font color="#0000ff"><tag on事件=“<语句组>|<函数名>”> <br><br></font>例1： <br><font color="#0000ff"><body οnlοad="alert('建议浏览器的分辨率：800x600');"><br><body οnlοad="var str='建议浏览器的分辨率：800x600';alert(str);"><br><br></font>例2：<br><font color="#0000ff"><script> <br>function show(){<br>    var str="建议浏览器的分辨率：800x600";<br>    alert(str);<br>}<br></script><br><body οnlοad="show();"><br><br></font></p> <p><strong>对象属性：</strong><br><br>格式：<br><font color="#0000ff">对象名.on事件=<语句>|<函数名></font><br><font color="#0000ff"><br></font>例1： <br><font color="#0000ff">document.</font><font color="#0000ff">οnlοad=alert("建议浏览器的分辨率：800x600");<br><br>var str="建议浏览器的分辨率：800x600"; <br>document.οnlοad=alert(str);<br><br></font>例2：<br><font color="#0000ff"><script> <br>function show(){<br>    var str="建议浏览器的分辨率：800x600";<br>    alert(str);<br>}<br>document.οnlοad=show();<br></script> <br></font></p> </blockquote></li> </ul> <p>例1： <br><font color="#0000ff"><Body><br><FORM><br>请输入基本资料：<BR><br>姓名：<br><INPUT TYPE="text" NAME="usr" SIZE="8"><br><INPUT TYPE="button" VALUE=" 请单击" onClick="alert('谢谢你的填写...')"><br></Body></font></p> <p>例2：<br><font color="#0000ff"><Script><br>function handelError(img){<br>    msg = "有一图文件，名为： /'" + img.name + "/'/n无法顺利显示，请通知系统管理人员" + "，敬备薄礼相送。";<br>    alert(msg);<br>}<br></Script></font></p> <p><font color="#0000ff"><IMG SRC="abc.gif" NAME="中国电信的广告" onError="handelError(this)"></font></p> <p>例3：<br><font color="#0000ff"><Body><br><A HREF="http://www.hubert.idv.tw/" onMouseOver="status='最棒的学习网站';return true;" onMouseOut="status='完毕'">文哥网络技术学习网</A><br></Body></font></p> <p>例4：<br><font color="#0000ff"><Body><br><FONT STYLE="cursor:hand" onClick="location='http://www.hubert.idv.tw/'" onMouseOver="status='最棒的在线学习网站'; this.color='red';return true;" onMouseOut="status='完毕'; this.color='blue';">文哥网络技术学习网</FONT><br></Body></font></p> <p>例5：<br><font color="#0000ff"><Script></font><br><font color="#0000ff">function mOver(object,msg){<br>   status = msg;<br>   object.color = "red";<br>   object.face = "华文楷体";<br>}</font></p> <p><font color="#0000ff">function mOut(object){<br>   status = '完毕';<br>   object.color = "blue";<br>   object.face = "幼圆";<br>}<br></Script></font></p> <p><font color="#0000ff"><Body><br><FONT STYLE="cursor:hand" onClick="location='http://www.hubert.idv.tw/'" onMouseOver="mOver(this,'最棒的线上学习网站'); return true;" onMouseOut="mOut(this)">文哥网络技术学习网</FONT><br></Body></font></p> <p>例6：<br><font color="#0000ff"><STYLE> A {text-decoration:none} </STYLE></font></p> <p><font color="#0000ff"><BODY><br></font><font color="#0000ff">搜寻引擎：<BR></font></p> <p><font color="#0000ff"><IMG SRC="images/snow1.gif" NAME=gif_1><br><A HREF="http://www.yam.com/" onMouseOver="document.gif_1.src='images//snow.gif'" onMouseOut="document.gif_1.src='images//snow1.gif'">蕃薯藤</A><BR></font></p> <p><font color="#0000ff"><IMG SRC="images/snow1.gif" NAME=gif_2><br><A HREF="http://www.kimo.com.tw/" onMouseOver="document.gif_2.src='images//snow.gif'" onMouseOut="document.gif_2.src='images//snow1.gif'">奇摩站</A><br></font><font color="#0000ff"></BODY></font></p> <p>例7：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">var url = new Array(3);<br>url[0] = "http://www.yam.org.tw/";<br>url[1] = "http://www.kimo.com/";<br>url[2] = "http://chinese.yahoo.com/";<br><br>function goto(i) {<br>    location = url[i];<br>}</font></p> <p><font color="#0000ff"></Script></font></p> <p><font color="#0000ff"><table width=250><tr><td><br><form><fieldset><br><legend>搜寻引擎</legend><br><input name="go" type="radio" onClick="goto(0)">蕃薯藤<br><input name="go" type="radio" onClick="goto(1)">奇摩<br><input name="go" type="radio" onClick="goto(2)">中文雅虎<br></fieldset></form><br></table></font></p> <p>  </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>定时器：</strong>（延迟器） </li> </ul> <blockquote> <p>用以指定在一段特定的时间后执行某段程序。</p> </blockquote> <ul> <li><strong>setTimeout()：</strong>（1.0版） </li> </ul> <blockquote> <p>格式：<br><br>[定时器对象名=] setTimeout(“<表达式>”，毫秒)<br><br>功能：执行<表达式>一次。</p> <p><br><br>例1：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">function count() {<br>    setTimeout("alert('三秒到了')",3000)<br>}<br><br></Script></font></p> <p><font color="#0000ff"><INPUT TYPE="button" VALUE=" 计时开始" onClick="count()"></font></p> <p>例2：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">function show() {<br>    document.all['news'].style.display = "";<br>    setTimeout("hide()",500);<br>}<br><br>function hide() {<br>    document.all['news'].style.display = "none";<br>    setTimeout("show()",500);<br>}<br><br></Script></font></p> <p><font color="#0000ff"><Body οnlοad="show()"><br>最新消息：<FONT ID="news" STYLE="display:none">十面埋伏...</FONT><br></Body></font></p> </blockquote> <ul> <li><strong>clearTimeout()：终止定时器</strong> </li> </ul> <blockquote> <p>格式：<br><br>clearTimeout(定时器对象名)</p> </blockquote> <p> </p> <ul> <li><strong>setInterval()：</strong>（1.2版） </li> </ul> <blockquote> <p>格式：<br><br>[定时器对象名=] setInterval(“<表达式>”，毫秒)<br><br>功能：重复执行<表达式>，直至窗口、框架被关闭或执行clearInterval。</p> </blockquote> <ul> <li><strong>clearInterval()：终止定时器</strong> </li> </ul> <blockquote> <p>格式：<br><br>clearInterval(定时器对象名)</p> </blockquote> <p> </p> <blockquote> <p>例1：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">var sec = 0;<br>timerID = setInterval("count()",1000);</font></p> <p><font color="#0000ff">function count() {<br>    num.innerHTML = sec++;<br>}<br><br></Script></font></p> <p><font color="#0000ff">停留时间：<br><FONT ID="num" FACE="impact">0</FONT>秒钟<br><INPUT TYPE="button" VALUE="停止" onClick="clearInterval(timerID)"></font></p> <p>例2：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">var str = "这是一个在线拍卖的网站，请尽情血拼吧！";<br>var seq = 0;<br><br>function scroll() {<br>    msg = str.substring(0, seq+1);<br>    banner.innerHTML = msg;<br>    seq++;<br>    if (seq >= str.length) seq = 0;<br>}<br><br></Script></font></p> <p><font color="#0000ff"><Body onLoad="setInterval('scroll()',500)"><br><FONT ID="banner"></FONT><br></Body></font></p> <p>  </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>图像对象：</strong> </li> </ul> <blockquote> <p>网页中的图像均会被自动看作图像对象，并依顺序，分别表示为document.images[0]，document.images[1]...</p> </blockquote> <ul> <li><strong>建立图像对象：</strong> </li> </ul> <blockquote> <p>格式：<br><br>图像对象名称=new Image([宽度],[高度])　　　//px</p> </blockquote> <ul> <li><strong>图像对象的属性：</strong> </li> </ul> <blockquote> <p>border complete height hspace lowsrc name src vspace width</p> </blockquote> <ul> <li><strong>图像对象的事件：</strong> </li> </ul> <blockquote> <p>onAbort onError onKeyDown onKeyPress onKeyUop onLoad<br></p> <p>  </p> <p>例1：（预载）<br><font color="#0000ff"><Script><br><br>img0 = new Image();<br>img0.src = "images/snow0.gif";<br><br>img1 = new Image();<br>img1.src = "images/snow1.gif";<br><br>document.write ("已经读取两个图文件，但此时不显示。");<br><br></Script></font></p> <p>例2： <br><font color="#0000ff"><Script><br>function img-preload(idx){<br>    eval("img"+idx+" = new Image()");<br>    eval("img"+idx+".src = 'images/snow"+idx+".gif'");<br>}<br><br>img-preload(0);<br>img-preload(1);<br>document.write ("已经读取两个图文件，但此时不显示。");<br><br></Script></font> </p> <p>例3：<br><font color="#0000ff"><Script><br>function img-preload(imgname,idx){<br>    eval("img"+idx+" = new Image()");<br>    eval("img"+idx+".src = 'images/"+imgname+".gif'");<br>}<br><br>img-preload("snow0",0);<br>img-preload("snow1",1);<br>document.write ("已经读取两个图文件，但此时不显示。");<br><br></Script></font> </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>Navigator对象：（领航员）</strong> </li> </ul> <blockquote> <p>检测浏览器的版本、所支持的MIME类型、已安装的外挂程序（plug-in）。该对象包含两个子对象：外挂对象、MIME类型对象。</p> </blockquote> <ul> <li><strong>Navigator对象的属性：</strong><br><br>格式： navigator.属性 </li> </ul> <blockquote> <table width="450" border="0"> <tbody> <tr> <td align="center" width="160">appCodeName</td> <td>代码</td> </tr> <tr> <td align="center">appName</td> <td>名称</td> </tr> <tr> <td align="center">appVersion</td> <td>版本</td> </tr> <tr> <td align="center">language</td> <td>语言</td> </tr> <tr> <td align="center">mimeType</td> <td>以数组表示所支持的MIME类型</td> </tr> <tr> <td align="center">platform</td> <td>编译浏览器的机器类型</td> </tr> <tr> <td align="center">plugins</td> <td>以数组表示已安装的外挂程序</td> </tr> <tr> <td align="center">userAgent</td> <td>用户代理程序的表头</td> </tr> </tbody> </table> <p> </p> <p>例1：<br><font color="#0000ff"><Script><br><br>with (document) {<br>    write ("你的浏览器信息：<OL>");<br>    write ("<LI>代码："+navigator.appCodeName);<br>    write ("<LI>名称："+navigator.appName);<br>    write ("<LI>版本："+navigator.appVersion);<br>    write ("<LI>语言："+navigator.language);<br>    write ("<LI>编译平台："+navigator.platform);<br>    write ("<LI>用户表头："+navigator.userAgent);<br>} <br><br></Script></font></p> <p>例2：<br><font color="#0000ff"><Script><br><br>if (document.all) {<br>   document.write("你的浏览器是：MSIE");<br>}   else {<br>   document.write("你的浏览器是：Navigator");<br>}<br><br></Script></font> </p> </blockquote> <p> </p> <ul> <li><strong>plugin对象的属性：<br><br></strong>格式： navigator.plugins.属性 </li> </ul> <blockquote> <table width="450" border="0"> <tbody> <tr> <td align="center" width="160">description</td> <td>外挂程序模块的描述</td> </tr> <tr> <td align="center">filename</td> <td>外挂程序模块的文件名</td> </tr> <tr> <td align="center">length</td> <td>外挂程序模块的个数</td> </tr> <tr> <td align="center">name</td> <td>外挂程序模块的名称</td> </tr> </tbody> </table> </blockquote> <p> </p> <blockquote> <p>例：<br><font color="#0000ff"><Script><br><br>var len = navigator.plugins.length;<br>with (document) {<br>    write ("你的浏览器共支持" + len + "种plug-in：<BR>");<br>    write ("<TABLE BORDER>")<br>    write ("<CAPTION>PLUG-IN 清单</CAPTION>")<br>    write ("<TR><TH> <TH>名称<TH>描述<TH>文件名")<br>    for (var i=0; i<len; i++)<br>        write("<TR><TD>" + i +<br>            "<TD>" + navigator.plugins[i].name +<br>            "<TD>" + navigator.plugins[i].description + <br>            "<TD>" + navigator.plugins[i].filename);<br>} </font><br><br><font color="#0000ff"></Script></font> </p> <p>  </p> </blockquote> <ul> <li><strong>mimeType对象的属性：<br><br></strong>格式：navigator.mimeTypes.属性 </li> </ul> <blockquote> <table width="450" border="0"> <tbody> <tr> <td align="center" width="160">description</td> <td>MIME类型的描述</td> </tr> <tr> <td align="center">enablePlugin</td> <td>对应到哪个外挂模块</td> </tr> <tr> <td align="center">length</td> <td>MIME类型的数目</td> </tr> <tr> <td align="center">suffixes</td> <td>MIME类型的扩展名</td> </tr> <tr> <td align="center">type</td> <td>MIME类型的名称</td> </tr> </tbody> </table> </blockquote> <p> </p> <blockquote> <p>例：<br><font color="#0000ff"><Script><br><br>var len = navigator.mimeTypes.length;<br>with (document) {<br>    write ("你的浏览器共支持" + len + "种MIME类型：");<br>    write ("<TABLE BORDER>")<br>    write ("<CAPTION>MIME type 清单</CAPTION>")<br>    write ("<TR><TH> <TH>名称<TH>描述<TH>扩展名<TH>附注")<br>   for (var i=0; i<len; i++) {<br>       write("<TR><TD>" + i + <br>           "<TD>" + navigator.mimeTypes[i].type +<br>           "<TD>" + navigator.mimeTypes[i].description +<br>           "<TD>" + navigator.mimeTypes[i].suffixes +<br>           "<TD>" + <br>          navigator.mimeTypes[i].enabledPlugin.name);<br>}<br>} <br><br></Script></font></p> <p>  </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>窗口对象的属性和方法：</strong> </li> </ul> <blockquote> <p>格式：</p> <p>[window.]属性<br>[window.]方法（参数）</p> <p>opener.属性<br>opener.方法（参数）<br>self.属性<br>self.方法（参数）<br>parent.属性<br>parent.方法（参数）<br>top.属性<br>top.方法（参数）</p> <p>窗口名称.属性<br>窗口名称.方法（参数）</p> </blockquote> <ul> <li><strong>窗口对象的属性</strong>： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">document</td> <td>当前文件的信息</td> </tr> <tr> <td align="center">location</td> <td>当前URL的信息</td> </tr> <tr> <td align="center">name</td> <td>窗口名称</td> </tr> <tr> <td align="center">status</td> <td>状态栏的临时信息</td> </tr> <tr> <td align="center">defaultStatus</td> <td>状态栏默认信息</td> </tr> <tr> <td align="center">history</td> <td>该窗口最近查阅过的网页</td> </tr> <tr> <td align="center">closed</td> <td>判断窗口是否关闭，返回布尔值</td> </tr> <tr> <td align="center">opner</td> <td>open方法打开的窗口的源窗口</td> </tr> <tr> <td align="center">outerHeight</td> <td>窗口边界的垂直尺寸，px</td> </tr> <tr> <td align="center">outerWidth</td> <td>窗口边界的水平尺寸，px</td> </tr> <tr> <td align="center">pageXOffset</td> <td>网页x-position的位置</td> </tr> <tr> <td align="center">pageYOffset</td> <td>网页y-position的位置</td> </tr> <tr> <td align="center">innerHeight</td> <td>窗口内容区的垂直尺寸，px</td> </tr> <tr> <td align="center">innerWidth</td> <td>窗口内容区的水平尺寸，px</td> </tr> <tr> <td align="center">screenX</td> <td>窗口左边界的X坐标</td> </tr> <tr> <td align="center">screenY</td> <td>窗口上边界的Y坐标</td> </tr> <tr> <td align="center">self</td> <td>当前窗口</td> </tr> <tr> <td align="center">top</td> <td>最上方的窗口</td> </tr> <tr> <td align="center">parent</td> <td>当前窗口或框架的框架组</td> </tr> <tr> <td align="center">frames</td> <td>对应到窗口中的框架</td> </tr> <tr> <td align="center">length</td> <td>框架的个数</td> </tr> <tr> <td align="center">locationbar</td> <td>浏览器地址栏</td> </tr> <tr> <td align="center">menubar</td> <td>浏览器菜单栏</td> </tr> <tr> <td align="center">scrollbars</td> <td>浏览器滚动条</td> </tr> <tr> <td align="center">statusbar</td> <td>浏览器状态栏</td> </tr> <tr> <td align="center">toolbar</td> <td>浏览器工具栏</td> </tr> <tr> <td align="center">offscreenBuffering</td> <td>是否更新窗口外的区域</td> </tr> <tr> <td align="center">personalbars</td> <td>浏览器的个人工具栏，仅Navigator</td> </tr> </tbody> </table> </blockquote> <p> </p> <ul> <li><strong>窗口对象的方法：</strong> </li> </ul> <table width="600" border="0"> <tbody> <tr> <td align="center" width="300">alert(信息字串)</td> <td>弹出警告信息</td> </tr> <tr> <td align="center">confirm(信息字串)</td> <td>显示确认信息对话框</td> </tr> <tr> <td align="center">prompt(提示字串[，默认值])</td> <td>显示提示信息，并提供可输入的字段</td> </tr> <tr> <td align="center">atob(译码字串)</td> <td>对base-64编码字串进行译码</td> </tr> <tr> <td align="center">btoa(字串)</td> <td>将进行base-64编码</td> </tr> <tr> <td align="center">back()</td> <td>回到历史记录的上一网页</td> </tr> <tr> <td align="center">forward()</td> <td>加载历史记录中的下一网页</td> </tr> <tr> <td align="center">open(URL，窗口名称[，窗口规格])</td> <td> </td> </tr> <tr> <td align="center">focus()</td> <td>焦点移到该窗口</td> </tr> <tr> <td align="center">blur()</td> <td>窗口转成背景</td> </tr> <tr> <td align="center">stop()</td> <td>停止加载网页</td> </tr> <tr> <td align="center">close()</td> <td> </td> </tr> <tr> <td align="center">enableExternalCapture()</td> <td>允许有框架的窗口获取事件</td> </tr> <tr> <td align="center">disableExternalCapture()</td> <td>关闭enableExternalCapture()</td> </tr> <tr> <td align="center">captureEvents(事件类型)</td> <td>捕捉窗口的特定事件</td> </tr> <tr> <td align="center">routeEvent(事件)</td> <td>传送已捕捉的事件</td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td>使特定事件的处理生效</td> </tr> <tr> <td align="center">releaseEvents(事件类型)</td> <td>释放已获取的事件</td> </tr> <tr> <td align="center">moveBy(水平点数，垂直点数)</td> <td>相对定位</td> </tr> <tr> <td align="center">moveTo(x坐标，y坐标)</td> <td>绝对定位</td> </tr> <tr> <td align="center">setResizable(true|false)</td> <td>是否允许调整窗口大小</td> </tr> <tr> <td align="center">resizeBy(水平点数，垂直点数)</td> <td>相对调整窗口大小</td> </tr> <tr> <td align="center">resizeTo(宽度，高度)</td> <td>绝对调整窗口大小</td> </tr> <tr> <td align="center">scroll(x坐标，y坐标)</td> <td>绝对滚动窗口</td> </tr> <tr> <td align="center">scrollBy(水平点数，垂直点数)</td> <td>相对滚动窗口</td> </tr> <tr> <td align="center">scrollTo(x坐标，y坐标)</td> <td>绝对滚动窗口</td> </tr> <tr> <td align="center">setInterval(表达式，毫秒)</td> <td> </td> </tr> <tr> <td align="center">setTimeout(表达式，毫秒)</td> <td> </td> </tr> <tr> <td align="center">clearInterval(定时器对象)</td> <td> </td> </tr> <tr> <td align="center">clearTimeout(定时器对象)</td> <td> </td> </tr> <tr> <td align="center">home()</td> <td>进入浏览器设置的主页</td> </tr> <tr> <td align="center">find([字串[,caseSensitivr,backward]])</td> <td>查找窗口中特定的字串</td> </tr> <tr> <td align="center">print()</td> <td> </td> </tr> <tr> <td align="center">setHotKeys(true|false)</td> <td>激活或关闭组合键</td> </tr> <tr> <td align="center">setZOptions()</td> <td>设置窗口重叠时的堆栈顺序</td> </tr> </tbody> </table> <p> </p> <ul> <li><strong>窗口对象的事件处理程序：</strong> </li> </ul> <blockquote> <p>onBlur onDragDrop onError onFocus onLoad onMove onResize onUnload </p> </blockquote> <p> </p> <blockquote> <p>例1：<br><span class="样式1"><font color="#0000ff"><Script><br><br>function checkPassword(testObject) {<br>if (testObject.value.length < 4) {<br>    alert("密码长度不得小于四");<br>    testObject.focus();<br>    testObject.select();<br>}<br>}</font></span></p> <p class="样式1"></Script></p> <p class="样式1">请输入密码：<br><INPUT TYPE="text" onBlur="checkPassword(this)"></p> <p> </p> <p>例2：<br><span class="样式1"><font color="#0000ff"><Script><br><br>if (confirm("你满十八岁了吗?"))<br>    location = "adult.htm";<br>else<br>    alert("等你成年以後再来吧!");<br><br></Script></font></span></p> <p> </p> <p>例3：<br><span class="样式1"><font color="#0000ff"><Script><br><br>var bgColor =<br>prompt("你喜欢哪一种底色：/n浅蓝色请按1，粉红色请按2",1)<br><br>if (bgColor == 1) document.bgColor = "#CCFFFF";<br>else if (bgColor == 2) document.bgColor = "#FFCCFF";<br>else document.bgColor = "#FFFFFF";<br><br></Script></font></span></p> <p> </p> <p>例4：<br><span class="样式1"><font color="#0000ff"><Script><br>function grow() {<br>resizeBy(0, 50);<br>}<br><br>function shrink() {<br>resizeBy(0, -50);<br>}<br><br></Script></font></span></p> <p class="样式1"><Body onMouseOver="grow()" onMouseOut="shrink()"><br>将视窗放大与缩小<br></Body></p> <p> </p> <p>例5： <br><span class="样式1"><font color="#0000ff"><Script><br><br>function scrollIt() {<br>for (y=1; y<=2000; y++) {<br>    scrollTo(1,y);<br>}<br>}<br><br></Script></font></span></p> <p class="样式1"><Body onDblClick=scrollIt()><br>双击鼠标，画面会自动卷动... <br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br><br>... The End ...<br></Body></p> <p>  </p> <p>  </p> </blockquote> <ul> <li><strong>open方法的窗口规格参数：（yes/no，1/0）</strong> </li> </ul> <blockquote> <p>格式：[var 新窗口对象名=]window.open("url","windowName","windowFeature")<br></p> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">alwaysLowered</td> <td>是否将窗口显示的堆栈后推一层</td> </tr> <tr> <td align="center">alwaysRaised</td> <td>是否将窗口显示的堆栈上推一层</td> </tr> <tr> <td align="center">dependent</td> <td>是否将该窗口与当前窗口产生依存关系</td> </tr> <tr> <td align="center">fullscreen</td> <td>是否满屏显示</td> </tr> <tr> <td align="center">directories</td> <td>是否显示连接工具栏</td> </tr> <tr> <td align="center">location</td> <td>是否显示网址工具栏</td> </tr> <tr> <td align="center">menubar</td> <td>是否显示菜单工具栏</td> </tr> <tr> <td align="center">scrollbars</td> <td>是否显示滚动条</td> </tr> <tr> <td align="center">status</td> <td>是否显示状态栏</td> </tr> <tr> <td align="center">titlebar</td> <td>是否显示标题栏</td> </tr> <tr> <td align="center">toolbar</td> <td>是否显示标准工具栏</td> </tr> <tr> <td align="center">resizable</td> <td>是否可以改变窗口的大小</td> </tr> <tr> <td align="center">screenX</td> <td>窗口左边界距离</td> </tr> <tr> <td align="center">screenY</td> <td>窗口上边界距离</td> </tr> <tr> <td align="center">top</td> <td>窗口上边界</td> </tr> <tr> <td align="center">width</td> <td>窗口宽度</td> </tr> <tr> <td align="center">height</td> <td>窗口高度</td> </tr> <tr> <td align="center">left</td> <td>窗口左边界</td> </tr> <tr> <td align="center">outerHeight</td> <td>窗口外边界的高度</td> </tr> <tr> <td align="center">personalbar</td> <td>是否显示个人工具栏</td> </tr> </tbody> </table> </blockquote> <p> </p> <blockquote> <p>注释：open("","","menubar")<br>      open("","","menubar=1") <br>      open("","","menubar=yes")</p> </blockquote> <p> </p> <blockquote> <p>例1：<br><span class="样式1"><font color="#0000ff"><Script><br><br>document.write ("文哥网络技术学习网");<br>open ('1.htm','','height=100,width=300'); <br><br></Script></font></span></p> <p class="样式1"> </p> <p class="样式1"><!-------- 1.htm --------><br><TITLE>欢迎光临</TITLE></p> <p class="样式1"><BODY onClick="self.close()"><br><br><IMG SRC="images/welcome.gif" ALIGN="left"><br><CENTER><br><FONT COLOR="blue" SIZE="5">欢迎光临</FONT><BR><br>这是一个技术研习的小天地<BR><br></CENTER><br><br></BODY></p> <p> </p> <p>例2：<br><span class="样式1"><font color="#0000ff"><Script><br><br>document.write("文哥网络技术学习网")<br>helloWin = open ('1.htm','','height=100,width=300'); </font></span></p> <p class="样式1">var line1 = "<FONT COLOR='blue' SIZE='5'>欢迎光临</FONT><BR>"<br>var line2 = "这是一个技术研习的小天地"<br>helloWin.document.write (line1 + line2)<br>helloWin.document.title = "欢迎光临"<br><br></Script></p> <p class="样式1">  </p> <p>例3：<br><span class="样式1"><font color="#0000ff"><Script><br><br>window.defaultStatus = "最棒的线上学习网站";<br><br></Script></font></span></p> <p class="样式1"><A HREF="http://www.hubert.idv.tw" onMouseOver="status='内容很充实喔！';return true"><br>文哥网路技术学习网</A></p> <p> </p> <p>例4： <br><span class="样式1"><font color="#0000ff"><Script><br><br>queryWin = open('1.htm','','height=100,')<br><br></Script></font></span></p> <p class="样式1">利用子窗口来改变母窗口的底色</p> <p class="样式1"> </p> <p class="样式1">/* -------- 1.htm -------- */<br><Script></p> <p class="样式1">function passToOpener(color) {<br>    opener.document.bgColor = color;<br>    self.close();<br>}</p> <p class="样式1"></Script><br><CENTER></p> <p class="样式1">请选择你喜欢的颜色?<BR></p> <p class="样式1"><FONT onClick="passToOpener('#CCFFFF')"> >浅蓝色<</FONT>　</p> <p class="样式1"><FONT onClick="passToOpener('#FFCCFF')"> >浅红色<</FONT></p> <p class="样式1"></CENTER></p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td height="550"> <p> </p> <ul> <li><strong>屏幕对象：</strong> <p>描述屏幕的显示及颜色属性。</p> </li> <li><strong>屏幕对象的属性：<br><br></strong>格式： screen.属性 </li> </ul> <blockquote> <table width="450" border="0"> <tbody> <tr> <td align="center" width="160">availHeight</td> <td>屏幕区域的可用高度</td> </tr> <tr> <td align="center">availWidth</td> <td>屏幕区域的可用宽度</td> </tr> <tr> <td align="center">colorDepth</td> <td>颜色深度 256/8 16/16 32M/32 </td> </tr> <tr> <td align="center">height</td> <td>屏幕区域的实际高度</td> </tr> <tr> <td align="center">width</td> <td>屏幕区域的实际宽度</td> </tr> </tbody> </table> </blockquote> <p> </p> <blockquote> <p>例1：<br><span class="样式1"><font color="#0000ff"><Script></font></span></p> <p class="样式1">with (document) {<br>    write ("您的屏幕显示设定值如下：<P>");<br>    write ("屏幕的实际高度为", screen.availHeight, "<BR>");<br>    write ("屏幕的实际宽度为", screen.availWidth, "<BR>");<br>    write ("屏幕的色盘深度为", screen.colorDepth, "<BR>");<br>    write ("屏幕区域的高度为", screen.height, "<BR>");<br>    write ("屏幕区域的宽度为", screen.width);<br>}<br><br></Script></p> <p>  </p> <p>例2：<br><span class="样式1"><font color="#0000ff"><Script><br><br>if ( screen.width < 800 || screen.colorDepth < 8 ){<br>    var msg = "本网站最佳浏览模式为 800 * 600 * 256";<br>    alert(msg);<br>}</font></span></p> <p class="样式1"></Script></p> <p class="样式1">  </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ul> <li><strong>事件对象：</strong><br><br>当事件发生时，浏览器自动建立该对象，并包含该事件的类型、鼠标坐标等。 </li> </ul> <ul> <li><strong>事件对象的属性：<br><br></strong>格式：event.属性 </li> </ul> <blockquote> <table width="600" border="0"> <tbody> <tr> <td align="center" width="160">data</td> <td>返回拖拽对象的URL字符串（dragDrop）</td> </tr> <tr> <td align="center">width</td> <td>该窗口或框架的高度</td> </tr> <tr> <td align="center">height</td> <td>该窗口或框架的高度</td> </tr> <tr> <td align="center">pageX</td> <td>光标相对于该网页的水平位置</td> </tr> <tr> <td align="center">pageY</td> <td>光标相对于该网页的垂直位置</td> </tr> <tr> <td align="center">screenX</td> <td>光标相对于该屏幕的水平位置</td> </tr> <tr> <td align="center">screenY</td> <td>光标相对于该屏幕的垂直位置</td> </tr> <tr> <td align="center">target</td> <td>该事件被传送到的对象</td> </tr> <tr> <td align="center">type</td> <td>事件的类型</td> </tr> <tr> <td align="center">which</td> <td>数值表示的键盘或鼠标键：1/2/3（左键/中键/右键）</td> </tr> <tr> <td align="center">layerX</td> <td>光标相对于事件发生层的水平位置</td> </tr> <tr> <td align="center">layerY</td> <td>光标相对于事件发生层的垂直位置</td> </tr> <tr> <td align="center">x</td> <td>相当于layerX</td> </tr> <tr> <td align="center">y</td> <td>相当于layerY</td> </tr> </tbody> </table> </blockquote> <p> </p> <blockquote> <p>例1：<br><font color="#0000ff"><Script><br><br>function getEvent(evnt) {<br>eventWin = open ('','','width=200,height=100');<br>with (eventWin.document) { <br>     write("事件类型：", event.type);<br>     write("<br>鼠标的x坐标：", event.screenX);<br>     write("<br>鼠标的y坐标：", event.screenY);<br>}<br>} <br><br>document.write ("单击...")<br>document.onmousedown = getEvent;<br></Script> </font><br></p> <p> </p> <p>例2：<br><font color="#0000ff"><Script><br><br>function getCoordinate(evnt) {</font></p> <p><font color="#0000ff">if (document.all) {<br>   x = event.screenX;<br>   y = event.screenY;<br>}<br>else {<br>   x = evnt.screenX;<br>   y = evnt.screenY; <br>}<br>status = "水平坐标："+ x + "；垂直坐标："+ y;<br>} </font></p> <p><font color="#0000ff">document.onmousemove = getCoordinate;<br><br></Script></font><br></p> <p>  </p> <p>例3：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">function whichKey(evnt) {</font></p> <p><font color="#0000ff">if (document.all) {<br>    x = event.button;<br>    if( x==1 ) alert("你单击了左键");<br>    if( x==2 ) alert("你单击了右键");<br>}<br><br>else {<br>    x = evnt.button;<br>    if( x==1 ) alert("你单击了左键");<br>    if( x==3 ) alert("你单击了右键");<br>    return false;<br>}<br>}</font></p> <p><font color="#0000ff">document.onmousedown = whichKey;<br>document.write("请单击鼠标左/右键");</font></p> <p><font color="#0000ff"></Script></font></p> <p>  </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ul> <li><strong>历史对象：</strong><br><br>用以存储客户端最近访问的网址清单。 <p>格式：</p> <p>history.属性<br>history.方法（参数） </p> </li> </ul> <p> </p> <ul> <li><strong>历史对象的属性：<br><br></strong> <table width="450" border="0"> <tbody> <tr> <td align="center" width="160">current</td> <td>当前历史记录的网址</td> </tr> <tr> <td align="center">length</td> <td>存储在记录清单中的网址数目</td> </tr> <tr> <td align="center">next</td> <td>下一个历史记录的网址</td> </tr> <tr> <td align="center">previous</td> <td>上一个历史记录的网址</td> </tr> </tbody> </table> </li> </ul> <p> </p> <ul> <li><strong>历史对象的方法：<br><br></strong> <table width="450" border="0"> <tbody> <tr> <td align="center" width="160">back()</td> <td>回到上一个历史记录中的网址</td> </tr> <tr> <td align="center">forward()</td> <td>回到下一个历史记录中的网址</td> </tr> <tr> <td align="center">go(整数或URL)</td> <td>前往历史记录中的网址</td> </tr> </tbody> </table> </li> </ul> <p> </p> <blockquote> <p>例1：<br><font color="#0000ff">history.go(-1) <br><br>newWin.history.back() <br><br>parent.downFrame.histroy.back() </font></p> </blockquote> <p> </p> <blockquote> <p>例2：<br><font color="#0000ff"><A HREF="#" onClick="history.back()">上一页</A></font></p> <p><font color="#0000ff"><A HREF="javascript:history.back()">上一页</A></font></p> <p>  </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ul> <li><strong>位置对象：</strong> <p>用来代表特定窗口的URL信息。<br><br>格式：</p> <p>location.属性<br>location.方法（参数） <br></p> </li> <li><strong>URL的格式：</strong><br><br>protocol//host:port/path#hash?search </li> </ul> <p> </p> <ul> <li><strong>URL的种类：<br><br></strong> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">javascript:</td> <td>javascript程序代码</td> </tr> <tr> <td align="center">view-source:</td> <td>显示源代码</td> </tr> <tr> <td align="center">http:</td> <td> </td> </tr> <tr> <td align="center">file:</td> <td> </td> </tr> <tr> <td align="center">ftp:</td> <td> </td> </tr> <tr> <td align="center">mailto:</td> <td> </td> </tr> <tr> <td align="center">news:</td> <td> </td> </tr> <tr> <td align="center">gopher</td> <td> </td> </tr> </tbody> </table> <strong></strong></li> </ul> <p> </p> <ul> <li><strong>位置对象的属性：<br><br></strong> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">hash</td> <td>锚点名称</td> </tr> <tr> <td align="center">host</td> <td>主机名称</td> </tr> <tr> <td align="center">hostname</td> <td>host:port</td> </tr> <tr> <td align="center">href</td> <td>完整的URL字符串</td> </tr> <tr> <td align="center">pathname</td> <td>路径</td> </tr> <tr> <td align="center">port</td> <td>端口</td> </tr> <tr> <td align="center">protocol</td> <td>协议</td> </tr> <tr> <td align="center">search</td> <td>查询信息</td> </tr> </tbody> </table> <p> </p> </li> <li><strong>位置对象的方法：<br><br></strong> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">reload()</td> <td>重新加载</td> </tr> <tr> <td align="center">replace(网址)</td> <td>用指定的网页取代当前网页</td> </tr> </tbody> </table> </li> </ul> <p> </p> <blockquote> <p>例1：</p> <p><font color="#0000ff">按下按钮前往「文哥网络技术学习网」<P><br><INPUT TYPE="button" VALUE="走吧！" onClick="location.href='http://www.hubert.idv.tw/'"></font></p> <p>  </p> <p>例2：</p> <p><font color="#0000ff"><FONT COLOR="red"<br>onClick="location='http://www.hubert.idv.tw/'"><br>文哥网络技术学习网</FONT><P></font></p> <p><font color="#0000ff"><FONT COLOR="blue" STYLE="cursor:hand" <br>onClick="location='http://www.hubert.idv.tw/'"><br>文哥网络技术学习网</FONT></font></p> <p>  </p> <p>例3：<br><font color="#0000ff"><Script><br><br>var sec = 5;<br><br>function countDown() {<br>if (sec > 0) {<br>    num.innerHTML = sec--;<br>}<br>else<br>    location = "http://www.hubert.idv.tw/";<br>}<br></Script></font></p> <p><font color="#0000ff"><BODY onLoad="setInterval('coun</font><font color="#0000ff">tDown()', 1000)"><br><CENTER><br>文哥网络技术学习网<br><H2>http://www.hubert.idv.tw/</H2><br>五秒钟后自动带你前往<BR><br><FONT ID="num" SIZE="7" FACE="impact">5</FONT></font></p> <p>  </p> <p>例4：</p> <p><font color="#0000ff"><A HREF="#" onClick="this.style.behavior='url(#default#homepage)';this.setHomePage('http://www.hubert.idv.tw/');"><FONT COLOR="red"><U>设为首页</U></FONT></A><P></font></p> <p><font color="#0000ff"><A HREF="javascript:window.external.AddFavorite('http://www.hubert.idv.tw/','文哥网络技术学习网');"><FONT COLOR="red"><U>加入收藏</U></FONT></A></font></p> <p>  </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ul> <li><strong>文件对象：</strong> <p>代表当前HTML对象，是由<body>标签组构成的，对每个HTML文件会自动建立一个文件对象。</p> <p>格式：</p> <p>document.属性<br>document.方法（参数） <br></p> </li> <li><strong>文件对象的属性：</strong> <br><br> <table width="500" border="0"> <tbody> <tr> <td align="center">linkColor</td> <td>设置超链接的颜色</td> </tr> <tr> <td align="center" width="160">alinkColor</td> <td>作用中的超链接的颜色</td> </tr> <tr> <td align="center">vlinkColor</td> <td>链接的超链接颜色</td> </tr> <tr> <td align="center">links</td> <td>以数组索引值表示所有超链接</td> </tr> <tr> <td align="center">URL</td> <td>该文件的网址</td> </tr> <tr> <td align="center">anchors</td> <td>以数组索引值表示所有锚点</td> </tr> <tr> <td align="center">bgColor</td> <td>背景颜色</td> </tr> <tr> <td align="center">fgColor</td> <td>前景颜色</td> </tr> <tr> <td align="center">classes</td> <td>文件中的class属性</td> </tr> <tr> <td align="center">cookie</td> <td>设置cookie</td> </tr> <tr> <td align="center">domain</td> <td>指定服务器的域名</td> </tr> <tr> <td align="center">formName</td> <td>以表单名称表示所有表单</td> </tr> <tr> <td align="center">forms</td> <td>以数组索引值表示所有表单</td> </tr> <tr> <td align="center">images</td> <td>以数组索引值表示所有图像</td> </tr> <tr> <td align="center">layers</td> <td>以数组索引值表示所有layer</td> </tr> <tr> <td align="center">embeds</td> <td>文件中的plug-in</td> </tr> <tr> <td align="center">applets</td> <td>以数组索引值表示所有applet</td> </tr> <tr> <td align="center">plugins</td> <td>以数组索引值表示所有插件程序</td> </tr> <tr> <td align="center">referrer</td> <td>代表当前打开文件的网页的网址</td> </tr> <tr> <td align="center">tags</td> <td>指出HTML标签的样式</td> </tr> <tr> <td align="center">title</td> <td>该文档的标题</td> </tr> <tr> <td align="center">width</td> <td>该文件的宽度（px）</td> </tr> <tr> <td align="center">lastModified</td> <td>文件最后修改时间</td> </tr> </tbody> </table> <p> </p> </li> <li><strong>文件对象的方法：<br><br></strong> <table width="600" border="0"> <tbody> <tr> <td align="center" width="220">captureEvents(事件)</td> <td>设置要获取指定的事件</td> </tr> <tr> <td align="center">close()</td> <td>关闭输出字符流，强制显示数据内容</td> </tr> <tr> <td align="center">getSelection()</td> <td>取得当前选取的字串</td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td>使事件处理器生效</td> </tr> <tr> <td align="center">open([mimeType,[replace]])</td> <td>打开字符流</td> </tr> <tr> <td align="center">releaseEvents(事件类型)</td> <td>释放已获取的事件</td> </tr> <tr> <td align="center">routeEvent(事件)</td> <td>传送已捕捉的事件</td> </tr> <tr> <td align="center">write(字串)</td> <td>写字串或数值到文件中</td> </tr> <tr> <td align="center">writeln(字串)</td> <td>分行写字串或数值到文件中（<pre>..</pre>）</td> </tr> </tbody> </table> <p> </p> </li> <li><strong>文件对象的事件处理程序：</strong> <p>onClick onDbClick onKeyDown onKeyPress onKeyUp onMouseDown onMouseOver </p> </li> </ul> <p> </p> <blockquote> <p>例1：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">document.bgColor = "white";<br>document.fgColor = "black";<br>document.linkColor = "red";<br>document.alinkColor = "blue";<br>document.vlinkColor = "purple";</font></p> <p><font color="#0000ff"></Script></font></p> <p><font color="#0000ff">测试文件对象的颜色属性：<BR></font></p> <p><font color="#0000ff"><A HREF="http://www.hubert.idv.tw">文哥网路技术学习网</A></font></p> <p>  </p> <p>例2：<br><font color="#0000ff"><Script></font></p> <p><font color="#0000ff">var update_date = document.lastModified;<br>var formated_date = update_date.substring(0,10);<br><br>document.write("本网页更新日期：" + update_date + "<BR>")<br>document.write("本网页更新日期：" + formated_date)</font></p> <p><font color="#0000ff"></Script></font></p> <p><br><br></p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p>  </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ul> <li><strong>锚点对象：</strong> <p>网页中的锚点均会被自动看作锚点对象，并依顺序，分别表示为document.anchors[0]，document.anchors[1]...</p> <p>定义锚点对象的格式：</p> <p>字串.anchor(属性)</p> </li> </ul> <p> </p> <ul> <li><strong>锚点对象的属性：<br><br></strong> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">name</td> <td>锚点名称</td> </tr> <tr> <td align="center">text</td> <td>锚点字串</td> </tr> </tbody> </table> <p> </p> </li> </ul> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ul> <li><strong>链接对象：</strong> <p>网页中的链接均会被自动看作链接对象，并依顺序，分别表示为document.links[0]，document.links[1]...</p> <p>定义链接对象的格式：</p> </li> </ul> <blockquote> <p>字串.link(属性)</p> </blockquote> <p> </p> <ul> <li><strong>链接对象的属性：</strong> <br><br> <table width="500" border="0"> <tbody> <tr> <td align="center">hash</td> <td>URL中的锚点名称</td> </tr> <tr> <td align="center" width="160">host</td> <td>主机域名或IP地址</td> </tr> <tr> <td align="center">hostname</td> <td>URL中的host+port</td> </tr> <tr> <td align="center">href</td> <td>完整的URL字串</td> </tr> <tr> <td align="center">pathname</td> <td>URL中path部分</td> </tr> <tr> <td align="center">port</td> <td>URL中端口部分</td> </tr> <tr> <td align="center">protocol</td> <td>URL中通讯协议部分</td> </tr> <tr> <td align="center">search</td> <td>URL中查询字串部分</td> </tr> <tr> <td align="center">target</td> <td>代表目标的窗口</td> </tr> <tr> <td align="center">text</td> <td>表示A标签中的文字</td> </tr> <tr> <td align="center">x</td> <td>链接对象的左边界</td> </tr> <tr> <td align="center">y</td> <td>链接对象的右边界</td> </tr> </tbody> </table> <p> </p> </li> <li><strong>链接对象的方法：</strong> <p>handleEvent(事件) <br>激活对某事件的处理程序。</p> </li> </ul> <p> </p> <ul> <li><strong>链接对象的事件处理程序：</strong> <p>onClick onDbClick onKeyDown onKeyPress onKeyUp onMouseDown onMouseUp onMouseOver onMouseOut </p> </li> </ul> <p> </p> <blockquote> <p>例1：<br><font color="#0000ff"><Script><br><br>function linkGetter() {<br>msgWindow = open('','','width=250,height=200')<br>msgWindow.document.write("共有" + document.links.length + "个搜索引擎")<br>for (var i = 0; i < document.links.length; i++) {<br>    msgWindow.document.write("<LI>"+document.links[i])<br>}<br>}<br><br></Script></font></p> <p><font color="#0000ff">常用的搜索引擎：<BR></font></p> <p><font color="#0000ff"><A HREF="http://www.yam.org.tw/">蕃薯藤</A><br><A HREF="http://www.kimo.com/">奇摩</A><br><A HREF="http://chinese.yahoo.com/">雅虎</A><br><A HREF="http://gais.cs.ccu.edu.tw/">盖世</A><br><A HREF="http://www.openfind.com.tw/">网擎</A><br><A HREF="http://www.dreamer.com.tw/">梦想家</A><BR><br><INPUT TYPE="button" VALUE="网址一览" onClick=linkGetter()></font></p> <p>  </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ul> <li><strong>框架对象：</strong> </li> </ul> <blockquote> <p>可以被窗口中的框架引用的对象，具有窗口对象的属性和方法。</p> <p>格式：</p> <p>top.frameName|frames[n].属性|方法</p> <p>parent.frameName|frames[n].属性|方法</p> <p> </p> <p>例：<br><span class="样式1"><font color="#0000ff">/* -------- frameset.htm -------- */<br><Script><br><br>document.title = "框架组页";<br>var usrID = "来宾";<br><br></Script></font></span></p> <p class="样式1"><FRAMESET COLS="20%,80%"><br>    <FRAME SRC="menu.htm" NAME=leftFrame><br>    <FRAMESET ROWS="10%,90%"><br>        <FRAME SRC="usrInfo.htm" NAME=upFrame><br>        <FRAME SRC="welcome.htm" NAME=downFrame><br>    </FRAMESET><br></FRAMESET></p> <p class="样式1"> </p> <p class="样式1"><!-------- menu.htm --------></p> <p class="样式1"><HEAD><br><TITLE>导航页</TITLE><br><STYLE>A{text-decoration:none}</STYLE><br></HEAD><br><BODY><br><CENTER><br><A HREF="login.htm" TARGET="downFrame">会员登录</A><BR><br><A HREF="hot.htm" TARGET="downFrame">热门优惠</A><BR><br><A HREF="welcome.htm" TARGET="downFrame">回 首 页</A><br><BR><br></CENTER><br></BODY></p> <p class="样式1"> </p> <p class="样式1">/* -------- usrInfo.htm -------- */<br><Script><br><br>document.title = "用户信息";<br>var bye = "欢迎有空常来..."<br><br><br>document.write<br>("<MARQUEE>亲爱的<FONT COLOR='gray'><U>",top.usrID,"</U></FONT>会员，欢迎您的光临！</MARQUEE>");</p> <p class="样式1"><br></Script></p> <p class="样式1"> </p> <p class="样式1">/* -------- login.htm -------- */<br><Script></p> <p class="样式1">document.title = "用户登录";</p> <p class="样式1">function login() {<br>    top.usrID = document.loginForm.usr.value;<br>    top.upFrame.location = "usrInfo.htm";<br>}</p> <p class="样式1"></Script></p> <p class="样式1"><HTML><br><FORM NAME="loginForm"><br>请输入您的大名：<br><INPUT TYPE="text" NAME="usr"><br><INPUT TYPE="button" VALUE="填写完毕" onClick=login()><br></FORM><br></HTML></p> <p>  </p> </blockquote> <ul> <li><strong>防止直接链接：</strong> </li> </ul> <blockquote> <p>例：<br><span class="样式1"><font color="#0000ff"><Script> /* -------- hot.htm -------- */</font></span></p> <p class="样式1">document.title = "热门优惠";<br><br>if (top.usrID == null) {<br>    location = "frameset.htm";<br>}<br><br></Script></p> <p class="样式1">今日优惠：</p> <p class="样式1"><LI>超级豪华大比萨。（原价$550，今天只要$450）<br><LI>海鲜大比萨。（原价$550，今天只要$450）</p> </blockquote> <p>  </p> <ul> <li><strong>检查是否使用框架：</strong> </li> </ul> <blockquote> <p>例：<br><span class="样式1"><font color="#0000ff"><!-------- welcome.htm --------></font></span></p> <p class="样式1"><HEAD><br><TITLE>首页</TITLE><br><STYLE>A{text-decoration:none}</STYLE></p> <p class="样式1"><Script></p> <p class="样式1">if (top.frames.length == 0) {<br>   location = "frameset.htm";<br>}<br>if (top.frames.length > 0) {<br>   location = "frameset.htm";<br>} <br><br></Script></p> <p class="样式1"></HEAD><br><CENTER><br>欢迎光临<H1><br><FONT COLOR="green" FACE="arial"><br>My PIZZA</FONT></H1><br></CENTER></p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <blockquote>   </blockquote></td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ul> <li><strong>表单对象：</strong> </li> </ul> <blockquote> <p>文件对象的子对象，Javascript的runtime engine自动为每一个表单建立一个表单对象。</p> <p>格式：</p> <p>document.forms[索引].属性</p> <p>document.forms[索引].方法（参数）</p> <p>document.表单名称.属性</p> <p>document.表单名称.方法（参数）</p> </blockquote> <p> </p> <ul> <li><strong>表单对象的属性：</strong> </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">action</td> <td>表单动作</td> </tr> <tr> <td align="center">elements</td> <td>以索引表示的所有表单元素</td> </tr> <tr> <td align="center">encoding</td> <td>MIME的类型</td> </tr> <tr> <td align="center">length</td> <td>表单元素的个数</td> </tr> <tr> <td align="center">method</td> <td>方法</td> </tr> <tr> <td align="center">name</td> <td>表单名称</td> </tr> <tr> <td align="center">target</td> <td>目标</td> </tr> </tbody> </table> <p> </p> </blockquote> <ul> <li><strong>表单对象的方法：</strong> </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="180">handleEvent(事件)</td> <td>使事件处理程序生效</td> </tr> <tr> <td align="center">reset()</td> <td>重置</td> </tr> <tr> <td align="center">submit()</td> <td>提交</td> </tr> </tbody> </table> <p> </p> </blockquote> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> <p> </p> </td> </tr> <tr> <td>　</td> </tr> <tr> <td> <p> </p> <ol> <li><strong>文本对象：<br><br></strong> <ul> <li>格式： </li> </ul> <blockquote> <p>document.forms[索引].elements[索引].属性</p> <p>document.forms[索引].elements[索引].方法（参数）</p> <p>document.表单名称.文本对象名称.属性</p> <p>document.表单名称.文本对象名称.方法（参数）</p> </blockquote> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">defaultValue</td> <td>该对象的value属性</td> </tr> <tr> <td align="center">form</td> <td>该对象所在的表单</td> </tr> <tr> <td align="center">name</td> <td>该对象的name属性</td> </tr> <tr> <td align="center">type</td> <td>该对象的type属性</td> </tr> <tr> <td align="center">value</td> <td>该对象的value属性</td> </tr> </tbody> </table> </blockquote> <ul> <li>方法： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="180">blur()</td> <td> </td> </tr> <tr> <td align="center">focus()</td> <td> </td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td> </td> </tr> <tr> <td align="center">select()</td> <td>该对象设置为选取状态</td> </tr> </tbody> </table> </blockquote> <ul> <li>事件处理程序： </li> </ul> <blockquote> <p>onBlur onChange onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp <br>onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove onSelect</p> </blockquote> <ul> <li>例1： </li> </ul> <blockquote> <p class="样式1"><FORM><br>姓名：<br><INPUT TYPE="text" NAME="name"><br><INPUT TYPE="button" VALUE="请单击" onClick=alert("谢谢你，"+this.form.name.value)><br></FORM></p> </blockquote> <ul> <li>例2： </li> </ul> <blockquote> <p class="样式1"><Script><br><br>function getFocus(obj) {<br>    obj.style.color='red';<br>    obj.style.background='#DBDBDB';<br>}<br>function getBlur(obj) {<br>    obj.style.color='black';<br>    obj.style.background='white';<br>}</p> <p class="样式1"></Script></p> <p class="样式1"><BODY onLoad=document.form1.name.focus()><br><FORM NAME="form1"><br>姓　　名：<INPUT TYPE="text" NAME="name"<br>onFocus=getFocus(this) onBlur=getBlur(this)><BR><br>电　　话：<INPUT TYPE="text" NAME="tel"<br>onFocus=getFocus(this) onBlur=getBlur(this)><BR><br></FORM><br></BODY></p> </blockquote> <ul> <li>例3： </li> </ul> <blockquote> <p class="样式1"><Script><br><br>var i = 0;</p> <p class="样式1">function movenext(obj,i) {<br>if(obj.value.length==4){<br>    document.forms[0].elements[i+1].focus();<br>}<br>}</p> <p class="样式1">function result() {<br>fm = document.forms[0];<br>num = fm.elements[0].value + <br>fm.elements[1].value +<br>fm.elements[2].value + <br>fm.elements[3].value ;<br>alert("你输入的信用卡号码是"+ num);<br>}</p> <p class="样式1"></Script></p> <p class="样式1"><BODY onLoad=document.forms[0].elements[i].focus()><br>请输入你的信用卡号码：<br><form><br><input type=text size=3 maxlength=4 onKeyup=movenext(this,0)> -<br><input type=text size=3 maxlength=4 onKeyup=movenext(this,1)> -<br><input type=text size=3 maxlength=4 onKeyup=movenext(this,2)> -<br><input type=text size=3 maxlength=4 onKeyup=movenext(this,3)><br><input type=button value=显示 onClick=result()><br></form><br></BODY></p> <p class="样式1">  </p> </blockquote></li> <li><strong>密码对象：</strong> <ul> <li>格式： </li> </ul> <blockquote> <p>document.forms[索引].elements[索引].属性</p> <p>document.forms[索引].elements[索引].方法（参数）</p> <p>document.表单名称.密码对象名称.属性</p> <p>document.表单名称.密码对象名称.方法（参数）</p> </blockquote> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">defaultValue</td> <td>该对象的value属性</td> </tr> <tr> <td align="center">form</td> <td>该对象所在的表单</td> </tr> <tr> <td align="center">name</td> <td>该对象的name属性</td> </tr> <tr> <td align="center">type</td> <td>该对象的type属性</td> </tr> <tr> <td align="center">value</td> <td>该对象的value属性</td> </tr> </tbody> </table> </blockquote> <ul> <li>方法： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="180">blur()</td> <td> </td> </tr> <tr> <td align="center">focus()</td> <td> </td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td> </td> </tr> <tr> <td align="center">select()</td> <td>该对象设置为选取状态</td> </tr> </tbody> </table> </blockquote> <ul> <li>事件处理程序： </li> </ul> <blockquote> <p>onBlur onChange onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp <br>onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove onSelect</p> </blockquote> <ul> <li>例1： </li> </ul> <blockquote> <p class="样式1"><Script><br><br>function checkPw() {<br>fm = document.form1;<br>if (fm.pw2.value != fm.pw1.value) {<br>    alert("密码不符，请重新输入");<br>    document.form1.pw2.select();<br>}<br>else<br>    alert("谢谢你，"+fm.name.value);<br>}</p> <p class="样式1"></Script></p> <p class="样式1"><BODY onLoad=document.form1.name.focus()><br><FORM NAME="form1"><br>姓　　名：<INPUT TYPE="text" NAME="name"><BR><br>输入密码：<INPUT TYPE="password" NAME="pw1"><BR><br>重新输入：<INPUT TYPE="password" NAME="pw2"><BR><br><INPUT TYPE="button" VALUE="填好了" onClick=checkPw()>　<br><INPUT TYPE="reset" VALUE="重　填"><br></FORM><br></BODY></p> </blockquote> <ul> <li>例2： </li> </ul> <blockquote> <p class="样式1"><Script></p> <p class="样式1">function isInt(elm) {<br>if (isNaN(elm)) {<br>    alert("你输入的是" + elm + "/n不是数字！");<br>    document.forms[0].pw.value = "";<br>    return false;<br>}<br>if (elm.length != 4) {<br>    alert("请输入四位数数字！");<br>    document.forms[0].pw.value = "";<br>    return false;<br>}<br>}<br></Script></p> <p class="样式1"><form action="test.asp" onSubmit="return isInt(this.pw.value)"><br>请输入四位数数字密码：<BR><br><input type="password" name="pw"><br><input type="submit" value="检查"><br></form></p> <p class="样式1"> </p> </blockquote></li> <li><strong>按钮对象、提交按钮对象、重置按钮对象：<br><br></strong> <ul> <li>格式： </li> </ul> <blockquote> <p>document.forms[索引].elements[索引].属性</p> <p>document.forms[索引].elements[索引].方法（参数）</p> <p>document.表单名称.按钮对象名称.属性</p> <p>document.表单名称.按钮对象名称.方法（参数）</p> </blockquote> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">form</td> <td>该对象所在的表单</td> </tr> <tr> <td align="center">name</td> <td>该对象的name属性</td> </tr> <tr> <td align="center">type</td> <td>该对象的type属性</td> </tr> <tr> <td align="center">value</td> <td>该对象的value属性</td> </tr> </tbody> </table> </blockquote> <ul> <li>方法： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="180">blur()</td> <td> </td> </tr> <tr> <td align="center">click()</td> <td> </td> </tr> <tr> <td align="center">focus()</td> <td> </td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td> </td> </tr> </tbody> </table> </blockquote> <ul> <li>事件处理程序： </li> </ul> <blockquote> <p>onBlur onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp <br>onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove</p> <p> </p> </blockquote></li> <li><strong>隐藏对象：<br></strong><br> <ul> <li>格式： </li> </ul> <blockquote> <p>document.forms[索引].elements[索引].属性</p> <p>document.forms[索引].elements[索引].方法（参数）</p> <p>document.表单名称.隐藏对象名称.属性</p> <p>document.表单名称.隐藏对象名称.方法（参数）</p> </blockquote> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">form</td> <td>该对象所在的表单</td> </tr> <tr> <td align="center">name</td> <td>该对象的name属性</td> </tr> <tr> <td align="center">type</td> <td>该对象的type属性</td> </tr> <tr> <td align="center">value</td> <td>该对象的value属性</td> </tr> </tbody> </table> <p> </p> </blockquote></li> <li><strong>单选按钮对象：<br><br></strong> <ul> <li>格式： </li> </ul> <blockquote> <p>document.forms[索引].elements[索引](索引).属性</p> <p>document.forms[索引].elements[索引](索引).方法（参数）</p> <p>document.表单名称.单选对象名称[索引].属性</p> <p>document.表单名称.单选对象名称[索引].方法（参数）</p> </blockquote> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">checked</td> <td>设置该对象为选定状态</td> </tr> <tr> <td align="center">defaultChecked</td> <td>对应该对象的默认选定状态</td> </tr> <tr> <td align="center">form</td> <td>该对象所在的表单</td> </tr> <tr> <td align="center">name</td> <td>该对象的name属性</td> </tr> <tr> <td align="center">type</td> <td>该对象的type属性</td> </tr> <tr> <td align="center">value</td> <td>该对象的value属性</td> </tr> </tbody> </table> </blockquote> <ul> <li>方法： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="180">blur()</td> <td> </td> </tr> <tr> <td align="center">click()</td> <td> </td> </tr> <tr> <td align="center">focus()</td> <td> </td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td> </td> </tr> </tbody> </table> </blockquote> <ul> <li>事件处理程序： </li> </ul> <blockquote> <p>onBlur onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp <br>onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove</p> </blockquote> <ul> <li>例： </li> </ul> <blockquote> <p class="样式1"><Script></p> <p class="样式1">function show() {<br>var x = "先生";<br>if (document.form1.sex[1].checked)<br>  x = "小姐";<br>alert(document.form1.name.value + x);<br>}</p> <p class="样式1"></Script><br><FORM NAME=form1><br>姓名：<INPUT TYPE="text" NAME="name"><BR><br>你是：<INPUT TYPE="radio" NAME="sex" CHECKED>帅哥<br><INPUT TYPE="radio" NAME="sex">美女<BR><br><INPUT TYPE="button" VALUE="请单击" onClick=show()><br></FORM></p> <p> </p> </blockquote></li> <li><strong>复选框对象：</strong> <br><br> <ul> <li>格式： </li> </ul> <blockquote> <p>document.forms[索引].elements[索引].属性</p> <p>document.forms[索引].elements[索引].方法（参数）</p> <p>document.表单名称.单选对象名称[索引].属性</p> <p>document.表单名称.单选对象名称[索引].方法（参数）</p> </blockquote> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">checked</td> <td>设置该对象为选定状态</td> </tr> <tr> <td align="center">defaultChecked</td> <td>对应该对象的默认选定状态</td> </tr> <tr> <td align="center">form</td> <td>该对象所在的表单</td> </tr> <tr> <td align="center">name</td> <td>该对象的name属性</td> </tr> <tr> <td align="center">type</td> <td>该对象的type属性</td> </tr> <tr> <td align="center">value</td> <td>该对象的value属性</td> </tr> </tbody> </table> </blockquote> <ul> <li>方法： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="180">blur()</td> <td> </td> </tr> <tr> <td align="center">click()</td> <td> </td> </tr> <tr> <td align="center">focus()</td> <td> </td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td> </td> </tr> </tbody> </table> </blockquote> <ul> <li>事件处理程序： </li> </ul> <blockquote> <p>onBlur onClick onDbClick onFocus onKeyDown onKeyPress onKeyUp <br>onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove</p> </blockquote> <ul> <li>例： </li> </ul> <blockquote> <p class="样式1 样式1"><Script></p> <p class="样式1">function count() {<br>var checkCount=0;<br>var num = document.form1.elements.length;<br><br>for (var i=0; i<num; i++) {<br>if (document.form1.elements[i].checked)<br>  checkCount++;<br>}<br>alert ("你喜欢 "+ checkCount + "种颜色。")<br>}</p> <p class="样式1"></Script><br><FORM NAME=form1><br>请选择你喜欢的颜色：<BR><br><INPUT TYPE="checkbox" NAME="red">红色<br><INPUT TYPE="checkbox" NAME="green">绿色<br><INPUT TYPE="checkbox" NAME="blue">蓝色<BR><br><INPUT TYPE="button" VALUE="请单击" onClick=count()><br></FORM></p> <p> </p> </blockquote></li> <li><strong>选择对象：<br><br></strong> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">form</td> <td>该对象所在的表单</td> </tr> <tr> <td align="center">name</td> <td>该对象的name属性</td> </tr> <tr> <td align="center">length</td> <td>选项的数目</td> </tr> <tr> <td align="center">options</td> <td><option>标记</td> </tr> <tr> <td align="center">selectedIndex</td> <td>所选项目的索引值</td> </tr> <tr> <td align="center">type</td> <td>该对象的type属性</td> </tr> </tbody> </table> </blockquote> <ul> <li>方法： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="180">blur()</td> <td> </td> </tr> <tr> <td align="center">focus()</td> <td> </td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td> </td> </tr> </tbody> </table> </blockquote> <ul> <li>事件处理程序： </li> </ul> <blockquote> <p>onBlur onClick onChange onFocus onKeyDown onKeyPress onKeyUp <br>onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove<br></p> </blockquote> <p> </p> </li> <li><strong>选项对象：选择对象的子对象<br><br></strong> <ul> <li>格式： </li> </ul> <blockquote> <p><option value="值" selected>文字</option></p> <p>new Option([文字[,值[,defaultSelected[,selected]]]])</p> </blockquote> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">selected</td> <td>判断该选项是否被选取</td> </tr> <tr> <td align="center">defaultSelected</td> <td>指定该选项为默认选定状态</td> </tr> <tr> <td align="center">index</td> <td>所有选项所构成的数组索引值</td> </tr> <tr> <td align="center">length</td> <td>选项的数目</td> </tr> <tr> <td align="center">text</td> <td>该选项显示的文字</td> </tr> <tr> <td align="center">value</td> <td>所选项传到服务器的值</td> </tr> </tbody> </table> </blockquote> <ul> <li>例1： </li> </ul> <blockquote> <p class="样式1"><Script></p> <p class="样式1">var url = new Array(3);<br>url[0] = "http://www.yam.org.tw/";<br>url[1] = "http://www.kimo.com/";<br>url[2] = "http://chinese.yahoo.com/";<br><br>function goto(form) {<br>var i = form.menu.selectedIndex;<br>if (i>0) {<br>location = url[i-1];<br>}<br>}</p> <p class="样式1"></Script><br><FORM><br><SELECT NAME="menu" onChange="goto(this.form)"><br><OPTION>你喜欢哪一个搜索引擎?<br><OPTION STYLE="color:red">◆蕃薯藤<br><OPTION STYLE="color:red">◇奇摩<br><OPTION STYLE="color:red">◆中文雅虎<br></SELECT><br></FORM></p> </blockquote> <ul> <li>例2： </li> </ul> <blockquote> <p class="样式1"><Script><br><br>function getText() {<br>sel = document.forms[0].weekday<br>ans = sel.options[sel.selectedIndex].text<br>return ans;<br>}</p> <p class="样式1"></Script><br><FORM>请选择...<br><SELECT name=weekday><br><OPTION VALUE="Monday">星期一<br><OPTION VALUE="Tuesday">星期二<br><OPTION VALUE="Wednesday">星期三<br><OPTION VALUE="Thursday">星期四<br><OPTION VALUE="Friday">星期五<br><OPTION VALUE="Saturday">星期六<br><OPTION VALUE="Sunday">星期日<br></SELECT><P><br><INPUT TYPE="button" VALUE="取出选项的文字"<br>onClick="alert(getText())"> <br><INPUT TYPE="button" VALUE="取出选项的值"<br>onClick="alert(this.form.weekday.value)"><BR><br></FORM></p> </blockquote> <ul> <li>例3： </li> </ul> <blockquote> <p class="样式1"><FORM NAME="form1"><br>你最喜欢哪一种水果?<br><INPUT TYPE="text" NAME="fruit"><br><A HREF="#" onClick="javascript:open('1.htm','','width=100')"><br>查询</A><br></FORM></p> <p class="样式1"> </p> <p class="样式1"><Script> /* -------- 1.htm -------- */<br><br>function choice() {<br>sel = document.forms[0].elements[0];<br>document.form1.fruit.value = <br>sel.options[sel.selectedIndex].text;<br>self.close();<br>}</p> <p class="样式1"></Script></p> <p class="样式1"><FORM><br><SELECT onChange="choice()"><br><OPTION>请选择<br><OPTION>西瓜<br><OPTION>香蕉<br></SELECT><br></FORM></p> </blockquote> <ul> <li>例4： </li> </ul> <blockquote> <p class="样式1"><Script></p> <p class="样式1">function createOptions(){<br>var option = new Option(document.form1.select1.value)<br>document.form1.select2.options[2] = option;<br>}<br><br></script></p> <p class="样式1"><form name="form1"><br><select name="select1" size="10"><br><option>可选择项目 <option>---------------<br><option value="香蕉">香蕉 <option value="葡萄">葡萄<br><option value="苹果">苹果 <option value="梨子">梨子<br></select></p> <p class="样式1"><input type="button" value="-->" onClick="createOptions()"><br><select name="select2" size="10"><br><option>选择项目 <option>---------------<br></select><br></form></p> </blockquote> <ul> <li>例5： </li> </ul> <blockquote> <p class="样式1"><Script></p> <p class="样式1">function createOptions(){<br>sel1 = document.form1.select1;<br>sel2 = document.form1.select2;<br>var num = sel1.selectedIndex;<br>var option = new Option(sel1.options[num].text);<br>sel2.options[2] = option;<br>}<br><br></script></p> <p class="样式1"><form name="form1"><br><select name="select1" size="10"><br><option>可选择项目 <option>---------------<br><option value="香蕉">香蕉 <option value="葡萄">葡萄<br><option value="苹果">苹果 <option value="梨子">梨子<br></select></p> <p class="样式1"><input type="button" value="-->" onClick="createOptions()"><br><select name="select2" size="10"><br><option>选择项目 <option>---------------<br></select><br></form></p> </blockquote> <ul> <li>例6： </li> </ul> <blockquote> <p class="样式1"><Script></p> <p class="样式1">function createOptions(){<br>sel1 = document.form1.select1;<br>sel2 = document.form1.select2;<br>var num = sel1.selectedIndex;<br>var option = new Option(sel1.options[num].text);<br>var item = sel2.options.length;<br>sel2.options[item] = option;<br>}<br><br></script></p> <p class="样式1"><form name="form1"></p> <p class="样式1"><select name="select1" size="10"><br><option>可选择项目 <option>---------------<br><option value="香蕉">香蕉 <option value="葡萄">葡萄<br><option value="苹果">苹果 <option value="梨子">梨子<br></select></p> <p class="样式1"><input type="button" value="-->" onClick="createOptions()"><br><select name="select2" size="10"><br><option>选择项目 <option>---------------<br></select><br></form></p> </blockquote> <ul> <li>例7： </li> </ul> <blockquote> <p class="样式1"><Script></p> <p class="样式1">function createOptions(){<br><br>sel1 = document.form1.select1;<br>sel2 = document.form1.select2;<br>var num = sel1.selectedIndex;<br>if (num > 1) {<br>var option = new Option(sel1.options[num].text);<br>var item = sel2.options.length;<br>sel2.options[item] = option;<br>}<br>sel1.selectedIndex = 10000;<br>}</p> <p class="样式1">function delOptions() {<br>var num = document.form1.select2.selectedIndex;<br>if (num>1) <br>document.form1.select2.options[num] = null;<br>else <br>document.form1.select2.selectedIndex = 10000;<br>}<br><br></script><br><form name="form1"><br><select name="select1" size="10" <br>onDblClick="createOptions()"><br><option>可选择项目 <option>---------------<br><option value="香蕉">香蕉 <option value="葡萄">葡萄<br><option value="苹果">苹果 <option value="梨子">梨子<br></select><br><input type="button" value="选择" onClick="createOptions()"><br><select name="select2" size="10"><br><option>选择项目 <option>---------------<br></select><br><input type="button" value="删除" onClick="delOptions()"><br></form><br></p> <p> </p> </blockquote></li> <li><strong>文本区域对象：<br><br></strong> <ul> <li>属性： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="160">defaultValue</td> <td>对应该对象的默认值</td> </tr> <tr> <td align="center">form</td> <td>该对象所在的表单</td> </tr> <tr> <td align="center">name</td> <td>该对象的name属性</td> </tr> <tr> <td align="center">type</td> <td>该对象的type属性</td> </tr> <tr> <td align="center">value</td> <td>该对象的value属性</td> </tr> </tbody> </table> </blockquote> <ul> <li>方法： </li> </ul> <blockquote> <table width="500" border="0"> <tbody> <tr> <td align="center" width="180">blur()</td> <td> </td> </tr> <tr> <td align="center">select()</td> <td> </td> </tr> <tr> <td align="center">focus()</td> <td> </td> </tr> <tr> <td align="center">handleEvent(事件)</td> <td> </td> </tr> </tbody> </table> </blockquote> <ul> <li>事件处理程序： </li> </ul> <blockquote> <p>onBlur onClick onChange onSelect onFocus onKeyDown onKeyPress onKeyUp <br>onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove</p> </blockquote> <ul> <li>例1： </li> </ul> <blockquote> <p class="样式1"><Script></p> <p class="样式1">function isTooLong(elm){<br>if (elm.length > 50) {<br>  alert("留言内容太长，请修改后再发送....");<br>  return false;<br>}<br>}<br><br></script></p> <p class="样式1"><FORM onSubmit="return isTooLong(this.msg.value)"><br><TEXTAREA NAME="msg" COLS="30" ROWS="5" onFocus="this.value=''"><br>欢迎留言，不过请长话短说....<br>

• 例2：

读者回函

姓　　名：
电子邮件：
内　　容：	<br>我非常喜欢你的书，加油!!!<br>

 

文件上传对象：

• 属性：

form	该对象所在的表单
name	该对象的name属性
type	该对象的type属性
value	该对象的value属性

• 方法：

blur()
select()
focus()
handleEvent(事件)

• 事件处理程序：

onBlur onClick onSelect onFocus onKeyDown onKeyPress onKeyUp
onMouseDown onMouseUp onMouseOver onMouseOut onMouseMove

 

 

 

 

 

 

 

 

 

　

 

• Cookie对象：

是一种以文件（Cookie文件）的形式保存在客户端硬盘的Cookies文件夹中的用户数据信息（Cookie数据）。Cookie文件由所访问的Web站点建立，以长久的保存客户端与Web站点间的会话数据，并且该Cookie数据只允许被所访问的Web站点进行读取。

• Cookie文件的格式：

NS：Cookie.txt
IE：用户名@域名.txt

• 写入Cookie：

格式：

document.cookie = " 关键字 = 值 [ ; expires = 有效日期 ] [;...]"

备注：

1. 有效日期格式：Wdy,DD-Mon-YY HH:MM:SS GMT
2. Wdy / Mon：英文星期 / 月份；
3. 还包含path、domain、secure属性；
4. 每个Web站点（domain）可建立20个Cookie数据；
5. 每个浏览器可存储300个Cookie数据，4k字节；
6. 客户有权禁止Cookie数据的写入。
   

例1：

例2：

 

• 读取Cookie：

格式：

document.cookie

例

 

• 删除Cookie：

格式：

document.cookie = " 关键字 = ; expires = 当前日期"

例：

对象属性
document.title             //设置文档标题等价于HTML的