JavaScript 参考手册

前言

本文是这个网站发布的 Javascript 使用手册的二次整理, 或者说是 Markdown 移植版. 由于本文也是说明手册性质的, 章节之间并没有过渡性语言, 知识点之间是非常零散化的, 所以不适合作为学习型书籍阅读, 而是适合作为手册查询使用.

JavaScript 与 Java 的区别

  • 首先, 它们是两个公司开发的不同的两个产品.

Java 是 SUN 公司推出的面向对象程序设计语言, 而 JavaScript 是 Netscape 公司的产品, 是为了扩展 Netscape Navigator 功能而开发的一种可以嵌入 Web 页面中的基于对象和事件驱动的解释性语言.

  • 其次, JavaScript 是基于对象的, 而 Java 是面向对象的.

Java 是一种真正的面向对象的语言, 即使是开发简单的程序, 也必须设计对象. JavaScript 是一种基于对象和事件驱动的脚本语言, 它本身提供了非常丰富的内部对象供设计人员使用.

  • 第三, 两种语言在其浏览器中所执行的方式不一样.

Java 的源代码在传递到客户端执行之前必须经过编译, 因而客户端上必须具有相应平台上的仿真器或解释器. JavaScript 是一种解释性编程语言, 其源代码在发往客户端执行之前不需经过编译, 而是将文本格式的字符代码直接发送给客户, 由浏览器来解释执行.

  • 第四, 两种语言所采取的变量是不一样的.

Java 采用强类型变量检查, 即所有变量在编译之前必须作类型的声明. JavaScript 中变量声明, 采用弱类型, 即变量在使用前不需作声明类型, 而是解释器在运行时检查其数据类型.

  • 第五, 代码格式不一样.

Java 是一种与 HTML 无关的格式, 必须通过像 HTML 中引用外媒体那样进行装载, 其代码以字节代码的形式保存在独立的文档中. JavaScript 的代码是一种文本字符格式, 可以直接嵌入 HTML 文档中, 并且可动态装载.

  • 第六, 嵌入方式不一样.

在 HTML 文档中, 两种编程语言的标识不同, JavaScript使用 <script>...</script> 来标识, 而 Java 使用<applet> ... </applet> 来标识.

  • 第七, 静态绑定和动态绑定.

Java 采用静态联编, 即 Java 的对象引用必须在编译时的进行, 以使编译器能够实现强类型检查, 如不经编译则就无法实现对象引用的检查. JavaScript 采用动态联编, 即 JavaScript 的对象引用在运行时进行检查.

JavaScript 代码格式

  • JavaScript 脚本程序代码区分大小写.

  • JavaScript 脚本程序不能单独运行, 必须嵌入在 HTML 文件中才能执行.

  • JavaScript 脚本程序中不能包含 HTML 代码, 但是字符串中可以包含.

document.write("Kirito<br>Asuna").

  • JavaScript 脚本程序可以独立保存为一个外部文件, 但其中不能包含 <script> </script> 标签.

HTML 标签语言中引用 JavaScript 脚本语言需要使用 <script> </script> 标签, 标签内部就是 JavaScript 脚本代码.

1
2
3
<script language="JavaScript" type="text/JavaScript">
document.write(" Hello World ");
</script>

HTML 中使用 <!-- 单/多行注释 --> 进行注释, 并且 HTML 的注释只有这一种, 可以注释任意行.

1
2
3
<script language="JavaScript1.2" type="text/JavaScript" src="hello.js">
<!-- document.write("Hello World!!!"); -->
</script>

JavaScript 中使用 // 单行注释/* 多行注释 */ 进行注释.

1
2
// document.write("Hello World!!!");
/* document.write("Hello World!!!"); */

JavaScript 数据类型

转义字符

转义字符 意义
\b 退格 (Backspace)
\f 换页 (Form feed)
\n 换行 (Line feed)
\r 回车 (Carriage return)
\t 制表符 (Tab)
\' 单引号 (')
\" 双引号 (")
\\ 反斜线 ()

数组

1
2
3
4
// 定义
stringArray = ["听音乐", "看电影"]
// 取值:
stringArray[0] stringArray[1]

变量

由于 JavaScript 使用弱类型, 所以一般情况下变量的定义都使用 var 进行定义.

1
2
3
4
5
var stdId = 0001;
var notNull = true;
var name = "Kirito", sex = "Male";
// JavaScript 中没有 Char 类型, 只有 String 类型.
// 单引号 '' 和 双引号 "" 都表示字符串, 没有区别.

全局变量

在函数外进行声明, 也可以通过省略掉 var 关键字的方式进行声明, 但是不建议使用这种省略的方式.

全局变量可在整个脚本中被使用, 可在不同的窗口中相互引用.

局部变量

在函数内声明, 只能在函数内部使用.

1
2
3
4
5
6
7
8
9
10
11
12
var langJS = "JavaScript"; // langJS 在函数外部进行定义, 是全局变量.

PintString();// 调用 PintString() 方法.

function PintString()
{
var langVBS = "VBScript"; // langVBS 在函数内部进行定义, 是局部变量.
document.write("<br>" + langJS + "<br>");// 可以打印 全局变量 langJS
document.write("<br>" + langVBS + "<br>");// 可以打印 局部变量 langVBS
}

document.write("<br>" + langJS + "<br>");//函数外部只能打印 全局变量 langJS

JavaScript 运算符

  • ++= 在 JavaScript 中也可以进行字符串的拼接.
  • ==!= 只用于判断两个变量之间的值是否相等.
  • ===!== 用于判断两个变量之间的值以及变量的类型是否相等.
1
2
3
4
var x = 5; // x 是数值 5
var y = '5'; // y 是字符串 5
var z = "5"; // z 是字符串 5
var i = `5`; // i 是模板字符串 5
  • && 运算符在运算时, 如果左右两方全是逻辑值, 那么此时它和普通的 && 运算符功能完全一样, 返回逻辑值.

  • && 运算符在运算时, 如果左右两方中有一方不是逻辑值, 也不是 null, 也不是 数字0, 那么返回的值取决于左面的值, 而且此时返回的值不一定是逻辑值了:

    • 如果左面的值是 true, 那么返回右面的值.
    • 如果左面的值是 false, 那么就返回 false.
    • 如果左面的值是除了 null数字0 以外的非逻辑值, 那么等同于 true, 返回右面的值.
  • && 运算符在运算时, 如果左右两方中任意一方是 null 或者 数字0, 那么先遇到谁就返回谁.

  • || 运算符在运算时, 如果左右两方全是逻辑值, 那么此时它和普通的 || 运算符功能完全一样.

  • || 运算符在运算时, 如果左右两方中有一方不是逻辑值, 也不是 null, 也不是 数字0, 那么返回的值取决于左面的值, 而且此时返回的值不一定是逻辑值了:

    • 如果左面的值是 true, 那么直接返回 true.
    • 如果左面的值是 falsenull数字0, 那么返回右面的值, 否则返回左面的值.
    • || 运算符在运算时, null || null 返回 null.
    • || 运算符在运算时, 数字0 || 数字0 返回 数字0.

总之, 由于 JavaScript 是弱类型语言, 所以在使用 && 以及 || 的时候, 一定要确保左右的值都是逻辑值.

  • ! 运算符的返回值就很单一了, 只会返回逻辑值. 数字0 会被视为 false, 其他除了 null 以外的非逻辑值被视为 true, null 不能进行取反操作, 会直接报错.

  • 三元运算符, 格式: (条件表达式) ? true 返回值 : false 返回值

JavaScript 语句

with 语句

  • 功能: 为一段程序建立默认对象, 这样整个 with 语句中的方法就可以不用写默认的对象, 可以直接调用.
1
2
3
4
5
6
with (document)
{
write ("┭┮﹏┭┮");
write ("o((>ω< ))o");
//document.write ("o((>ω< ))o");
}

流程控制语句

for, while, do while, if else, switch 等流程控制语句和其他编程语言没有区别.

for in 语句

依次取出指定对象的所有属性, 类似于 foreach 语句.

1
2
3
4
for ( var 临时变量名 in 对象 )
{
// 临时变量中就会依次保存对象中的所有属性.
}

JavaScript 对象

默认对象 之 日期对象 (Date)

  • 日期基线

1970-01-01 00:00:00

  • 实例化一个日期对象

名称 = new Date (参数)

1
2
3
4
5
6
7
8
// 英文-数值格式: 月 日, 公元年
today = new Date ("October 1, 2008");
// 英文-数值格式: 月 日, 公元年 [时: 分: 秒]
today = new Date ("October 1, 2008 12:00:00");
// 数值格式: 公元年, 月, 日
today = new Date (2008, 10, 1);
// 数值格式: 公元年, 月, 日, [时, 分, 秒]
today = new Date (2008, 10, 1, 23, 59, 59);
  • 日期对象的方法
方法 作用
getYear() 返回年份数
getFullYear() 返回年份数
getMonth() 返回月份数 (0--11)
getDate() 返回日期数 (1--31)
getDay() 返回星期数 (0--6)
getHours() 返回小时数 (0--23)
getMinutes() 返回分钟数 (0--59)
getSeconds() 返回秒数 (0--59)
getMilliseconds() 返回毫秒数 (0--999)
getTime() 返回对应日期基线的毫秒数
Date.parse(日期字串) 返回对应日期基线的毫秒
setTime(时间值) 指定一日期对象的值
toGMTString() 以 GMT 格式的字符串表示日期对象
toUTCString() 以 UTC 格式的字符串表示日期对象

默认对象 之 一维数组 (Array)

  • 实例化一个数组对象
1
2
3
stringArray = new Array(2);//先定义数组大小, 再赋值.
stringArray[0] = "Kirito";
stringArray[1] = "Asuna";
1
stringArray = new Array("Kirito", "Asuna");//定义的时候直接赋值.
1
stringArray = ["Kirito", "Asuna"];//省略式写法, 使用中括号. (不推荐新人使用这种写法)
  • 数组对象的属性 length, 返回数组长度.

  • 数组对象的方法

方法 作用
join( ) 将所有的数组元素组合成一个字符串, 然后返回. 各个数组元素之间使用英文的 ',' 连接.
join('str') 将所有的数组元素组合成一个字符串, 然后返回, 各个数组元素之间使用 'str' 连接.
toString( ) 将所有的数组元素组合成一个字符串, 然后返回. 各个数组元素之间使用英文的 ',' 连接.
reverse( ) 数组反转
valueOf( ) 将所有的数组元素组合成一个字符串, 然后返回. 各个数组元素之间使用英文的 ',' 连接.

默认对象 之 交错数组

交错数组并不是仅仅只有两层, 可以循环定义从而构成多层交错数组, 但是多层交错数组操作难度是相当高的.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
var fruit = new Array(3);
fruit[0] = new Array("苹果", 2);
fruit[1] = new Array("梨子", 3);
fruit[2] = new Array("橘子", 4);

for (i = 0; i < fruit.length; i++)
{
for (j = 0; j < fruit[0].length; j++)
{
document.write("fruit [", i, "][", j, "] = ", fruit[i][j],"<br>");
}

document.write("<br>");
}

默认对象 之 字符串对象 (String)

  • 实例化一个字符串对象
1
2
3
var strName = new String('Kirito');
var strNameFemale = 'Asuna';
// JavaScript 中 单引号 和 双引号 都表示字符串, JavaScript 中没有 Char 类型.
  • 字符串对象的属性: length 返回字符串的长度.

  • 字符串对象的方法:

使用方法: str.bold ( ) 实现效果 返回的 HTML 标签
fixed ( ) 以等宽字体显示文本 <tt> </tt>
bold ( ) 以粗体显示文本 <b> </b>
fontsize ( 字级大小 ) 按照字级大小显示文本 <font> </font>
fontcolor ( #rrggbb ) 按照颜色显示文本 <font> </font>
sup ( ) 将文本显示为上标 <sup> </sup>
sub ( ) 将文本显示为下标 <sub> </sub>
toUpperCase ( ) 返回将字符串中的英文字母全部转换为大写后的新字符串
toLowerCase ( ) 返回将字符串中的英文字母全部转换为小写后的新字符串
charAt ( 索引 ) 返回索引位置的字符
charCodeAt ( 索引 ) 返回索引位置的 ASCII 字符码, 用十进制表示
indexOf ( "strSearch" ) 返回 strSearch 在对象中的索引位置
lastIndexOf ( "strSearch" ) 返回 strSearch 在对象中的索引位置 (反向搜索)
search ( "strSearch" ) 返回 strSearch 在对象中的索引位置
replace ( "strReplace1", "strReplace2" ) 将 strReplace1 使用 strReplace2 进行替换
substring ( startIndex, length ) 返回从 startIndex 下标开始, 长度为 length 的子字符串

默认对象 之 布尔对象 (Boolean)

  • 实例化一个布尔对象实例:
1
2
var x = new Boolean (转换值);
// 转换值: null, 未定义, 0, false 返回 false, 其他情况都返回 true.

默认对象 之 数学对象 (Math)

  • Math 中包含的属性:
属性名 保存的数值
E 自然数 e
LN2 以 e 为底 2 的对数
LN10 以 e 为底 10 的对数
LOG2E 以 2 为底 e 的对数
LOG10E 以 10 为底 e 的对数
PI 圆周率
SQRT1_2 1/2的平方根
SQRT2 2的平方根
  • Math 中包含的方法:
方法名 返回值
ceil ( 数值 ) 大于等于该数值的最小整数
floor ( 数值 ) 小于等于该数值的最大整数
min ( 数值1, 数值2 ) 返回参数中的最小值
max ( 数值1, 数值2 ) 返回参数中的最大值
pow ( 数值1, 数值2 ) 返回数值1的数值2次方
random ( ) 返回随机数 0-1
round ( 数值 ) 返回最接近该数字的整数
sqrt ( 数值 ) 返回数值的平方根
abs ( 数值 ) 返回数值的绝对值
sin ( 数值 ) 返回数值的 sin
cos ( 数值 ) 返回数值的 cos
tan ( 数值 ) 返回数值的 tan
asin ( 数值 ) 返回数值的 arcsin
acos ( 数值 ) 返回数值的 arccos
atan ( 数值 ) 返回数值的 arctan
exp ( 数值 ) 返回 e 的数值次方
log ( 数值 ) 返回以 e 为底数值的对数

自定义对象

  • 自定义对象的定义方法

可以使用构造函数语法格式来定义一个 "自定义对象" 类型.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
function Member(name, sex)//定义一个类, 名字是 Member
{
this.name = name;//定义一个属性, 名字是 name, 由外部赋值

this.sex = sex;//定义一个属性, 名字是 sex, 由外部赋值

this.number = 3;//定义一个属性, 名字是 number, 由内部赋值

this.Display = Display;//声明一个方法, 名字是 display
}

function Display()//定义上面已经声明的 Display 方法
{
// JavaScript 中没有 Char 类型, 单引号 和 双引号 都表示字符串.
var strName = this.name + ' 是 ' + this.sex;

var strNumber = 'number 的值是 ' + this.number;

document.write("<UL> <LI>", strName);//开启一个无序列表

document.write("<LI>", strNumber, "</UL>");//结束一个无序列表
}
  • 使用 new 来实例化自定义对象.
1
2
3
4
5
6
7
var papa = new Member("杨宏文", "男生");
var mama = new Member("黄雅玲", "女生");
var doggy = new Member("奇奇", "宠物狗");

papa.Display();//调用类型中的 Display() 方法.
mama.Display();
doggy.Display();

为对象动态添加属性和方法

为 "默认对象" 添加属性和方法

JavaScript 允许程序员修改 Javascript 所提供的默认对象, 程序员可以利用对象原型 prototype 为默认对象添加自身定义属性以及方法.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
// 使用 prototype 为默认对象 String 添加一个自定义方法, 名字是: replaceAll,
// 并设置 replaceAll 方法指向自定义的 strReplace 方法.
String.prototype.replaceAll = strReplace;

// 自定义的 strReplace 方法:
function strReplace (findText, replaceText)
{
// this 代指调用这个方法的对象.
// strReplace 被调用时的语句是: str.strReplace(); this 指代的就是 str
// 所以下面的语句可以获取调用这个方法的实例的值.
var str = new String(this);

while (str.indexOf(findText) != -1)//只要存在 findText
{
str = str.replace(findText, replaceText);// 便使用 replaceText 进行替换
}

return str;
}

为 "自定义对象" 添加属性和方法

JavaScript 也允许程序员使用对象原型 prototype 为自己的 "自定义类型" 动态添加属性和方法.

  • 为 "自定义类型" 添加属性和方法.
1
2
3
4
5
6
7
// 使用 prototype 添加属性 hobby
Member.prototype.hobby = null;

// 新属性也可以直接使用
papa.hobby="上网";
mama.hobby="逛街";
doggy.hobby="啃骨头";

JavaScript 默认函数

编码函数

  • escape( 'str' )

  • 将字符串 str 中所有的 非 ASCII 字符 转换成 URL 编码, ASCII 字符 保持不变, 之后返回新字符串.

如: 普通空格 (space) => %20

译码函数

  • unescape()

  • URL 编码 转换成相应的字符.

求值函数

  • eval('str')

  • str 中的表达式计算出结果之后返回.

  • 例如 eval("1 + 2"); 返回的值就是 3

数值判断函数

  • isNaN( 变量 )

  • 判断参数变量的类型是否为数值类型, 返回 truefalse.

整数转换函数

  • parseInt('str_number', 底数)

  • 将不同进制的数值 ( 比如二进制, 八进制, 十六进制) 转换成十进制整数.

  • 虽然第二个参数 底数 可以省略, 但是用于进制转换的时候强烈建议不要省略.

  • 这个方法还有一种用途, 如 parseInt("3.1234A56"); 只会返回整数 3.

底数 效果
2: parseInt( '110', 2 ) 按照二进制将数字 110 转换为十进制
8: parseInt( '110', 8 ) 按照八进制将数字 110 转换为十进制
16: parseInt( 'FE', 16 ) 按照十六进制将数字 FE 转换为十进制

浮点数转换函数

  • parseFloat('str_number')

  • 将 数值字符串 转换成 浮点数, 如 parseFloat("3.1234A56"); 返回浮点数 3.1234.

JavaScript 自定义函数

1
2
3
4
5
6
7
function 函数名(参数1, 参数2, ..., 参数n)
{
//TODO
<语句组>
//return 语句可以省略, 但是强烈建议不要省略.
[return <表达式>;]
}

JavaScript 事件

  • 事件就是指用户对浏览器所做的特定的动作会触发相应的方法, 它是实现交互操作的一种机制.
事件名称 适用对象 意义 说明
Abort image 终止 当图形尚未完全加载前
Blur 失去焦点
Change t/pw/ta/select 改变
DragDrop window 拖曳
Error img/win 错误加载文件或图形时发生错误
Focus 取得焦点
Move window 移动
Reset form 重置
Submit form

其他事件: Click/DblClick, KeyDown/KeyPress/KeyUp, Load/Unload, MouseDown/MouseUp/MouseOver/MouseOut/MouseMove.

事件写法一

  • 直接使用 HTML 中 body 标签的 onload 事件属性.

<body onload = "alert('Star Buster Stream!');"> </body>

事件写法二

  • 使用对象中的 on(...) 事件属性.
1
2
var str = 'Star Buster Stream!';
document.onload = alert(str);
1
2
3
4
5
6
7
function Show()
{
var str = "Star Buster Stream!";
alert(str);
}

document.onload = Show();

JavaScript 定时器

setTimeout ( )

  • 定时器对象名 = setTimeout("<表达式>", time); : 等待 time 毫秒后只执行一次<表达式>.

clearTimeout ( )

  • clearTimeout (定时器对象名) : 终止一个 Timeout 定时器.

setInterval ( )

  • 定时器对象名 = setInterval ("<表达式>", time) : 每等待 time 毫秒后便执行一次<表达式>, 直至窗口, 框架被关闭或执行 clearInterval.

clearInterval ( )

  • clearInterval (定时器对象名) : 终止一个 Interval 定时器.

JavaScript 图像对象

  • 网页中的图像均会被自动看作图像对象, 并依顺序, 分别表示为 document.images[0], document.images[1], ...

  • 图像对象名称 = new Image ( [宽度], [高度] ); //px

  • 图像对象的属性: border complete height hspace lowsrc name src vspace width

  • 图像对象的事件: onAbort onError onKeyDown onKeyPress onKeyUp onLoad

JavaScript Navigator 对象

  • 检测浏览器的版本, 所支持的 MIME 类型, 已安装的插件程序(plug-in).
属性名 含义
appCodeName 代码
appName 名称
appVersion 版本
language 语言
mimeType 以数组表示所支持的 MIME 类型
platform 编译浏览器的机器类型
plugins 以数组表示已安装的插件程序
userAgent 用户代理程序的表头
  • 该对象还包含两个子对象: plugin mimeType

plugin 对象的属性

属性名 含义
description 插件程序模块的描述
filename 插件程序模块的文件名
length 插件程序模块的个数
name 插件程序模块的名称

mimeType 对象的属性

属性名 含义
description MIME 类型的描述
enablePlugin 对应到哪个插件模块
length MIME 类型的数目
suffixes MIME 类型的扩展名
type MIME 类型的名称

JavaScript 窗口对象

窗口对象的属性

属性名 含义
document 当前文件的信息
location 当前URL的信息
name 窗口名称
status 状态栏的临时信息
defaultStatus 状态栏默认信息
history 该窗口最近查阅过的网页
closed 判断窗口是否关闭, 返回布尔值
opner open方法打开的窗口的源窗口
outerHeight 窗口边界的垂直尺寸, px
outerWidth 窗口边界的水平尺寸, px
pageXOffset 网页x-position的位置
pageYOffset 网页y-position的位置
innerHeight 窗口内容区的垂直尺寸, px
innerWidth 窗口内容区的水平尺寸, px
screenX 窗口左边界的X坐标
screenY 窗口上边界的Y坐标
self 当前窗口
top 最上方的窗口
parent 当前窗口或框架的框架组
frames 对应到窗口中的框架
length 框架的个数
locationbar 浏览器地址栏
menubar 浏览器菜单栏
scrollbars 浏览器滚动条
statusbar 浏览器状态栏
toolbar 浏览器工具栏
offscreenBuffering 是否更新窗口外的区域
personalbars 浏览器的个人工具栏, 仅 Navigator

窗口对象的方法

方法名 含义
alert(信息字串) 弹出警告信息
confirm(信息字串) 显示确认信息对话框
prompt(提示字串[, 默认值]) 显示提示信息, 并提供可输入的字段
atob(译码字串) 对base-64编码字串进行译码
btoa(字串) 将进行base-64编码
back() 回到历史记录的上一网页
forward() 加载历史记录中的下一网页
open(URL, 窗口名称[, 窗口规格])
focus() 焦点移到该窗口
blur() 窗口转成背景
stop() 停止加载网页
close()
enableExternalCapture() 允许有框架的窗口获取事件
disableExternalCapture() 关闭enableExternalCapture()
captureEvents(事件类型) 捕捉窗口的特定事件
routeEvent(事件) 传送已捕捉的事件
handleEvent(事件) 使特定事件的处理生效
releaseEvents(事件类型) 释放已获取的事件
moveBy(水平点数, 垂直点数) 相对定位
moveTo(x坐标, y坐标) 绝对定位
setResizable(true false)
resizeBy(水平点数, 垂直点数) 相对调整窗口大小
resizeTo(宽度, 高度) 绝对调整窗口大小
scroll(x坐标, y坐标) 绝对滚动窗口
scrollBy(水平点数, 垂直点数) 相对滚动窗口
scrollTo(x坐标, y坐标) 绝对滚动窗口
setInterval(表达式, 毫秒)
setTimeout(表达式, 毫秒)
clearInterval(定时器对象)
clearTimeout(定时器对象)
home() 进入浏览器设置的主页
find([字串[,caseSensitivr,backward]]) 查找窗口中特定的字串
print()
setHotKeys(true false)
setZOptions() 设置窗口重叠时的堆栈顺序

窗口对象的事件处理程序

onBlur onDragDrop onError onFocus onLoad onMove onResize onUnload

open 方法

  • open 方法的窗口规格参数 ( yes/no, 1/0 )
属性名 含义
alwaysLowered 是否将窗口显示的堆栈后推一层
alwaysRaised 是否将窗口显示的堆栈上推一层
dependent 是否将该窗口与当前窗口产生依存关系
fullscreen 是否满屏显示
directories 是否显示连接工具栏
location 是否显示网址工具栏
menubar 是否显示菜单工具栏
scrollbars 是否显示滚动条
status 是否显示状态栏
titlebar 是否显示标题栏
toolbar 是否显示标准工具栏
resizable 是否可以改变窗口的大小
screenX 窗口左边界距离
screenY 窗口上边界距离
top 窗口上边界
width 窗口宽度
height 窗口高度
left 窗口左边界
outerHeight 窗口外边界的高度
personalbar 是否显示个人工具栏

JavaScript 屏幕对象

  • 描述屏幕的显示及颜色属性.

  • 格式: screen.属性

屏幕对象的属性:

属性名 含义
availHeight 屏幕区域的可用高度
availWidth 屏幕区域的可用宽度
colorDepth 颜色深度 256/8 16/16 32M/32
height 屏幕区域的实际高度
width 屏幕区域的实际宽度

JavaScript 事件对象

  • 当事件发生时, 浏览器自动建立该对象, 并包含该事件的类型, 鼠标坐标等.

  • 格式: event.属性

事件对象的属性

属性名 含义
data 返回拖拽对象的URL字符串 (dragDrop)
width 该窗口或框架的高度
height 该窗口或框架的高度
pageX 光标相对于该网页的水平位置
pageY 光标相对于该网页的垂直位置
screenX 光标相对于该屏幕的水平位置
screenY 光标相对于该屏幕的垂直位置
target 该事件被传送到的对象
type 事件的类型
which 数值表示的键盘或鼠标键: 1/2/3 (左键/中键/右键)
layerX 光标相对于事件发生层的水平位置
layerY 光标相对于事件发生层的垂直位置
x 相当于layerX
y 相当于layerY

JavaScript 历史对象

  • 用以存储客户端最近访问的网址清单.

  • 格式: history.属性. history.方法 (参数)

历史对象的属性:

属性名 含义
current 当前历史记录的网址
length 存储在记录清单中的网址数目
next 下一个历史记录的网址
previous 上一个历史记录的网址

历史对象的方法:

方法名 含义
back( ) 回到上一个历史记录中的网址
forward( ) 回到下一个历史记录中的网址
go ( 整数或URL ) 前往历史记录中的网址

JavaScript 位置对象

  • 用来代表特定窗口的 URL 信息.

  • 格式: location.属性. location.方法 (参数)

  • URL的格式: protocol//host:port/path#hash?search

  • URL的种类:

    • javascript: javascript 程序代码
    • view-source: 显示源代码
    • http:
    • file:
    • ftp:
    • mailto:
    • news:
    • gopher

位置对象的属性

属性名 含义
hash 锚点名称
host 主机名称
hostname host:port
href 完整的URL字符串
pathname 路径
port 端口
protocol 协议
search 查询信息

位置对象的方法

方法名 含义
reload() 重新加载
replace(网址) 用指定的网页取代当前网页

JavaScript 文件对象

  • 代表当前 HTML 对象, 是由 <body> 标签组构成的, 对每个 HTML 文件会自动建立一个文件对象.

  • 格式: document.属性. document.方法 (参数)

文件对象的属性

属性名 含义
linkColor 设置超链接的颜色
alinkColor 作用中的超链接的颜色
vlinkColor 链接的超链接颜色
links 以数组索引值表示所有超链接
URL 该文件的网址
anchors 以数组索引值表示所有锚点
bgColor 背景颜色
fgColor 前景颜色
classes 文件中的class属性
cookie 设置cookie
domain 指定服务器的域名
formName 以表单名称表示所有表单
forms 以数组索引值表示所有表单
images 以数组索引值表示所有图像
layers 以数组索引值表示所有layer
embeds 文件中的plug-in
applets 以数组索引值表示所有applet
plugins 以数组索引值表示所有插件程序
referrer 代表当前打开文件的网页的网址
tags 指出HTML标签的样式
title 该文档的标题
width 该文件的宽度 (px)
lastModified 文件最后修改时间

文件对象的方法

方法名 含义
captureEvents(事件) 设置要获取指定的事件
close() 关闭输出字符流, 强制显示数据内容
getSelection() 取得当前选取的字串
handleEvent(事件) 使事件处理器生效
open([mimeType,[replace]]) 打开字符流
releaseEvents(事件类型) 释放已获取的事件
routeEvent(事件) 传送已捕捉的事件
write(字串) 写字串或数值到文件中
writeln(字串) 分行写字串或数值到文件中 (<pre>..</pre>)

JavaScript 锚点对象

  • 网页中的锚点均会被自动看作锚点对象, 并依顺序, 分别表示为 document.anchors[0], document.anchors[1]...

  • 定义锚点对象的格式: 字串.anchor ( 属性 )

锚点对象的属性

属性名 含义
name 锚点名称
text 锚点字串

JavaScript 链接对象

  • 网页中的链接均会被自动看作链接对象, 并依顺序, 分别表示为 document.links[0], document.links[1]...

  • 定义链接对象的格式: 字串.link(属性)

链接对象的属性:

属性名 含义
hash URL中的锚点名称
host 主机域名或IP地址
hostname URL中的host+port
href 完整的URL字串
pathname URL中path部分
port URL中端口部分
protocol URL中通讯协议部分
search URL中查询字串部分
target 代表目标的窗口
text 表示A标签中的文字
x 链接对象的左边界
y 链接对象的右边界

链接对象的方法

方法名 含义
handleEvent(事件) 激活对某事件的处理程序

链接对象的事件处理程序

onClick onDbClick onKeyDown onKeyPress onKeyUp onMouseDown onMouseUp onMouseOver onMouseOut

JavaScript 框架对象

  • 可以被窗口中的框架引用的对象, 具有窗口对象的属性和方法.

  • 格式:

    • top.frameName|frames[n].属性|方法
    • parent.frameName|frames[n].属性|方法

JavaScript Cookie 对象

  • 是一种以文件 (Cookie 文件) 的形式保存在客户端硬盘的 Cookies 文件夹中的用户数据信息 (Cookie 数据) .

  • Cookie 文件由所访问的 Web 站点建立, 以长久的保存客户端与 Web 站点间的会话数据, 并且该 Cookie 数据只允许被所访问的 Web 站点进行读取.

  • Cookie 文件的格式:

    • NS: Cookie.txt
    • IE: 用户名@域名.txt
  • 格式: document.cookie = " 关键字 = 值 [ ; expires = 有效日期 ] [;...] "

  • 备注:

    • 有效日期格式: Wdy,DD-Mon-YY HH:MM:SS GMT, Wdy: 英文星期, Mon: 月份.
    • 还包含 path, domain, secure 属性.
    • 每个 Web 站点 (domain) 可建立 20 个 Cookie 数据.
    • 每个浏览器可存储 300 个 Cookie 数据, 4k字节.
    • 客户有权禁止 Cookie 数据的写入.

读取Cookie

  • 格式: document.cookie

删除Cookie

  • 格式: document.cookie = " 关键字 = ; expires = 当前日期"