-1■流程语句■■用于控制代码走向■◆0■函数■函数（）{}■函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。

函数是由事件驱动的或者当它被调用时执行的可重复使用的代码块。
实例
<!DOCTYPE html>
<html>
<head>
<script>
function myFunction()
{
alert("Hello World!");
}
</script>
</head>

<body>
<button onclick="myFunction()">点击这里</button>
</body>
</html>
亲自试一试
JavaScript 函数语法
函数就是包裹在花括号中的代码块，前面使用了关键词 function：
function functionname()
{
这里是要执行的代码
}
当调用该函数时，会执行函数内的代码。
可以在某事件发生时直接调用函数（比如当用户点击按钮时），并且可由 JavaScript 在任何位置进行调用。
提示：JavaScript 对大小写敏感。关键词 function 必须是小写的，并且必须以与函数名称相同的大小写来调用函数。
调用带参数的函数
在调用函数时，您可以向其传递值，这些值被称为参数。
这些参数可以在函数中使用。
您可以发送任意多的参数，由逗号 (,) 分隔：
myFunction(argument1,argument2)
当您声明函数时，请把参数作为变量来声明：
function myFunction(var1,var2)
{
这里是要执行的代码
}
变量和参数必须以一致的顺序出现。第一个变量就是第一个被传递的参数的给定的值，以此类推。
实例
<button onclick="myFunction('Bill Gates','CEO')">点击这里</button>

<script>
function myFunction(name,job)
{
alert("Welcome " + name + ", the " + job);
}
</script>
亲自试一试
上面的函数会当按钮被点击时提示 "Welcome Bill Gates, the CEO"。
函数很灵活，您可以使用不同的参数来调用该函数，这样就会给出不同的消息：
实例
<button onclick="myFunction('Harry Potter','Wizard')">点击这里</button>
<button onclick="myFunction('Bob','Builder')">点击这里</button>
亲自试一试
根据您点击的不同的按钮，上面的例子会提示 "Welcome Harry Potter, the Wizard" 或 "Welcome Bob, the Builder"。
带有返回值的函数
有时，我们会希望函数将值返回调用它的地方。
通过使用 return 语句就可以实现。
在使用 return 语句时，函数会停止执行，并返回指定的值。
语法
function myFunction()
{
var x=5;
return x;
}
上面的函数会返回值 5。
注释：整个 JavaScript 并不会停止执行，仅仅是函数。JavaScript 将继续执行代码，从调用函数的地方。
函数调用将被返回值取代：
var myVar=myFunction();
myVar 变量的值是 5，也就是函数 "myFunction()" 所返回的值。
即使不把它保存为变量，您也可以使用返回值：
document.getElementById("demo").innerHTML=myFunction();
"demo" 元素的 innerHTML 将成为 5，也就是函数 "myFunction()" 所返回的值。
您可以使返回值基于传递到函数中的参数：
实例
计算两个数字的乘积，并返回结果：
function myFunction(a,b)
{
return a*b;
}

document.getElementById("demo").innerHTML=myFunction(4,3);
"demo" 元素的 innerHTML 将是：
12
亲自试一试
在您仅仅希望退出函数时 ，也可使用 return 语句。返回值是可选的：
function myFunction(a,b)
{
if (a>b)
  {
  return;
  }
x=a+b
}
如果 a 大于 b，则上面的代码将退出函数，并不会计算 a 和 b 的总和。
局部 JavaScript 变量
在 JavaScript 函数内部声明的变量（使用 var）是局部变量，所以只能在函数内部访问它。（该变量的作用域是局部的）。
您可以在不同的函数中使用名称相同的局部变量，因为只有声明过该变量的函数才能识别出该变量。
只要函数运行完毕，本地变量就会被删除。
全局 JavaScript 变量
在函数外声明的变量是全局变量，网页上的所有脚本和函数都能访问它。
JavaScript 变量的生存期
JavaScript 变量的生命期从它们被声明的时间开始。
局部变量会在函数运行以后被删除。
全局变量会在页面关闭后被删除。
向未声明的 JavaScript 变量来分配值
如果您把值赋给尚未声明的变量，该变量将被自动作为全局变量声明。
这条语句：
carname="Volvo";
将声明一个全局变量 carname，即使它在函数内执行。■◆0■如果■若（）{}否{}■用于基于不同的条件来执行不同的动作

条件语句用于基于不同的条件来执行不同的动作。
条件语句
通常在写代码时，您总是需要为不同的决定来执行不同的动作。您可以在代码中使用条件语句来完成该任务。
在 JavaScript 中，我们可使用以下条件语句：
if 语句 - 只有当指定条件为 true 时，使用该语句来执行代码
if...else 语句 - 当条件为 true 时执行代码，当条件为 false 时执行其他代码
if...else if....else 语句 - 使用该语句来选择多个代码块之一来执行
switch 语句 - 使用该语句来选择多个代码块之一来执行
If 语句
只有当指定条件为 true 时，该语句才会执行代码。
语法
if (条件)
  {
  只有当条件为 true 时执行的代码
  }
注意：请使用小写的 if。使用大写字母（IF）会生成 JavaScript 错误！
实例
当时间小于 20:00 时，生成一个“Good day”问候：
if (time<20)
  {
  x="Good day";
  }
x 的结果是：
Good day
亲自试一试
请注意，在这个语法中，没有 ..else..。您已经告诉浏览器只有在指定条件为 true 时才执行代码。
If...else 语句
请使用 if....else 语句在条件为 true 时执行代码，在条件为 false 时执行其他代码。
语法
if (条件)
  {
  当条件为 true 时执行的代码
  }
else
  {
  当条件不为 true 时执行的代码
  }
实例
当时间小于 20:00 时，将得到问候 "Good day"，否则将得到问候 "Good evening"。
if (time<20)
  {
  x="Good day";
  }
else
  {
  x="Good evening";
  }
x 的结果是：
Good day
亲自试一试
If...else if...else 语句
使用 if....else if...else 语句来选择多个代码块之一来执行。
语法
if (条件 1)
  {
  当条件 1 为 true 时执行的代码
  }
else if (条件 2)
  {
  当条件 2 为 true 时执行的代码
  }
else
  {
  当条件 1 和 条件 2 都不为 true 时执行的代码
  }
实例
如果时间小于 10:00，则将发送问候 "Good morning"，否则如果时间小于 20:00，则发送问候 "Good day"，否则发送问候 "Good evening"：
if (time<10)
  {
  x="Good morning";
  }
else if (time<20)
  {
  x="Good day";
  }
else
  {
  x="Good evening";
  }
x 的结果是：
Good day
亲自试一试
更多实例
随机的链接
本例将输出 W3School 或微软公司的链接。通过使用随机数，每个链接被输出的机会为 50%。■◆0■如果真■若（）{}■用于基于不同的条件来执行不同的动作■◆0■判断■判断（）{}■用于基于不同的条件来执行不同的动作。■◆0■计次循环■计次（）{}■循环可以将代码块执行指定的次数。■◆0■条件循环■循（）环{}■只要指定条件为真，循环就可以一直执行代码■◆0■条件环循■环｛｝循（）■环循是循环的变体。会执行一次代码块，在检查条件是否为真之前，然后如果条件为真的话，就会重复这个循环。■◆-1■Javascript自有对象■■■◆8■数组■数组■数组对象
数组对象用于在单个的变量中存储多个值。
创建数组对象的语法：
新数组();
新数组(size);
新数组(element0, element1, ..., elementn);
参数
参数 size 是期望的数组元素个数。返回的数组，元素数目 字段将被设为 size 的值。
参数 element ..., elementn 是参数列表。当使用这些参数来调用构造函数 数组() 时，新创建的数组的元素就会被初始化为这些值。它的 元素数目 字段也会被设置为参数的个数。
返回值
返回新创建并被初始化了的数组。
如果调用构造函数 数组() 时没有使用参数，那么返回的数组为空，元素数目 字段为 0。
当调用构造函数时只传递给它一个数字参数，该构造函数将返回具有指定个数、元素为 undefined 的数组。
当其他参数调用数组() 时，该构造函数将用参数指定的值初始化数组。
当把构造函数作为函数调用，不使用 新 运算符时，它的行为与使用 新 运算符调用它时的行为完全一样。■◆9■构造函数              简化命令：．构造函数■．构造函数■返回对创建此对象的数组函数的引用。

定义和用法
constructor 属性返回对创建此对象的数组函数的引用。
语法
object.constructor
实例
例子 1
在本例中，我们将展示如何使用 constructor 属性：
<script type="text/javascript">

var test=new Array();

if (test.constructor==Array)
{
document.write("This is an Array");
}
if (test.constructor==Boolean)
{
document.write("This is a Boolean");
}
if (test.constructor==Date)
{
document.write("This is a Date");
}
if (test.constructor==String)
{
document.write("This is a String");
}

</script>
输出：
This is an Array
TIY
例子 2
在本例中，我们将展示如何使用 constructor 属性：
<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

document.write(bill.constructor);

</script>
输出：
function employee(name, jobtitle, born)
{this.name = name; this.jobtitle = job; this.born = born;}
TIY
TIY
constructor
在本例中，我们将展示如何使用 constructor 属性。■◆9■元素数目              简化命令：．元素数目■．元素数目■设置或返回数组中元素的数目。

定义和用法
length 属性可设置或返回数组中元素的数目。
语法
arrayObject.length
说明
数组的 length 属性总是比数组中定义的最后一个元素的下标大 1。对于那些具有连续元素，而且以元素 0 开始的常规数组而言，属性 length 声明了数组中的元素的个数。
数组的 length 属性在用构造函数 Array() 创建数组时被初始化。给数组添加新元素时，如果必要，将更新 length 的值。
设置 length 属性可改变数组的大小。如果设置的值比其当前值小，数组将被截断，其尾部的元素将丢失。如果设置的值比它的当前值大，数组将增大，新的元素被添加到数组的尾部，它们的值为 undefined。
实例
在本例中，我们将展示如何使用 length 属性返回并设置数组的长度：
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "John"
arr[1] = "Andy"
arr[2] = "Wendy"

document.write("Original length: " + arr.length)
document.write("<br />")

arr.length=5
document.write("New length: " + arr.length)

</script>
输出：
Original length: 3
New length: 5
TIY
length
在本例中，我们将展示如何使用 length 属性。■◆9■添加                  简化命令：．添加■．添加■使您有能力向对象添加属性和方法。

定义和用法
prototype 属性使您有能力向对象添加属性和方法。
语法
object.prototype.name=value
实例
在本例中，我们将展示如何使用 prototype 属性来向对象添加属性：
<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

employee.prototype.salary=null;
bill.salary=20000;

document.write(bill.salary);

</script>
输出：
20000
TIY
TIY
prototype
在本例中，我们将展示如何使用 prototype 属性。■◆9■连接（）              简化命令：．连接■．连接■连接两个或更多的数组，并返回结果。

定义和用法
concat() 方法用于连接两个或多个数组。
该方法不会改变现有的数组，而仅仅会返回被连接数组的一个副本。
语法
arrayObject.concat(arrayX,arrayX,......,arrayX)
参数	描述
arrayX	必需。该参数可以是具体的值，也可以是数组对象。可以是任意多个。
返回值
返回一个新的数组。该数组是通过把所有 arrayX 参数添加到 arrayObject 中生成的。如果要进行 concat() 操作的参数是数组，那么添加的是数组中的元素，而不是数组。
实例
例子 1
在本例中，我们将把 concat() 中的参数连接到数组 a 中：
<script type="text/javascript">

var a = [1,2,3];
document.write(a.concat(4,5));

</script>
输出：
1,2,3,4,5
例子 2
在本例中，我们创建了两个数组，然后使用 concat() 把它们连接起来：
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"

document.write(arr.concat(arr2))

</script>
输出：
George,John,Thomas,James,Adrew,Martin
例子 3
在本例中，我们创建了三个数组，然后使用 concat() 把它们连接起来：
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

var arr2 = new Array(3)
arr2[0] = "James"
arr2[1] = "Adrew"
arr2[2] = "Martin"

var arr3 = new Array(2)
arr3[0] = "William"
arr3[1] = "Franklin"

document.write(arr.concat(arr2,arr3))

</script>
输出：
George,John,Thomas,James,Adrew,Martin,William,Franklin
TIY
如何使用 concat() 连接数组中的值
如何使用 concat() 连接两个数组
如何使用 concat() 连接三个数组■◆9■数组元素合成字符串()  简化命令：．变串■．变串■把数组的所有元素放入一个字符串。元素通过指定的分隔符进行分隔。
定义和用法
加入() 方法用于把数组中的所有元素放入一个字符串。
元素是通过指定的分隔符进行分隔的。
语法
数组.加入(分隔符)
参数	描述
分隔符	可选。指定要使用的分隔符。如果省略该参数，则使用逗号作为分隔符。
返回值
返回一个字符串。该字符串是通过把 数组对象 的每个元素转换为字符串，然后把这些字符串连接起来，在两个元素之间插入 分隔符 字符串而生成的。■◆9■切单（）              简化命令：．切单■．切单■删除并返回数组的最后一个元素


定义和用法
pop() 方法用于删除并返回数组的最后一个元素。
语法
arrayObject.pop()
返回值
arrayObject 的最后一个元素。
说明
pop() 方法将删除 arrayObject 的最后一个元素，把数组长度减 1，并且返回它删除的元素的值。如果数组已经为空，则 pop() 不改变数组，并返回 undefined 值。
实例
在本例中，我们将创建一个数组，然后删除数组的最后一个元素。请注意，这也会改变数组的程度：
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr)

document.write("<br />")

document.write(arr.pop())

document.write("<br />")

document.write(arr)

</script>
输出：
George,John,Thomas
Thomas
George,John
TIY
pop()
如何使用 pop() 来删除并返回数组的最后一个元素。■◆9■末尾加新元素（）      简化命令：．加单■．加单■向数组的末尾添加一个或更多元素，并返回新的长度。


定义和用法
push() 方法可向数组的末尾添加一个或多个元素，并返回新的长度。
语法
arrayObject.push(newelement1,newelement2,....,newelementX)
参数	描述
newelement1	必需。要添加到数组的第一个元素。
newelement2	可选。要添加到数组的第二个元素。
newelementX	可选。可添加多个元素。
返回值
把指定的值添加到数组后的新长度。
说明
push() 方法可把它的参数顺序添加到 arrayObject 的尾部。它直接修改 arrayObject，而不是创建一个新的数组。push() 方法和 pop() 方法使用数组提供的先进后出栈的功能。
提示和注释
注释：该方法会改变数组的长度。
提示：要想数组的开头添加一个或多个元素，请使用 unshift() 方法。
实例
在本例中，我们将创建一个数组，并通过添加一个元素来改变其长度：
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.push("James") + "<br />")
document.write(arr)

</script>
输出：
George,John,Thomas
4
George,John,Thomas,James
TIY
push()
如何使用 push() 来改变数组的长度。■◆9■颠倒元素顺序（）      简化命令：．倒顺■．倒顺■颠倒数组中元素的顺序。


定义和用法
reverse() 方法用于颠倒数组中元素的顺序。
语法
arrayObject.reverse()
提示和注释
注释：该方法会改变原来的数组，而不会创建新的数组。
实例
在本例中，我们将创建一个数组，然后颠倒其元素的顺序：
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.reverse())

</script>
输出：
George,John,Thomas
Thomas,John,George
TIY
reverse()
如何使用 reverse() 颠倒数组中元素的顺序。■◆9■删除并返回第一元素()  简化命令：．单切■．单切■删除并返回数组的第一个元素


定义和用法
shift() 方法用于把数组的第一个元素从其中删除，并返回第一个元素的值。
语法
arrayObject.shift()
返回值
数组原来的第一个元素的值。
说明
如果数组是空的，那么 shift() 方法将不进行任何操作，返回 undefined 值。请注意，该方法不创建新数组，而是直接修改原有的 arrayObject。
提示和注释
注释：该方法会改变数组的长度。
提示：要删除并返回数组的最后一个元素，请使用 pop() 方法。
实例
在本例中，我们将创建一个数组，并删除数组的第一个元素。请注意，这也将改变数组的长度：
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.shift() + "<br />")
document.write(arr)

</script>
输出：
George,John,Thomas
George
John,Thomas
TIY
shift()
如何使用 shift() 删除并返回数组的第一个元素。■◆9■返回选定的元素()      简化命令：．选区■．选区■从某个已有的数组返回选定的元素


定义和用法
slice() 方法可从已有的数组中返回选定的元素。
语法
arrayObject.slice(start,end)
参数	描述
start	必需。规定从何处开始选取。如果是负数，那么它规定从数组尾部开始算起的位置。也就是说，-1 指最后一个元素，-2 指倒数第二个元素，以此类推。
end	可选。规定从何处结束选取。该参数是数组片断结束处的数组下标。如果没有指定该参数，那么切分的数组包含从 start 到数组结束的所有元素。如果这个参数是负数，那么它规定的是从数组尾部开始算起的元素。
返回值
返回一个新的数组，包含从 start 到 end （不包括该元素）的 arrayObject 中的元素。
说明
请注意，该方法并不会修改数组，而是返回一个子数组。如果想删除数组中的一段元素，应该使用方法 Array.splice()。
提示和注释
注释：您可使用负值从数组的尾部选取元素。
注释：如果 end 未被规定，那么 slice() 方法会选取从 start 到数组结尾的所有元素。
实例
例子 1
在本例中，我们将创建一个新数组，然后显示从其中选取的元素：
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.slice(1) + "<br />")
document.write(arr)

</script>
输出：
George,John,Thomas
John,Thomas
George,John,Thomas
例子 2
在本例中，我们将创建一个新数组，然后显示从其中选取的元素：
<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
document.write(arr.slice(2,4) + "<br />")
document.write(arr)

</script>
输出：
George,John,Thomas,James,Adrew,Martin
Thomas,James
George,John,Thomas,James,Adrew,Martin■◆9■数组元素排序()        简化命令：．排序■．排序■对数组的元素进行排序


定义和用法
sort() 方法用于对数组的元素进行排序。
语法
arrayObject.sort(sortby)
参数	描述
sortby	可选。规定排序顺序。必须是函数。
返回值
对数组的引用。请注意，数组在原数组上进行排序，不生成副本。
说明
如果调用该方法时没有使用参数，将按字母顺序对数组中的元素进行排序，说得更精确点，是按照字符编码的顺序进行排序。要实现这一点，首先应把数组的元素都转换成字符串（如有必要），以便进行比较。
如果想按照其他标准进行排序，就需要提供比较函数，该函数要比较两个值，然后返回一个用于说明这两个值的相对顺序的数字。比较函数应该具有两个参数 a 和 b，其返回值如下：
若 a 小于 b，在排序后的数组中 a 应该出现在 b 之前，则返回一个小于 0 的值。
若 a 等于 b，则返回 0。
若 a 大于 b，则返回一个大于 0 的值。
实例
例子 1
在本例中，我们将创建一个数组，并按字母顺序进行排序：
<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
document.write(arr.sort())

</script>
输出：
George,John,Thomas,James,Adrew,Martin
Adrew,George,James,John,Martin,Thomas
亲自试一试
例子 2
在本例中，我们将创建一个数组，并按字母顺序进行排序：
<script type="text/javascript">

var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")
document.write(arr.sort())

</script>
输出：
10,5,40,25,1000,1
1,10,1000,25,40,5
请注意，上面的代码没有按照数值的大小对数字进行排序，要实现这一点，就必须使用一个排序函数：
<script type="text/javascript">

function sortNumber(a,b)
{
return a - b
}

var arr = new Array(6)
arr[0] = "10"
arr[1] = "5"
arr[2] = "40"
arr[3] = "25"
arr[4] = "1000"
arr[5] = "1"

document.write(arr + "<br />")
document.write(arr.sort(sortNumber))

</script>
输出：
10,5,40,25,1000,1
1,5,10,25,40,1000
亲自试一试■◆9■删除并添加新元素()    简化命令：．替换■．替换■删除元素，并向数组添加新元素。


定义和用法
splice() 方法向/从数组中添加/删除项目，然后返回被删除的项目。
注释：该方法会改变原始数组。
语法
arrayObject.splice(index,howmany,item1,.....,itemX)
参数	描述
index	必需。整数，规定添加/删除项目的位置，使用负数可从数组结尾处规定位置。
howmany	必需。要删除的项目数量。如果设置为 0，则不会删除项目。
item1, ..., itemX	可选。向数组添加的新项目。
返回值
类型	描述
Array	包含被删除项目的新数组，如果有的话。
说明
splice() 方法可删除从 index 处开始的零个或多个元素，并且用参数列表中声明的一个或多个值来替换那些被删除的元素。
如果从 arrayObject 中删除了元素，则返回的是含有被删除的元素的数组。
技术细节
JavaScript 版本：	1.2
浏览器支持
所有主流浏览器都支持 splice() 方法。
提示和注释
注释：请注意，splice() 方法与 slice() 方法的作用是不同的，splice() 方法会直接对数组进行修改。
实例
例子 1
在本例中，我们将创建一个新数组，并向其添加一个元素：
<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
arr.splice(2,0,"William")
document.write(arr + "<br />")

</script>
输出：
George,John,Thomas,James,Adrew,Martin
George,John,William,Thomas,James,Adrew,Martin
例子 2
在本例中我们将删除位于 index 2 的元素，并添加一个新元素来替代被删除的元素：
<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
arr.splice(2,1,"William")
document.write(arr)

</script>
输出：
George,John,Thomas,James,Adrew,Martin
George,John,William,James,Adrew,Martin
例子 3
在本例中我们将删除从 index 2 ("Thomas") 开始的三个元素，并添加一个新元素 ("William") 来替代被删除的元素：
<script type="text/javascript">

var arr = new Array(6)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"
arr[3] = "James"
arr[4] = "Adrew"
arr[5] = "Martin"

document.write(arr + "<br />")
arr.splice(2,3,"William")
document.write(arr)

</script>
输出：
George,John,Thomas,James,Adrew,Martin
George,John,William,Martin
TIY
splice()
如何使用 splice() 来更改数组。■◆9■返回源码()            简化命令：．返回源码■．返回源码■返回该对象的源代码。


定义和用法
toSource() 方法表示对象的源代码。
该原始值由 Array 对象派生的所有对象继承。
toSource() 方法通常由 JavaScript 在后台自动调用，并不显式地出现在代码中。
语法
object.toSource()
浏览器支持
只有 Gecko 核心的浏览器（比如 Firefox）支持该方法，也就是说 IE、Safari、Chrome、Opera 等浏览器均不支持该方法。
实例
下面的例子向您展示 toSource() 方法的用法：
<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

document.write(bill.toSource());

</script>
输出：
({name:"Bill Gates", job:"Engineer", born:1985}) 
TIY
JavaScript Array 对象参考手册■◆9■数组转换为字符串()    简化命令：．取串■．取串■把数组转换为字符串，并返回结果。


定义和用法
toString() 方法可把数组转换为字符串，并返回结果。
语法
arrayObject.toString()
返回值
arrayObject 的字符串表示。返回值与没有参数的 join() 方法返回的字符串相同。
说明
当数组用于字符串环境时，JavaScript 会调用这一方法将数组自动转换成字符串。但是在某些情况下，需要显式地调用该方法。
提示和注释
注释：数组中的元素之间用逗号分隔。
实例
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr.toString())

</script>
输出：
George,John,Thomas
TIY
toString()
如何使用 toString() 来更改数组。
JavaScript Array 对象参考手册■◆9■因计算机而异的取串()  简化命令：．本地取串■．本地取串■把数组转换为本地数组，并返回结果。


定义和用法
把数组转换为本地字符串。
语法
arrayObject.toLocaleString()
返回值
arrayObject 的本地字符串表示。
说明
首先调用每个数组元素的 toLocaleString() 方法，然后使用地区特定的分隔符把生成的字符串连接起来，形成一个字符串。
实例
<script type="text/javascript">

var arr = new Array(3)
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr.toLocaleString())

</script>
输出：
George, John, Thomas
TIY
toLocaleString()
如何使用 toLocaleString() 来更改数组。
JavaScript Array 对象参考手册■◆9■数组开头添加元素()    简化命令：．头加■．头加■向数组的开头添加一个或更多元素，并返回新的长度。


定义和用法
unshift() 方法可向数组的开头添加一个或更多元素，并返回新的长度。
语法
arrayObject.unshift(newelement1,newelement2,....,newelementX)
参数	描述
newelement1	必需。向数组添加的第一个元素。
newelement2	可选。向数组添加的第二个元素。
newelementX	可选。可添加若干个元素。
返回值
arrayObject 的新长度。
说明
unshift() 方法将把它的参数插入 arrayObject 的头部，并将已经存在的元素顺次地移到较高的下标处，以便留出空间。该方法的第一个参数将成为数组的新元素 0，如果还有第二个参数，它将成为新的元素 1，以此类推。
请注意，unshift() 方法不创建新的创建，而是直接修改原有的数组。
提示和注释
注释：该方法会改变数组的长度。
注释：unshift() 方法无法在 Internet Explorer 中正确地工作！
提示：要把一个或多个元素添加到数组的尾部，请使用 push() 方法。
实例
在本例中，我们将创建一个数组，并把一个元素添加到数组的开头，并返回数组的新长度：
<script type="text/javascript">

var arr = new Array()
arr[0] = "George"
arr[1] = "John"
arr[2] = "Thomas"

document.write(arr + "<br />")
document.write(arr.unshift("William") + "<br />")
document.write(arr)

</script>
输出：
George,John,Thomas
4
William,George,John,Thomas
TIY
unshift()
如何使用 unshift() 把一个元素添加到数组的开头，并返回数组的新长度。
JavaScript Array 对象参考手册■◆9■返回数组原始值()      简化命令：．取原值■．取原值■返回数组对象的原始值


定义和用法
valueOf() 方法返回 Array 对象的原始值。
该原始值由 Array 对象派生的所有对象继承。
valueOf() 方法通常由 JavaScript 在后台自动调用，并不显式地出现在代码中。
语法
arrayObject.valueOf()
JavaScript Array 对象参考手册■◆8■布尔■布尔■Boolean 对象
Boolean 对象表示两个值："true" 或 "false"。
创建 Boolean 对象的语法：
new Boolean(value);	//构造函数
Boolean(value);		//转换函数
参数
参数 value 由布尔对象存放的值或者要转换成布尔值的值。
返回值
当作为一个构造函数（带有运算符 new）调用时，Boolean() 将把它的参数转换成一个布尔值，并且返回一个包含该值的 Boolean 对象。
如果作为一个函数（不带有运算符 new）调用时，Boolean() 只将把它的参数转换成一个原始的布尔值，并且返回这个值。
注释：如果省略 value 参数，或者设置为 0、-0、null、""、false、undefined 或 NaN，则该对象设置为 false。否则设置为 true（即使 value 参数是字符串 "false"）。■◆27■构造函数                  简化命令：．构造函数■．构造函数■返回对创建此对象的 Boolean 函数的引用



定义和用法
constructor 属性返回对创建此对象的 Boolean 函数的引用。
语法
object.constructor
实例
在本例中，我们将展示如何使用 constructor 属性：
<script type="text/javascript">

var test=new Boolean();

if (test.constructor==Array)
{
document.write("This is an Array");
}
if (test.constructor==Boolean)
{
document.write("This is a Boolean");
}
if (test.constructor==Date)
{
document.write("This is a Date");
}
if (test.constructor==String)
{
document.write("This is a String");
}

</script>
输出：
This is a Boolean
TIY
TIY
constructor
在本例中，我们将展示如何使用 constructor 属性。
JavaScript Boolean 对象参考手册■◆27■添加                      简化命令：．添加■．添加■使您有能力向对象添加属性和方法。





定义和用法
prototype 属性使您有能力向对象添加属性和方法。
语法
object.prototype.name=value
实例
在本例中，我们将展示如何使用 prototype 属性来向对象添加属性：
<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

employee.prototype.salary=null;
bill.salary=20000;

document.write(bill.salary);

</script>
输出：
20000
TIY
TIY
prototype
在本例中，我们将展示如何使用 prototype 属性。■◆27■返回源码()                简化命令：．返回源码■．返回源码■返回该对象的源代码。


定义和用法
toSource() 方法表示对象的源代码。
该原始值由 Array 对象派生的所有对象继承。
toSource() 方法通常由 JavaScript 在后台自动调用，并不显式地出现在代码中。
语法
object.toSource()
浏览器支持
只有 Gecko 核心的浏览器（比如 Firefox）支持该方法，也就是说 IE、Safari、Chrome、Opera 等浏览器均不支持该方法。
实例
下面的例子向您展示 toSource() 方法的用法：
<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

document.write(bill.toSource());

</script>
输出：
({name:"Bill Gates", job:"Engineer", born:1985}) 
TIY
JavaScript Array 对象参考手册■◆27■逻辑值转换为字符串()      简化命令：．取串■．取串■把逻辑值转换为字符串，并返回结果。


定义和用法
toString() 方法可把一个逻辑值转换为字符串，并返回结果。
语法
booleanObject.toString()
返回值
根据原始布尔值或者 booleanObject 对象的值返回字符串 "true" 或 "false"。
抛出
如果调用该方法的对象不是 Boolean，则抛出异常 TypeError。
提示和注释
注释：在 Boolean 对象被用于字符串环境中时，此方法会被自动调用。
实例
在本例中，我们将创建一个 Boolean 对象，并把它转换成字符串：
<script type="text/javascript">
 
 var boo = new Boolean(true)
document.write(boo.toString())

</script>
输出：
true
TIY
toString()
如何使用 toString() 来把一个布尔值转换成字符串。
JavaScript Boolean 对象参考手册
课外书
如需更多有关类型转换的知识，请阅读 JavaScript 高级教程中的相关内容：
ECMAScript 类型转换
本节讲解了 ECMAScript 提供的类型转换方法，以及如何进行强制类型转换。■◆27■返回布尔对象原始值()      简化命令：．取原值■．取原值■返回 Boolean 对象的原始值。



定义和用法
valueOf() 方法可返回 Boolean 对象的原始值。
语法
booleanObject.valueOf()
返回值
booleanObject 的原始布尔值。
抛出
如果调用该方法的对象不是 Boolean，则抛出异常 TypeError。
实例
在本例中，我们将创建一个 Boolean 对象，并使用 valueOf() 来取得此对象的原始值：
<script type="text/javascript">

var boo = new Boolean(false)
document.write(boo.valueOf())

</script>
输出：
false
TIY
valueOf()
如何使用 valueOf() 来取得一个 Boolean 对象的原始值。
JavaScript Boolean 对象参考手册■◆8■日期时间■日期时间■Date 对象
Date 对象用于处理日期和时间。
创建 Date 对象的语法：
var myDate=new Date()
注释：Date 对象会自动把当前日期和时间保存为其初始值。■◆33■构造函数                 简化命令：构造函数■构造函数■定义和用法
constructor 属性返回对创建此对象的 Date 函数的引用。
语法
object.constructor
实例
在本例中，我们将展示如何使用 constructor 属性：
<script type="text/javascript">

var test=new Date();

if (test.constructor==Array)
{
document.write("This is an Array");
}
if (test.constructor==Boolean)
{
document.write("This is a Boolean");
}
if (test.constructor==Date)
{
document.write("This is a Date");
}
if (test.constructor==String)
{
document.write("This is a String");
}

</script>
输出：
This is a Date
TIY
TIY
constructor
在本例中，我们将展示如何使用 constructor 属性。■◆33■添加                     简化命令：．添加■．添加■定义和用法
prototype 属性使您有能力向对象添加属性和方法。
语法
object.prototype.name=value
实例
在本例中，我们将展示如何使用 prototype 属性来向对象添加属性：
<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

employee.prototype.salary=null;
bill.salary=20000;

document.write(bill.salary);

</script>
输出：
20000
TIY
TIY
prototype
在本例中，我们将展示如何使用 prototype 属性。
JavaScript Date 对象参考手册■◆33■返回当日的日期和时间()   简化命令：．当前时间■．当前时间■返回当日的日期和时间。


定义和用法
Date() 方法可返回当天的日期和时间。
语法
Date()
实例
在本例中，我们将输出今天的日期和时间：
<script type="text/javascript">

document.write(Date())

</script>
输出：
Tue Nov 19 2013 11:19:22 GMT+0800 (China Standard Time)
TIY
Date()
如何使用 Date() 来取得当天的日期。
JavaScript Date 对象参考手册■◆33■从Date对象返回某天()     简化命令：．月天■．月天■从 Date 对象返回一个月中的某一天 (1 ~ 31)。



定义和用法
getDate() 方法可返回月份的某一天。
语法
dateObject.getDate()
返回值
dateObject 所指的月份中的某一天，使用本地时间。返回值是 1 ~ 31 之间的一个整数。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将输出当前月份的日期：
<script type="text/javascript">

var d = new Date()
document.write(d.getDate())

</script>
输出：
19
例子 2
在本例中，我们定义了一个带有具体日期的变量，并输出变量中月份的天：
<script type="text/javascript">

var birthday = new Date("July 21, 1983 01:15:00")
document.write(birthday.getDate())

</script>
输出：
21
TIY
getDate()
如何使用 getDate() 来取得当前月份的日期。■◆33■从Date对象返回周的某天() 简化命令：．周天■．周天■从 Date 对象返回一周中的某一天 (0 ~ 6)。



定义和用法
getDay() 方法可返回表示星期的某一天的数字。
语法
dateObject.getDay()
返回值
dateObject 所指的星期中的某一天，使用本地时间。返回值是 0（周日） 到 6（周六） 之间的一个整数。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将以数字取得星期的当前一天：
<script type="text/javascript">

var d=new Date()
document.write(d.getDay())

</script>
输出：
2
例子 2
现在，我们将创建一个数组，这样就可以使上面的例子输出星期的名称，而不是数字：
<script type="text/javascript">

var d=new Date()

var weekday=new Array(7)
weekday[0]="Sunday"
weekday[1]="Monday"
weekday[2]="Tuesday"
weekday[3]="Wednesday"
weekday[4]="Thursday"
weekday[5]="Friday"
weekday[6]="Saturday"

document.write("Today it is " + weekday[d.getDay()])

</script>
输出：
Today it is Tuesday
TIY
getDay()
使用 getDay() 和一个数组来输出星期的名称，而不是数字。
JavaScript Date 对象参考手册■◆33■从Date对象返回月份()     简化命令：．月份■．月份■从 Date 对象返回月份 (0 ~ 11)。


定义和用法
getMonth() 方法可返回表示月份的数字。
语法
dateObject.getMonth()
返回值
dateObject 的月份字段，使用本地时间。返回值是 0（一月） 到 11（十二月） 之间的一个整数。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将取得当前的日期，并把它输出：
<script type="text/javascript">

var d=new Date()

document.write(d.getMonth())

</script>
输出：
10
例子 2
现在，我们将创建一个数组，以输出月份的名称，而不是一个数字：
<script type="text/javascript">

var d=new Date()

var month=new Array(12)
month[0]="January"
month[1]="February"
month[2]="March"
month[3]="April"
month[4]="May"
month[5]="June"
month[6]="July"
month[7]="August"
month[8]="September"
month[9]="October"
month[10]="November"
month[11]="December"

document.write("The month is " + month[d.getMonth()])

</script>
输出：
The month is November
TIY
getMonth()
如何使用 getMonth() 来取得当前月份的名称。
以不同的格式显示当前的日期
如何使用 getDate(), getMonth() 以及 getFullYear() 以不同的格式来显示当前的日期。
JavaScript Date 对象参考手册■◆33■从Date对象取四位数年份() 简化命令：．年份■．年份■从 Date 对象以四位数字返回年份。



定义和用法
getFullYear() 方法可返回一个表示年份的 4 位数字。
语法
dateObject.getFullYear()
返回值
当 dateObject 用本地时间表示时返回的年份。返回值是一个四位数，表示包括世纪值在内的完整年份，而不是两位数的缩写形式。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将取得当前的年份，并输出它：
<script type="text/javascript">

var d = new Date()
document.write(d.getFullYear())

</script>
输出：
2013
例子 2
在本例中，我们将从具体到日期提取年份：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write("I was born in " + born.getFullYear())

</script>
输出：
I was born in 1983
TIY
以不同的格式显示当前的日期
如何使用 getDate(), getMonth() 以及 getFullYear() 以不同的格式来显示当前的日期。
JavaScript Date 对象参考手册■◆33■取Date对象的几点钟()     简化命令：．几点■．几点■返回 Date 对象的小时 (0 ~ 23)。



定义和用法
getHours() 方法可返回时间的小时字段。
语法
dateObject.getHours()
返回值
dateObject 的小时字段，以本地时间显示。返回值是 0 （午夜） 到 23 （晚上 11 点）之间的一个整数。
提示和注释：
注释：由 getHours() 返回的值是一个两位的数字。不过返回值不总是两位的，如果该值小于 10，则仅返回一位数字。
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们可取得当前时间的小时：
<script type="text/javascript">

var d = new Date()
document.write(d.getHours())

</script>
输出：
11
例子 2
在本例中，我们将从具体的日期和时间中提取出小时字段：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.getHours())

</script>
输出：
1
TIY
显示当前时间
如何使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。
显示当前时间（带有一个判断数值是否小于 10 的函数）
如何使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。■◆33■返回Date对象的分钟()     简化命令：．几分■．几分■返回Date对象的分钟


定义和用法
getMinutes() 方法可返回时间的分钟字段。
语法
dateObject.getMinutes()
返回值
dateObject 的分钟字段，以本地时间显示。返回值是 0 ~ 59 之间的一个整数。
提示和注释：
注释：由 getMinutes() 返回的值是一个两位的数字。不过返回值不总是两位的，如果该值小于 10，则仅返回一位数字。
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们可取得当前时间的分钟：
<script type="text/javascript">

var d = new Date()
document.write(d.getMinutes())

</script>
输出：
36
例子 2
在本例中，我们将从具体的日期和时间中提取出分钟字段：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.getMinutes())

</script>
输出：
15
TIY
显示当前时间
如何使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。
显示当前时间（带有一个判断数值是否小于 10 的函数）
如何使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。■◆33■取Date对象的秒数()       简化命令：．几秒■．几秒■返回 Date 对象的秒数 (0 ~ 59)。



定义和用法
getSeconds() 方法可返回时间的秒。
语法
dateObject.getSeconds()
返回值
dateObject 的分钟字段，以本地时间显示。返回值是 0 ~ 59 之间的一个整数。
提示和注释：
注释：由 getSeconds() 返回的值是一个两位的数字。不过返回值不总是两位的，如果该值小于 10，则仅返回一位数字。
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们可取得当前时间的秒：
<script type="text/javascript">

var d = new Date()
document.write(d.getSeconds())

</script>
输出：
14
例子 2
在本例中，我们将从具体的日期和时间中提取出秒字段：
<script type="text/javascript">

var Birthday = new Date("July 21, 1983 01:15:00")
document.write(Birthday.getSeconds())

</script>
输出：
0
TIY
显示当前时间
如何使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。
显示当前时间（带有一个判断数值是否小于 10 的函数）
如何使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。■◆33■返回Date对象的毫秒()     简化命令：．毫秒■．毫秒■返回 Date 对象的毫秒。


定义和用法
getMilliseconds() 方法可返回时间的毫秒。
语法
dateObject.getMilliseconds()
返回值
dateObject 的毫秒字段，以本地时间显示。返回值是 0 ~ 999 之间的一个整数。
提示和注释：
注释：由 getMilliseconds() 返回的值是一个三位的数字。不过返回值不总是三位的，如果该值小于 100，则仅返回两位数字，如果该值小于 10，则仅返回一位数字。
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们可取得当前时间的毫秒：
<script type="text/javascript">

var d = new Date()
document.write(d.getMilliseconds())

</script>
输出：
597
例子 2
在本例中，我们将从具体的日期和时间中提取出毫秒字段：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.getMilliseconds())

</script>
输出：
0
TIY
getMilliseconds()
如何使用 getMilliseconds() 来取得当前的毫秒。
显示当前时间
如何使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。
显示当前时间（带有一个判断数值是否小于 10 的函数）
如何使用 getHours(), getMinutes() 以及 getSeconds() 来显示当前的时间。■◆33■取1970/1/1至今毫秒数()   简化命令：．70毫秒■．70毫秒■返回 1970 年 1 月 1 日至今的毫秒数。



定义和用法
getTime() 方法可返回距 1970 年 1 月 1 日之间的毫秒数。
语法
dateObject.getTime()
返回值
dateObject 指定的日期和时间距 1970 年 1 月 1 日午夜（GMT 时间）之间的毫秒数。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将取得从 1970/01/01 至今的毫秒数，并输出它：
<script type="text/javascript">

var d = new Date()
document.write(d.getTime() + " milliseconds since 1970/01/01")

</script>
输出：
1384832446842 milliseconds since 1970/01/01
例子 2
在下面的例子中，我们将计算出从 1970/01/01 至今有多少年：
<script type="text/javascript">

var minutes = 1000*60
var hours = minutes*60
var days = hours*24
var years = days*365
var d = new Date()
var t = d.getTime()
var y = t/years
document.write("It's been: " + y + " years since 1970/01/01!")

</script>
输出：
It's been: 43.91274882172755 years since 1970/01/01!
TIY
getTime()
使用 getTime() 来计算从 1970 至今有多少年。■◆33■本地与格林时间分钟差()   简化命令：．分差■．分差■返回本地时间与格林威治标准时间 (GMT) 的分钟差。


定义和用法
getTimezoneOffset() 方法可返回格林威治时间和本地时间之间的时差，以分钟为单位。
语法
dateObject.getTimezoneOffset()
返回值
本地时间与 GMT 时间之间的时间差，以分钟为单位。
说明
getTimezoneOffset() 方法返回的是本地时间与 GMT 时间或 UTC 时间之间相差的分钟数。实际上，该函数告诉我们运行 JavaScript 代码的时区，以及指定的时间是否是夏令时。
返回之所以以分钟计，而不是以小时计，原因是某些国家所占有的时区甚至不到一个小时的间隔。
提示和注释：
注释：由于使用夏令时的惯例，该方法的返回值不是一个常量。
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在下面的例子中，我们将取得 GMT 时间与本地时间以分钟计的时间差：
<script type="text/javascript">

var d = new Date()
document.write(d.getTimezoneOffset())

</script>
输出：
-480
例子 2
现在，我们将把上面的例子转换为 GMT +/- 小时：
<script type="text/javascript">

var d = new Date()
var gmtHours = d.getTimezoneOffset()/60
document.write("The local time zone is: GMT " + gmtHours)

</script>
输出：
The local time zone is: GMT -8
TIY
getTimezoneOffset()
如何使用 getTimezoneOffset() 根据 GMT 来取得本地时区。
JavaScript Date 对象参考手册■◆33■根据世界取Date对象的天() 简化命令：．世月天■．世月天■根据世界时从 Date 对象返回月中的一天 (1 ~ 31)。


定义和用法
getUTCDate() 方法可根据世界时返回一个月 (UTC) 中的某一天。
语法
dateObject.getUTCDate()
返回值
dateObject 用世界时表示时，返回该月中的某一天 （是 1 ~ 31 中的一个值）。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将根据 UTC 来输出此约的当前一天：
<script type="text/javascript">

var d = new Date()
document.write(d.getUTCDate())

</script>
输出：
20
例子 2
我们在此处定义了一个带有具体日期的变量，然后根据 UTC 输出变量中的月中的那一天：
<script type="text/javascript">

var birthday = new Date("July 21, 1983 01:15:00")
document.write(birthday.getUTCDate())

</script>
输出：
21
TIY
getUTCDate()
如何使用 getUTCDate() 来取得此月的当前一天（根据 UTC）。
以不同的格式来显示 UTC 日期。
如何使用 getUTCDate(), getUTCMonth() 以及 getUTCFullYear() 以不同的格式来显示 UTC 日期。■◆33■根据世界取Date对象周天() 简化命令：．世周天■．世周天■根据世界时从 Date 对象返回周中的一天 


定义和用法
getUTCDay() 方法根据世界时返回表示星期的一天的一个数字。
语法
dateObject.getUTCDay()
返回值
dateObject 用世界时表示时，返回该星期中的某一天 ，该值是 0（星期天） ~ 6（星期六） 中的一个值。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将取得本周的当前 UTC 天（以一个数字）：
<script type="text/javascript">

var d=new Date()
document.write(d.getUTCDay())

</script>
输出：
3
例子 2
现在，我将创建一个数组，使得上面的例子能够输出星期的名称，而不仅仅是一个数字：
<script type="text/javascript">

var d=new Date()

var weekday=new Array(7)
weekday[0]="Sunday"
weekday[1]="Monday"
weekday[2]="Tuesday"
weekday[3]="Wednesday"
weekday[4]="Thursday"
weekday[5]="Friday"
weekday[6]="Saturday"

document.write("Today it is " + weekday[d.getUTCDay()])

</script>
输出：
Today it is Wednesday
TIY
getUTCDay()
使用 getUTCDay() 和一个数组来输出星期的名称，而不是一个数字。■◆33■根据世界Date对象取月份() 简化命令：．世月份■．世月份■根据世界时从 Date 对象返回月份 (0 ~ 11)。



定义和用法
getUTCMonth() 方法可返回一个表示月份的数字（按照世界时 UTC）。
语法
dateObject.getUTCMonth()
返回值
返回 dateObject 用世界时表示时的月份，该值是 0（一月） ~ 11（十二月） 之间中的一个整数。
需要注意的是，Date 对象使用 1 来表示月的第一天，而不是像月份字段那样使用 0 来代表一年的第一个月。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将取得当前月份，然后输出它：
<script type="text/javascript">

var d=new Date()

document.write(d.getUTCMonth())

</script>
输出：
10
例子 2
现在，我们将创建一个数组，使得我们上面的例子能够输出月份的名称，而不仅仅是一个数字：
<script type="text/javascript">

var d=new Date()

var month=new Array(12)
month[0]="January"
month[1]="February"
month[2]="March"
month[3]="April"
month[4]="May"
month[5]="June"
month[6]="July"
month[7]="August"
month[8]="September"
month[9]="October"
month[10]="November"
month[11]="December"

document.write("The month is " + month[d.getUTCMonth()])

</script>
输出：
The month is November
TIY
getUTCMonth()
使用 getUTCMonth() 和一个数组来输出月份的名称，而不是一个数字。
以不同的格式显示 UTC 日期
如何使用 getUTCDate(), getUTCMonth() 以及 getUTCFullYear() 来使用不同的格式显示 UTC 日期。■◆33■同上取四位数年份()       简化命令：．世年份■．世年份■根据世界时从 Date 对象返回四位数的年份。


定义和用法
getUTCFullYear() 方法可返回根据世界时 (UTC) 表示的年份的四位数字。
语法
dateObject.getUTCFullYear()
返回值
返回 dateObject 用世界时表示时的年份，该值是一个四位的整数，而不是两位数的缩写。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
In this example we get the current year and print it:
<script type="text/javascript">

var d = new Date()
document.write(d.getUTCFullYear())

</script>
输出：
2013
例子 2
Here we will extract the year out of the specific date:
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write("I was born in " + born.getUTCFullYear())

</script>
输出：
I was born in 1983
TIY
以不同的格式显示 UTC 日期
如何使用 getUTCDate(), getUTCMonth() 以及 getUTCFullYear() 来使用不同的格式显示 UTC 日期。■◆33■同上取几点钟()           简化命令：．世几点■．世几点■根据世界时返回 Date 对象的小时 (0 ~ 23)。



定义和用法
getUTCHours() 方法可根据世界时 (UTC) 返回时间的小时。
语法
dateObject.getUTCHours()
返回值
返回 dateObject 用世界时表示时的小时字段，该值是一个 0（午夜） ~ 23（晚上 11 点） 之间的整数。
提示和注释：
注释：由 getUTCHours() 返回的值是一个两位的数字。不过返回值不总是两位的，如果该值小于 10，则仅返回一位数字。
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将取得当前时间的 UTC 小时：
<script type="text/javascript">

var d = new Date()
document.write(d.getUTCHours())

</script>
输出：
7
例子 2
在这里，我们将从具体的日期和时间中提取 UTC 小时：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.getUTCHours())

</script>
输出：
17
TIY
显示当前的 UTC 时间
如何使用 getUTCHours() 显示当前的 UTC 时间。
显示当前的 UTC 时间（带有一个判断数值是否小于 10 的函数）
如何使用 getUTCHours(), getUTCMinutes() 以及 getUTCSeconds() 来显示当前的 UTC 时间。■◆33■同上取分钟()             简化命令：．世几分■．世几分■根据世界时返回 Date 对象的分钟 (0 ~ 59)。


定义和用法
getUTCMinutes() 方法可根据世界时 (UTC) 返回时间的分钟字段。
语法
dateObject.getUTCMinutes()
返回值
返回 dateObject 用世界时表示时的分钟字段，该值是一个 0 ~ 59 之间的整数。
提示和注释：
注释：由 getUTCMinutes() 返回的值是一个两位的数字。不过返回值不总是两位的，如果该值小于 10，则仅返回一位数字。
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将取得当前时间的 UTC 分钟：
<script type="text/javascript">

var d = new Date()
document.write(d.getUTCMinutes())

</script>
输出：
59
例子 2
在此处，我们将从具体的日期和时间中提取 UTC 分钟：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.getUTCMinutes())

</script>
输出：
15
TIY
显示当前的 UTC 时间
如何使用 getUTCHours() 显示当前的 UTC 时间。
显示当前的 UTC 时间（带有一个判断数值是否小于 10 的函数）
如何使用 getUTCHours(), getUTCMinutes() 以及 getUTCSeconds() 来显示当前的 UTC 时间。■◆33■同上取秒数()             简化命令：．世几秒■．世几秒■根据世界时返回 Date 对象的秒钟 (0 ~ 59)。


定义和用法
getUTCSeconds() 方法可根据世界时返回时间的秒。
语法
dateObject.getUTCSeconds()
返回值
当 dateObject 用世界时表示时，返回它的秒字段，该值是一个 0 ~ 59 之间的整数。
提示和注释：
注释：由 getUTCSeconds() 返回的值是一个两位的数字。不过返回值不总是两位的，如果该值小于 10，则仅返回一位数字。
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将取得当前时间的 UTC 秒：
<script type="text/javascript">

var d = new Date()
document.write(d.getUTCSeconds())

</script>
输出：
45
例子 2
在此处，我们将从具体的日期和时间中提取 UTC 秒：
<script type="text/javascript">

var Birthday = new Date("July 21, 1983 01:15:00")
document.write(Birthday.getUTCSeconds())

</script>
输出：
0
TIY
显示当前的 UTC 时间
如何使用 getUTCHours() 显示当前的 UTC 时间。
显示当前的 UTC 时间（带有一个判断数值是否小于 10 的函数）
如何使用 getUTCHours(), getUTCMinutes() 以及 getUTCSeconds() 来显示当前的 UTC 时间。■◆33■同上取毫秒()             简化命令：．世毫秒■．世毫秒■根据世界时返回 Date 对象的毫秒(0 ~ 999)。


定义和用法
getUTCMilliseconds() 方法可根据世界时 (UTC) 返回时间的毫秒。
语法
dateObject.getUTCMilliseconds()
返回值
当 dateObject 用世界时表示时，返回它的毫秒字段，该值是一个 0 ~ 999 之间的整数。
提示和注释：
注释：由 getUTCMilliseconds() 返回的值是一个三位的数字。不过返回值不总是三位的，如果该值小于 100，则仅返回两位数字，如果该值小于 10，则仅返回一位数字。
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将取得当前时间的 UTC 毫秒：
<script type="text/javascript">

var d = new Date()
document.write(d.getUTCMilliseconds())

</script>
输出：
850
例子 2
在此处，我们将从具体的日期和时间中提取 UTC 毫秒：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.getUTCMilliseconds())

</script>
输出：
0
注释：上面的代码将把毫秒设置为 1，这是由于在日期中没有定义毫秒。
TIY
getUTCMilliseconds()
如何使用 getUTCMilliseconds() 来取得当前的 UTC 毫秒。
显示当前的 UTC 时间
如何使用 getUTCHours() 显示当前的 UTC 时间。
显示当前的 UTC 时间（带有一个判断数值是否小于 10 的函数）
如何使用 getUTCHours(), getUTCMinutes() 以及 getUTCSeconds() 来显示当前的 UTC 时间。■◆33■取1970/1/1到指定日期()   简化命令：．定期毫秒数■．定期毫秒数■返回1970年1月1日午夜到指定日期（字符串）的毫秒数。


定义和用法
parse() 方法可解析一个日期时间字符串，并返回 1970/1/1 午夜距离该日期时间的毫秒数。
语法
Date.parse(datestring)
参数	描述
datestring	必需。表示日期和时间的字符串。
返回值
指定的日期和时间据 1970/1/1 午夜（GMT 时间）之间的毫秒数。
说明
该方法是 Date 对象的静态方法。一般采用 Date.parse() 的形式来调用，而不是通过 dateobject.parse() 调用该方法。
提示和注释：
注释：Date.parse() 是 Date 对象的静态方法。
实例
例子 1
在本例中，我们将取得从 1970/01/01 到 2005/07/08 的毫秒数：
<script type="text/javascript">

var d = Date.parse("Jul 8, 2005")
document.write(d)

</script>
输出：
1120752000000
例子 2
现在，我们将把上面的例子所输出的结果转换成年：
<script type="text/javascript">

var minutes = 1000 * 60
var hours = minutes * 60
var days = hours * 24
var years = days * 365
var t = Date.parse("Jul 8, 2005")
var y = t/years
document.write("It's been: " + y + " years from 1970/01/01")
document.write(" to 2005/07/08!")

</script>
输出：
It's been: 35.538812785388124 years from 1970/01/01 to 2005/07/08!
TIY
parse()
使用 parse() 来输出从 1970/01/01 到一个具体日期的毫秒数。■◆33■设置Date对象中月某一天() 简化命令：．置月天■．置月天■设置 Date 对象中月的某一天 (1 ~ 31)。


定义和用法
setDate() 方法用于设置一个月的某一天。
语法
dateObject.setDate(day)
参数	描述
day	必需。表示一个月中的一天的一个数值（1 ~ 31）。
返回值
调整过的日期的毫秒表示。在 ECMAScript 标准化之前，该方法什么都不返回。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
在本例中，我们将通过 setDate() 方法把当前月的天设置为 15：
<script type="text/javascript">

var d = new Date()
d.setDate(15)
document.write(d)

</script>
输出：
Fri Nov 15 2013 14:00:33 GMT+0800 (China Standard Time)
TIY
setDate()
如何使用 setDate() 来设置当前月的某一天。■◆33■设置 Date 对象中月份()   简化命令：．置月份■．置月份■设置 Date 对象中月份 (0 ~ 11)。


定义和用法
setMonth() 方法用于设置月份。
语法
dateObject.setMonth(month,day)
参数	描述
month	必需。一个表示月份的数值，该值介于 0（一月） ~ 11（十二月） 之间。
day	
可选。一个表示月的某一天的数值，该值介于 1 ~ 31 之间（以本地时间计）。
在 EMCAScript 标准化之前，不支持该参数。
返回值
调整过的日期的毫秒表示。在 ECMAScript 标准化之前，该方法什么都不返回。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将通过 setMonth() 方法把对象 d 的月字段设置为 0 （一月）：
<script type="text/javascript">

var d=new Date()
d.setMonth(0)
document.write(d)

</script>
输出：
Mon Jan 21 2013 14:01:56 GMT+0800 (China Standard Time)
例子 2
在本例中，我们将通过 setMonth() 方法把对象 d 的月字段设置为 0 （一月），把天字段设置为 20：
<script type="text/javascript">

var d=new Date()
d.setMonth(0,20)
document.write(d)

</script>
输出：
Sun Jan 20 2013 14:01:56 GMT+0800 (China Standard Time)
TIY
setMonth()
如何使用 setMonth() 来设置月份。■◆33■设置Date对象四位数年份() 简化命令：．置年份■．置年份■设置 Date 对象中的年份（四位数字）。


定义和用法
setFullYear() 方法用于设置年份。
语法
dateObject.setFullYear(year,month,day)
参数	描述
year	必需。表示年份的四位整数。用本地时间表示。
month	可选。表示月份的数值，介于 0 ~ 11 之间。用本地时间表示。
day	可选。表示月中某一天的数值，介于 1 ~ 31 之间。用本地时间表示。
返回值
返回调整过的日期的毫秒表示。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将通过 setFullYear() 把年份设置为1992：
<script type="text/javascript">

var d = new Date()
d.setFullYear(1992)
document.write(d)

</script>
输出：
Sat Nov 21 1992 14:03:00 GMT+0800 (China Standard Time)
例子 2
在本例中，我们将通过 setFullYear() 把日期设置为 November 3, 1992：
<script type="text/javascript">

var d = new Date()
d.setFullYear(1992,10,3)
document.write(d)

</script>
输出：
Tue Nov 03 1992 14:03:00 GMT+0800 (China Standard Time)
TIY
setFullYear()
如何使用 setFullYear() 来设置年份。
使用 setFullYear() 来设置具体的日期
如何使用 setFullYear() 来设置具体的日期。■◆33■设置年份老方法已启用()   简化命令：．置年份二■．置年份二■请使用 setFullYear() 方法代替。



定义和用法
setYear() 方法用于设置年份。
语法
dateObject.setYear(year)
参数	描述
year	必需。表示年份的两位或四位数字。
返回值
调整过的日期的毫秒表示。在 ECMAScript 标准化之前，该方法什么都不返回。
提示和注释：
注释：如果 year 参数是两位的数字，比如 setYear(91)，则该方法会理解为 1991。如果要规定 1990 年之前或 1999 年之后的年份，请使用四位数字。
注释：该方法总是结合一个 Date 对象来使用。
重要事项：从 ECMAScript v3 起，JavaScript 实现不再要求使用该函数，而使用 setFullYear() 函数代替它。
实例
在本例中，我们将通过 setYear() 方法把年份设置为 1891：
<script type="text/javascript">

var d = new Date()
d.setYear(1891)
document.write(d)

</script>
输出：
Sat Nov 21 1891 14:04:23 GMT+0800 (China Standard Time)
TIY
setYear()
如何使用 setYear() 来设置年份■◆33■设置Date对象小时()       简化命令：．置几点■．置几点■设置 Date 对象中的小时 (0 ~ 23)。


定义和用法
setHours() 方法用于设置指定的时间的小时字段。
语法
dateObject.setHours(hour,min,sec,millisec)
参数	描述
hour	必需。表示小时的数值，介于 0（午夜） ~ 23（晚上11点） 之间，以本地时间计（下同）。
min	可选。表示分钟的数值，介于 0 ~ 59 之间。在 EMCAScript 标准化之前，不支持该参数。
sec	可选。表示秒的数值，介于 0 ~ 59 之间。在 EMCAScript 标准化之前，不支持该参数。
millisec	可选。表示毫秒的数值，介于 0 ~ 999之间。在 EMCAScript 标准化之前，不支持该参数。
返回值
调整过的日期的毫秒表示。在 ECMAScript 标准化之前，该方法什么都不返回。
提示和注释：
注释：如果上面的参数之一使用一位的数字来规定，那么 JavaScript 会在结果中加一或两个前置 0。
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将通过 setHours() 方法把当前时间的小时字段设置为 15：
<script type="text/javascript">

var d = new Date()
d.setHours(15)
document.write(d)

</script>
输出：
Thu Nov 21 2013 15:08:07 GMT+0800 (China Standard Time)
例子 2
在本例中，我们将通过 setHours() 方法把时间设置为 15:35:01：
<script type="text/javascript">

var d = new Date()
d.setHours(15,35,1)
document.write(d)

</script>
输出：
Thu Nov 21 2013 15:35:01 GMT+0800 (China Standard Time)
TIY
setHours()
如何使用 setHours() 来设置时间。■◆33■设置Date对象中的分钟()   简化命令：．置几分■．置几分■设置 Date 对象中的分钟 (0 ~ 59)。



定义和用法
setMinutes() 方法用于设置指定时间的分钟字段。
语法
dateObject.setMinutes(min,sec,millisec)
参数	描述
min	必需。表示分钟的数值，介于 0 ~ 59 之间，以本地时间计（下同）。
sec	可选。表示秒的数值，介于 0 ~ 59 之间。在 EMCAScript 标准化之前，不支持该参数。
millisec	可选。表示毫秒的数值，介于 0 ~ 999 之间。在 EMCAScript 标准化之前，不支持该参数。
返回值
调整过的日期的毫秒表示。在 ECMAScript 标准化之前，该方法什么都不返回。
提示和注释：
注释：如果上面的参数之一使用一位的数字来规定，那么 JavaScript 会在结果中加一或两个前置 0。
注释：该方法总是结合一个 Date 对象来使用。
实例
在本例中，我们将通过 setMinutes() 方法把当前时间的分钟字段设置为 01：
<script type="text/javascript">

var d = new Date()
d.setMinutes(1)
document.write(d)

</script>
输出：
Thu Nov 21 2013 14:01:52 GMT+0800 (China Standard Time)
TIY
setMinutes()
如何使用 setMinutes() 来设置当前时间的分钟。■◆33■设置 Date 对象中的秒钟() 简化命令：．置几秒■．置几秒■设置 Date 对象中的秒钟 (0 ~ 59)。


定义和用法
The setSeconds() method is used to set the seconds of a specified time.
语法
dateObject.setSeconds(sec,millisec)
参数	描述
sec	必需。表示秒的数值，该值是介于 0 ~ 59 之间的整数。
millisec	可选。表示毫秒的数值，介于 0 ~ 999 之间。在 EMCAScript 标准化之前，不支持该参数。
返回值
调整过的日期的毫秒表示。在 ECMAScript 标准化之前，该方法什么都不返回。
提示和注释：
注释：如果上面的参数之一使用一位的数字来规定，那么 JavaScript 会在结果中加一或两个前置 0。
注释：该方法总是结合一个 Date 对象来使用。
实例
在本例中，我们将通过 setSeconds() 方法把当前时间的秒字段设置为 01：
<script type="text/javascript">

var d = new Date()
d.setSeconds(1)
document.write(d)

</script>
输出：
Thu Nov 21 2013 14:10:01 GMT+0800 (China Standard Time)
TIY
setSeconds()
如何使用 setSeconds() 来设置当前时间的秒。■◆33■设置 Date 对象中的毫秒() 简化命令：．置毫秒■．置毫秒■设置 Date 对象中的毫秒 (0 ~ 999)。


定义和用法
setMilliseconds() 方法用于设置指定时间的毫秒字段。
语法
dateObject.setMilliseconds(millisec)
参数	描述
millisec	必需。用于设置 dateObject 毫秒字段，该参数是介于 0 ~ 999 之间的整数。
返回值
调整过的日期的毫秒表示。
提示和注释：
注释：如果上面的参数之一使用一位的数字来规定，那么 JavaScript 会在结果中加一或两个前置 0。
注释：该方法总是结合一个 Date 对象来使用。
实例
在本例中，我们将通过 setMilliseconds() 方法把当前时间的毫秒字段设置为 001：
<script type="text/javascript">

var d = new Date()
d.setMilliseconds(1)
document.write(d)

</script>
输出：
Thu Nov 21 2013 14:11:44 GMT+0800 (China Standard Time)
TIY
setMilliseconds()
如何使用 setMilliseconds() 来更改当前的毫秒。■◆33■向1970/01/01加若干毫秒() 简化命令：．加毫秒■．加毫秒■以毫秒设置 Date 对象。


定义和用法
setTime() 方法以毫秒设置 Date 对象。
语法
dateObject.setTime(millisec)
参数	描述
millisec	必需。要设置的日期和时间据 GMT 时间 1970 年 1 月 1 日午夜之间的毫秒数。这种类型的毫秒值可以传递给 Date() 构造函数，可以通过调用 Date.UTC() 和 Date.parse() 方法获得该值。以毫秒形式表示日期可以使它独立于时区。
返回值
返回参数 millisec。在 ECMAScript 标准化之前，该方法不返回值。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
实例
例子 1
在本例中，我们将向 1970/01/01 添加 77771564221 毫秒，并显示新的日期和时间：
<script type="text/javascript">

var d = new Date()
d.setTime(77771564221)
document.write(d)

</script>
输出：
Mon Jun 19 1972 11:12:44 GMT+0800 (China Standard Time)
例子 2
在本例中，我们将从 1970/01/01 减去 77771564221 毫秒，并显示新的日期和时间：
<script type="text/javascript">

var d = new Date()
d.setTime(-77771564221)
document.write(d)

</script>
输出：
Sun Jul 16 1967 04:47:15 GMT+0800 (China Standard Time)
TIY
setTime()
使用 setTime() 向 1970/01/01 添加毫秒，并显示新的日期和时间。■◆33■根据世界时设置月份某天() 简化命令：．世置月天■．世置月天■根据世界时设置 Date 对象中月份的一天 (1 ~ 31)。


定义和用法
setUTCDate() 方法用于根据世界时 (UTC) 设置一个月中的某一天。
语法
dateObject.setUTCDate(day)
参数	描述
day	必需。要给 dateObject 设置的一个月中的某一天，用世界时表示。该参数是 1 ~ 31 之间的整数。
返回值
调整过的日期的毫秒表示。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
在本例中，我们将通过 setUTCDate() 方法把当前月的天字段设置为 15：
<script type="text/javascript">

var d = new Date()
d.setUTCDate(15)
document.write(d)

</script>
输出：
Fri Nov 15 2013 14:15:49 GMT+0800 (China Standard Time)
TIY
setUTCDate()
如何使用 setUTCDate() 来设置此月的天。■◆33■根据世界时设置月份()     简化命令：．世置月份■．世置月份■根据世界时设置 Date 对象中的月份 (0 ~ 11)。


定义和用法
setUTCMonth() 方法用于根据世界时 (UTC) 来设置月份。
语法
dateObject.setUTCMonth(month,day)
参数	描述
month	
必需。要给 dateObject 设置的月份字段的值，用世界时表示。
该参数是 0（一月） ~ 11（十二月） 之间的整数。
day	可选。在 1 ~ 31 之间的整数，用作 dateObject 的天字段，用世界时表示。
返回值
调整过的日期的毫秒表示。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将通过 setUTCMonth() 方法把月字段设置为 0 （一月）：
<script type="text/javascript">

var d=new Date()
d.setUTCMonth(0)
document.write(d)

</script>
输出：
Mon Jan 21 2013 14:17:11 GMT+0800 (China Standard Time)
例子 2
在本例中，我们将通过 setUTCMonth() 把月份设置为 0 （一月），把天字段设置为 20：
<script type="text/javascript">

var d=new Date()
d.setUTCMonth(0,20)
document.write(d)

</script>
输出：
Sun Jan 20 2013 14:17:11 GMT+0800 (China Standard Time)
TIY
setUTCMonth()
如何使用 setUTCMonth() 来设置月份。■◆33■根据世界设置四位数年份() 简化命令：．世置年份■．世置年份■根据世界时设置 Date 对象中的年份（四位数字）。


定义和用法
setUTCFullYear() 方法用于根据世界时 (UTC) 设置年份。
语法
dateObject.setUTCFullYear(year,month,day)
参数	描述
year	
必需。要给 dateObject 设置的年份字段的值。
该参数应该是含有世纪值的完整年份，如 1999，而不只是缩写的年份值，比如 99。
month	
可选。要给 dateObject 设置的月份字段的值。使用世界时表示。
该参数是 0 ~ 11 之间的整数。
day	
可选。要给 dateObject 设置的天字段的值。使用世界时表示。
该参数是 1 ~ 31 之间的整数。
返回值
调整过的日期的毫秒表示。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将通过 setUTCFullYear() 方法把年份设置为 1992：
<script type="text/javascript">

var d = new Date()
d.setUTCFullYear(1992)
document.write(d)

</script>
输出：
Sat Nov 21 1992 14:18:33 GMT+0800 (China Standard Time)
例子 2
在本例中，我将通过 setUTCFullYear() 方法把日期设置为 November 3, 1992：
<script type="text/javascript">

var d = new Date()
d.setUTCFullYear(1992,10,3)
document.write(d)

</script>
输出：
Tue Nov 03 1992 14:18:33 GMT+0800 (China Standard Time)
TIY
setUTCFullYear()
如何使用 setUTCFullYear() 来设置年份。■◆33■根据世界时设置小时()     简化命令：．世置几点■．世置几点■根据世界时设置 Date 对象中的小时 (0 ~ 23)。

定义和用法
setUTCHours() 方法用于根据世界时 (UTC) 设置小时（0 - 23）。
语法
dateObject.setUTCHours(hour,min,sec,millisec)
参数	描述
hour	
必需。要给 dateObject 设置的小时字段的值。
该参数是 0 ~ 23 之间的整数。
min	
可选。要给 dateObject 设置的分钟字段的值。
该参数是 0 ~ 59 之间的整数。
sec	
可选。要给 dateObject 设置的秒字段的值。
该参数是 0 ~ 59 之间的整数。
millisec	
可选。要给 dateObject 设置的毫秒字段的值。
该参数是 1 ~ 999 之间的整数。
说明
如果没有规定 min, sec 以及 millisec 参数，则使用从 getUTCMinutes, getUTCSeconds 以及 getUTCMilliseconds 方法返回的值。
如果您规定的参数在指定范围之外，则 setUTCHours 尝试据此来更新 Date 对象中的日期信息。例如，如果 sec 参数的值是 100，则增加 1 分钟 (min + 1)，而秒数为 40。
返回值
调整过的日期的毫秒表示。
提示和注释：
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
例子 1
在本例中，我们将通过 setUTCHours() 方法将 UTC 小时设置为 23：
<script type="text/javascript">

var d = new Date();
d.setUTCHours(23);
document.write(d);

</script>
输出：
Fri Nov 22 2013 07:19:57 GMT+0800 (China Standard Time)
亲自试一试
例子 2
在本例中，我们将通过 setUTCHours() 方法将 UTC 小时设置为 23:15:06 ：
<script type="text/javascript">

var d = new Date();
d.setUTCHours(23,15,6);
document.write(d);

</script>
输出：
Fri Nov 22 2013 07:15:06 GMT+0800 (China Standard Time)
亲自试一试
TIY
setUTCHours()
如何使用 setUTCHours() 来设置小时。■◆33■根据世界时设置分钟()     简化命令：．世置几分■．世置几分■根据世界时设置 Date 对象中的分钟 (0 ~ 59)。


定义和用法
setUTCMinutes() 方法用于根据世界时 (UTC) 来设置指定时间的分钟。
语法
dateObject.setUTCMinutes(min,sec,millisec)
参数	描述
min	
必需。要给 dateObject 设置的分钟字段的值，用世界时表示。
该参数应该是 0 ~ 59 之间的整数。
sec	
可选。要给 dateObject 设置的秒字段的值。使用世界时表示。
该参数是 0 ~ 59 之间的整数。
millisec	
可选。要给 dateObject 设置的毫秒字段的值。使用世界时表示。
该参数是 0 ~ 999 之间的整数。
返回值
调整过的日期的毫秒表示。
提示和注释：
注释：如果上面的参数之一使用一位的数字来规定，那么 JavaScript 会在结果中加一或两个前置 0。
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
在本例中，我们将通过 setUTCMinutes() 方法把当前时间的分钟字段设置为 01：
<script type="text/javascript">

var d = new Date()
d.setUTCMinutes(1)
document.write(d)

</script>
输出：
Thu Nov 21 2013 14:01:15 GMT+0800 (China Standard Time)
TIY
setUTCMinutes()
如何使用 setUTCMinutes() 来设置当前时间的分钟。■◆33■根据世界时设置秒钟()     简化命令：．世置几秒■．世置几秒■根据世界时设置 Date 对象中的秒钟 (0 ~ 59)。


定义和用法
setUTCSeconds() 方法用于根据世界时 (UTC) 设置指定时间的秒。
语法
dateObject.setUTCSeconds(sec,millisec)
参数	描述
sec	
必需。要给 dateObject 设置的秒字段的值。使用世界时表示。
该参数是 0 ~ 59 之间的整数。
millisec	
可选。要给 dateObject 设置的毫秒字段的值。使用世界时表示。
该参数是 0 ~ 999 之间的整数。
返回值
调整过的日期的毫秒表示。
提示和注释：
注释：如果上面的参数之一使用一位的数字来规定，那么 JavaScript 会在结果中加一或两个前置 0。
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
在本例中，我们将通过 setUTCSeconds() 把当前时间的秒字段设置为 01：
<script type="text/javascript">

var d = new Date()
d.setUTCSeconds(1)
document.write(d)

</script>
输出：
Thu Nov 21 2013 14:28:01 GMT+0800 (China Standard Time)
TIY
setUTCSeconds()
如何使用 setUTCSeconds() 来设置当前时间的秒。■◆33■根据世界时设置毫秒()     简化命令：．世置毫秒■．世置毫秒■根据世界时设置 Date 对象中的毫秒 (0 ~ 999)。


定义和用法
setUTCMilliseconds() 方法用于根据世界时 (UTC) 设置指定时间的毫秒。
语法
dateObject.setUTCMilliseconds(millisec)
参数	描述
millisec	
必需。要给 dateObject 设置的毫秒字段的值。使用世界时表示。
该参数是 0 ~ 999 之间的整数。
返回值
调整过的日期的毫秒表示。
提示和注释：
注释：如果上面的参数之一使用一位的数字来规定，那么 JavaScript 会在结果中加一或两个前置 0。
注释：该方法总是结合一个 Date 对象来使用。
提示：有关通用协调时间 (UTC) 的更多资料，请参阅百度百科。
实例
在本例中，我们将通过 setUTCMilliseconds() 方法把当前时间的毫秒字段设置为 001：
<script type="text/javascript">

var d = new Date()
d.setUTCMilliseconds(1)
document.write(d)

</script>
输出：
Thu Nov 21 2013 14:29:46 GMT+0800 (China Standard Time)
TIY
setUTCMilliseconds()
如何使用 setUTCMilliseconds() 来设置当前时间的毫秒。■◆33■返回该对象的源代码()     简化命令：．返回源码■．返回源码■返回该对象的源代码。


定义和用法
toSource() 方法返回表示对象源代码的字符串。
语法
object.toSource()
提示和注释
注释：该方法在 Internet Explorer 中无效。
实例
下面的例子向您展示 toSource() 方法的用法：
<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

document.write(bill.toSource());

</script>
输出：
({name:"Bill Gates", job:"Engineer", born:1985}) 
TIY■◆33■把Date对象转换为字符串() 简化命令：．取串■．取串■把 Date 对象转换为字符串。


定义和用法
toString() 方法可把 Date 对象转换为字符串，并返回结果。
语法
dateObject.toString()
返回值
dateObject 的字符串表示，使用本地时间表示。
实例
在本例中，我们将把今天的日期转换为字符串：
<script type="text/javascript">

var d = new Date()
document.write (d.toString())

</script>
输出：
Thu Nov 21 2013 14:33:10 GMT+0800 (China Standard Time)
TIY
toString()
如何使用 toString() 把今天的日期转换为字符串。
JavaScript Date 对象参考手册
课外书
如需更多有关类型转换的知识，请阅读 JavaScript 高级教程中的相关内容：
ECMAScript 类型转换
本节讲解了 ECMAScript 提供的类型转换方法，以及如何进行强制类型转换。■◆33■把时间部分换为字符串()   简化命令：．时间变串■．时间变串■把 Date 对象的时间部分转换为字符串。


定义和用法
toTimeString() 方法可把 Date 对象的时间部分转换为字符串，并返回结果。
语法
dateObject.toTimeString()
返回值
dateObject 的时间部分的字符串表示，由实现决定，使用本地时间表示。■◆33■把日期部分换为字符串()   简化命令：．日期变串■．日期变串■把 Date 对象的日期部分转换为字符串。


定义和用法
toDateString() 方法可把 Date 对象的日期部分转换为字符串，并返回结果。
语法
dateObject.toDateString()
返回值
dateObject 的日期部分的字符串表示，由实现决定，使用本地时间表示。■◆33■根据格林威治(GMT)换为字符串() 简化命令：．威治变串■．威治变串■请使用 toUTCString() 方法代替。


定义和用法
toGMTString() 方法可根据格林威治时间 (GMT) 把 Date 对象转换为字符串，并返回结果。
语法
dateObject.toGMTString()
返回值
dateObject 的字符串表示。此日期会在转换为字符串之前由本地时区转换为 GMT 时区。
提示和注释
不赞成使用此方法。请使用 toUTCString() 取而代之！！
实例
例子 1
在本例中，我们将把今天的日期转换为（根据 GMT）字符串：
<script type="text/javascript">

var d = new Date()
document.write (d.toGMTString())

</script>
输出：
Thu, 21 Nov 2013 06:37:02 GMT
例子 2
在下面的例子中，我们将把具体的日期转换为（根据 GMT）字符串：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.toGMTString())

</script>
输出：
Wed, 20 Jul 1983 17:15:00 GMT
TIY
toGMTString()
如何通过 toGMTString() 把今天的日期转换为（根据 GMT）字符串。■◆33■根据世界时转换为字符串() 简化命令：．世变串■．世变串■根据世界时，把 Date 对象转换为字符串。


定义和用法
toUTCString() 方法可根据世界时 (UTC) 把 Date 对象转换为字符串，并返回结果。
语法
dateObject.toUTCString()
返回值
dateObject 的字符串表示，用世界时表示。
实例
例子 1
在下面的例子中，我们将使用 toUTCString() 来把今天的日期转换为（根据 UTC）字符串：
<script type="text/javascript">

var d = new Date()
document.write (d.toUTCString())

</script>
输出：
Thu, 21 Nov 2013 06:55:15 GMT
例子 2
在下面的例子中，我们将把具体的日期转换为（根据 UTC）字符串：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.toUTCString())

</script>
输出：
Wed, 20 Jul 1983 17:15:00 GMT
TIY
toUTCString()
如何使用 toUTCString() 来把今天的日期转换为（根据 UTC）字符串。■◆33■据本地时间格式换字符串() 简化命令：．本地变串■．本地变串■根据本地时间格式，把 Date 对象转换为字符串。



定义和用法
toLocaleString() 方法可根据本地时间把 Date 对象转换为字符串，并返回结果。
语法
dateObject.toLocaleString()
返回值
dateObject 的字符串表示，以本地时间区表示，并根据本地规则格式化。
实例
例子 1
在本例中，我们将根据本地时间把今天的日期转换为字符串：
<script type="text/javascript">

var d = new Date()
document.write(d.toLocaleString())

</script>
输出：
Thu Nov 21 2013 14:56:46 GMT+0800 (China Standard Time)
例子 2
在本例中，我们将根据本地时间把具体的日期转换为字符串：
<script type="text/javascript">

var born = new Date("July 21, 1983 01:15:00")
document.write(born.toLocaleString())

</script>
输出：
Thu Jul 21 1983 01:15:00 GMT+0800 (China Standard Time)
TIY
toLocaleString()
如何使用 toLocaleString() 来根据本地时间把今天的日期转换为字符串。■◆33■据本地格式把时间换字串() 简化命令：．本地时间变串■．本地时间变串■根据本地时间格式，把 Date 对象的时间部分转换为字符串。


定义和用法
toLocaleTimeString() 方法可根据本地时间把 Date 对象的时间部分转换为字符串，并返回结果。
语法
dateObject.toLocaleTimeString()
返回值
dateObject 的时间部分的字符串表示，以本地时间区表示，并根据本地规则格式化。
JavaScript Date 对象参考手册■◆33■据本地格式日期换字串()   简化命令：．本地日期变串■．本地日期变串■根据本地时间格式，把 Date 对象的日期部分转换为字符串。


定义和用法
toLocaleDateString() 方法可根据本地时间把 Date 对象的日期部分转换为字符串，并返回结果。
语法
dateObject.toLocaleDateString()
返回值
dateObject 的日期部分的字符串表示，以本地时间区表示，并根据本地规则格式化。■◆33■世界取1970/1/1到日期()   简化命令：．世定期毫秒数■．世定期毫秒数■根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。



定义和用法
UTC() 方法可根据世界时返回 1970 年 1 月 1 日 到指定日期的毫秒数。
语法
Date.UTC(year,month,day,hours,minutes,seconds,ms)
参数	描述
year	必需。表示年份的四位数字。
month	必需。表示月份的整数，介于 0 ~ 11。
day	必需。表示日期的整数，介于 1 ~ 31。
hours	可选。表示小时的整数，介于 0 ~ 23。
minutes	可选。表示分钟的整数，介于 0 ~ 59。
seconds	可选。表示秒的整数，介于 0 ~ 59。
ms	可选。表示毫秒的整数，介于 0 ~ 999。
返回值
返回指定的时间距 GMT 时间 1970 年 1 月 1 日午夜的毫秒数。
说明
Date.UTC() 是一种静态方法，因为需要使用构造函数 Date() 来调用它，而不是通过某个 Date 对象调用。
Date.UTC() 方法的参数指定日期和时间，它们都是 UTC 时间，处于 GMT 时区。指定的 UTC 时间将转换成毫秒的形式，这样构造函数 Date() 和方法 Date.setTime() 就可以使用它了。
实例
例子 1
在本例中，我们将根据世界时取得从 1970/01/01 到 2005/07/08 的毫秒数：
<script type="text/javascript">

var d = Date.UTC(2005,7,8)
document.write(d)

</script>
输出：
1123459200000
例子 2
现在，我们将改造上面的例子，使得输出转换为年：
<script type="text/javascript">

var minutes = 1000 * 60
var hours = minutes * 60
var days = hours * 24
var years = days * 365
var t = Date.UTC(2005,7,8)
var y = t/years
document.write("It's been: " + y + " years from 1970/01/01")
document.write(" to 2005/07/08!")

</script>
输出：
It's been: 35.62465753424657 years from 1970/01/01 to 2005/07/08!
TIY
UTC()
使用 UTC() 来输出从 1970/01/01 到具体日期的毫秒数（根据世界时）。■◆33■返回 Date 对象的原始值() 简化命令：．取原值■．取原值■返回 Date 对象的原始值。


定义和用法
valueOf() 方法返回 Date 对象的原始值。
该原始值由 Date 对象派生的所有对象继承。
valueOf() 方法通常由 JavaScript 在后台自动调用，并不显式地出现在代码中。
返回值
date 的毫秒表示。返回值和方法 Date.getTime 返回的值相等。■◆8■数学■数学■Math 对象
Math 对象用于执行数学任务。
使用 Math 的属性和方法的语法：
var pi_value=Math.PI;
var sqrt_value=Math.sqrt(15);
注释：Math 对象并不像 Date 和 String 那样是对象的类，因此没有构造函数 Math()，像 Math.sin() 这样的函数只是函数，不是某个对象的方法。您无需创建它，通过把 Math 作为对象使用就可以调用其所有属性和方法。■◆83■返回算术常量e即自然对数底数：约2.718      简化命令：E■E■返回算术常量 e，即自然对数的底数（约等于2.718）。



定义和用法
Math.E 属性代表算术常量 e，即自然对数的底数，其值近似于 2.71828。
语法
Math.E
实例
返回 Euler 数：
<script type="text/javascript">

document.write("Euler's number: " + Math.E);

</script>
输出：
Euler's number: 2.718281828459045
TIY■◆83■返回 2 的自然对数：约等于0.693            简化命令：LN2■LN2■返回 2 的自然对数（约等于0.693）。


定义和用法
LN2 属性就是 loge2，即 2 的自然对数，其值近似于 0.69314718055994528623。
语法
Math.LN2
实例
返回 2 的自然对数：
<script type="text/javascript">

document.write("LN2: " + Math.LN2);

</script>
输出：
LN2: 0.6931471805599453■◆83■返回 10 的自然对数：约等于2.302           简化命令：LN10■LN10■返回 10 的自然对数（约等于2.302）。



定义和用法
LN2 属性就是 loge2，即 2 的自然对数，其值近似于 0.69314718055994528623。
语法
Math.LN2
实例
返回 2 的自然对数：
<script type="text/javascript">

document.write("LN2: " + Math.LN2);

</script>
输出：
LN2: 0.6931471805599453
TIY■◆83■返回以 2 为底的 e 的对数：约等于 1.414    简化命令：LOG2E■LOG2E■返回以 2 为底的 e 的对数（约等于 1.414）。



定义和用法
LOG2E 属性就是 log2e，即以 2 为底 e 的对数，其值近似于 1.442695040888963387。
语法
Math.LOG2E
实例
返回以 2 为底 e 的对数：
<script type="text/javascript">

document.write("LOG2E: " + Math.LOG2E);

</script>
输出：
LOG2E: 1.4426950408889634■◆83■返回以 10 为底的 e 的对数：约等于0.434    简化命令：LOG10E■LOG10E■返回以 10 为底的 e 的对数（约等于0.434）。



定义和用法
LOG10E 属性就是 log10e，即以 10 为底 e 的对数，其值近似于 0.43429448190325181667。
语法
Math.LOG10E
实例
返回以 10 为底 e 的对数：
<script type="text/javascript">

document.write("LOG10E: " + Math.LOG10E);

</script>
输出：
LOG10E: 0.4342944819032518■◆83■返回圆周率：约等于3.14159                 简化命令：PI■PI■返回圆周率（约等于3.14159）。



定义和用法
PI 属性就是 π，即圆的周长和它的直径之比。这个值近似为 3.141592653589793。
语法
Math.PI
实例
返回 PI：
<script type="text/javascript">

document.write("PI: " + Math.PI);

</script>
输出：
PI: 3.141592653589793■◆83■返回2的平方根的倒数：约等于 0.707         简化命令：SQRT1_2■SQRT1_2■返回 2 的平方根的倒数（约等于 0.707）。





定义和用法
SQRT1_2 属性返回 2 的平方根的倒数。这个值近似为 0.7071067811865476。
语法
Math.SQRT1_2
实例
返回 1/2 的平方根：
<script type="text/javascript">

document.write("SQRT1_2: " + Math.SQRT1_2);

</script>
输出：
SQRT1_2: 0.7071067811865476■◆83■返回 2 的平方根：约等于 1.414             简化命令：SQRT2■SQRT2■返回 2 的平方根（约等于 1.414）。




定义和用法
SQRT2 属性返回 2 的平方根。这个值近似为 1.4142135623730951。
语法
Math.SQRT2
实例
返回 2 的平方根：
<script type="text/javascript">

document.write("SQRT2: " + Math.SQRT2);

</script>
输出：
SQRT2: 1.4142135623730951■◆83■返回数的绝对值()                          简化命令：．绝对值■．绝对值■返回数的绝对值。



定义和用法
abs() 方法可返回数的绝对值。
语法
Math.abs(x)
参数	描述
x	必需。必须是一个数值。
返回值
x 的绝对值。
实例
在本例中，我将取得正数和负数的绝对值：
<script type="text/javascript">

document.write(Math.abs(7.25) + "<br />")
document.write(Math.abs(-7.25) + "<br />")
document.write(Math.abs(7.25-10))

</script>
输出：
7.25
7.25
2.75
TIY
abs()
如何使用 abs() 来取得数的绝对值。■◆83■返回数的反余弦值()                        简化命令：．反余弦■．反余弦■返回数的反余弦值。



定义和用法
acos() 方法可返回一个数的反余弦。
语法
Math.acos(x)
参数	描述
x	必需。必须是 -1.0 ~ 1.0 之间的数。
返回值
x 的反余弦值。返回的值是 0 到 PI 之间的弧度值。
提示和注释
注释：如果参数 x 超过了 -1.0 ~ 1.0 的范围，那么浏览器将返回 NaN。
注释：如果参数 x 取值 -1，那么将返回 PI。
实例
在本例中，我们将取得不同数的反余弦值：
<script type="text/javascript">

document.write(Math.acos(0.64) + "<br />")
document.write(Math.acos(0) + "<br />")
document.write(Math.acos(-1) + "<br />")
document.write(Math.acos(1) + "<br />")
document.write(Math.acos(2))

</script>
输出：
0.8762980611683406
1.5707963267948965
3.141592653589793
0
NaN 
TIY
acos()
如何使用 acos() 来取得不同数的反余弦值。■◆83■返回数的反正弦值()                        简化命令：．反正弦■．反正弦■返回数的反正弦值。



定义和用法
asin() 方法可返回一个数的反正弦值。
语法
Math.asin(x)
参数	描述
x	必需。必须是一个数值，该值介于 -1.0 ~ 1.0 之间。
返回值
x 的反正弦值。返回的值是 -PI/2 到 PI/2 之间的弧度值。
提示和注释
注释：如果参数 x 超过了 -1.0 ~ 1.0 的范围，那么浏览器将返回 NaN。
注释：如果参数 x 取值 1，那么将返回 PI/2。
实例
在本例中，我们将取得不同数字的反正弦值：
<script type="text/javascript">

document.write(Math.asin(0.64) + "<br />")
document.write(Math.asin(0) + "<br />")
document.write(Math.asin(-1) + "<br />")
document.write(Math.asin(1) + "<br />")
document.write(Math.asin(2))

</script>
输出：
0.6944982656265559
0
-1.5707963267948965
1.5707963267948965
NaN
TIY
asin()
如何使用 asin() 来取得不同数字的反正弦值。■◆83■以介于-PI/2与 PI/2弧度来返回x的反正切值() 简化命令：．反正切■．反正切■以介于 -PI/2 与 PI/2 弧度之间的数值来返回 x 的反正切值。


定义和用法
atan() 方法可返回数字的反正切值。
语法
Math.atan(x)
参数	描述
x	必需。必须是一个数值。
返回值
x 的反正切值。返回的值是 -PI/2 到 PI/2 之间的弧度值。
实例
下面这个例子可通过 atan() 方法返回不同数字的反正切值：
<script type="text/javascript">

document.write(Math.atan(0.50) + "<br />")
document.write(Math.atan(-0.50) + "<br />")
document.write(Math.atan(5) + "<br />")
document.write(Math.atan(10) + "<br />")
document.write(Math.atan(-5) + "<br />")
document.write(Math.atan(-10))

</script>
输出：
0.4636476090008061
-0.4636476090008061
1.373400766945016
1.4711276743037347
-1.373400766945016
-1.4711276743037347
TIY
atan()
如何使用 atan() 来返回不同数值的反正切值。
JavaScript Math 对象参考手册■◆83■取x轴到点(x,y)角度:-PI/2与PI/2弧度之间()  简化命令：．点角度■．点角度■返回从 x 轴到点 (x,y) 的角度（介于 -PI/2 与 PI/2 弧度之间）。


定义和用法
atan2() 方法可返回从 x 轴到点 (x,y) 之间的角度。
语法
Math.atan2(y,x)
参数	描述
x	必需。指定点的 X 坐标。
y	必需。指定点的 Y 坐标。
返回值
-PI 到 PI 之间的值，是从 X 轴正向逆时针旋转到点 (x,y) 时经过的角度。
提示和注释
注释：请注意这个函数的参数顺序，Y 坐标在 X 坐标之前传递。
实例
下面这个例子可通过 atan2() 方法返回不同 (x,y) 点的角度：
<script type="text/javascript">

document.write(Math.atan2(0.50,0.50) + "<br />")
document.write(Math.atan2(-0.50,-0.50) + "<br />")
document.write(Math.atan2(5,5) + "<br />")
document.write(Math.atan2(10,20) + "<br />")
document.write(Math.atan2(-5,-5) + "<br />")
document.write(Math.atan2(-10,10))

</script>
输出：
0.7853981633974483
-2.356194490192345
0.7853981633974483
0.4636476090008061
-2.356194490192345
-0.7853981633974483 
TIY
atan2()
如何使用 atan2() 来返回不同 (x,y) 点的角度。■◆83■对数进行上舍入()                          简化命令：．上取整■．上取整■对数进行上舍入。



定义和用法
ceil() 方法可对一个数进行上舍入。
语法
Math.ceil(x)
参数	描述
x	必需。必须是一个数值。
返回值
大于等于 x，并且与它最接近的整数。
说明
ceil() 方法执行的是向上取整计算，它返回的是大于或等于函数参数，并且与之最接近的整数。
实例
在本例中，我们将把 ceil() 方法运用到不同的数字上：
<script type="text/javascript">

document.write(Math.ceil(0.60) + "<br />")
document.write(Math.ceil(0.40) + "<br />")
document.write(Math.ceil(5) + "<br />")
document.write(Math.ceil(5.1) + "<br />")
document.write(Math.ceil(-5.1) + "<br />")
document.write(Math.ceil(-5.9))

</script>
输出：
1
1
5
6
-5
-5
TIY
ceil()
如何使用 ceil() 方法。■◆83■返回数的余弦()                            简化命令：．余弦■．余弦■返回数的余弦。



定义和用法
cos() 方法可返回一个数字的余弦值。
语法
Math.cos(x)
参数	描述
x	必需。必须是一个数值。
返回值
x 的余弦值。返回的是 -1.0 到 1.0 之间的数。
实例
在本例中，我们将返回不同数值的余弦值：
<script type="text/javascript">

document.write(Math.cos(3) + "<br />")
document.write(Math.cos(-3) + "<br />")
document.write(Math.cos(0) + "<br />")
document.write(Math.cos(Math.PI) + "<br />")
document.write(Math.cos(2*Math.PI))

</script>
输出：
-0.9899924966004454
-0.9899924966004454
1
-1
1
TIY
cos()
如何使用 cos() 来取得一些数字的余弦值。■◆83■返回 e 的指数()                           简化命令：．e指数■．e指数■返回 e 的指数。



定义和用法
exp() 方法可返回 e 的 x 次幂的值。
语法
Math.exp(x)
参数	描述
x	必需。任意数值或表达式。被用作指数。
返回值
返回 e 的 x 次幂。e 代表自然对数的底数，其值近似为 2.71828。
实例
在下面的例子中，我们将把 exp() 运用到不同的数值上：
<script type="text/javascript">

document.write(Math.exp(1) + "<br />")
document.write(Math.exp(-1) + "<br />")
document.write(Math.exp(5) + "<br />")
document.write(Math.exp(10) + "<br />")

</script>
输出：
2.718281828459045
0.36787944117144233
148.4131591025766
22026.465794806718
TIY
exp()
如何使用 exp() 方法。■◆83■对数进行下舍入()                          简化命令：．下取整■．下取整■对数进行下舍入。



定义和用法
floor() 方法可对一个数进行下舍入。
语法
Math.floor(x)
参数	描述
x	必需。任意数值或表达式。
返回值
小于等于 x，且与 x 最接近的整数。
说明
floor() 方法执行的是向下取整计算，它返回的是小于或等于函数参数，并且与之最接近的整数。
实例
In this example we will use the floor() method on different numbers:
<script type="text/javascript">

document.write(Math.floor(0.60) + "<br />")
document.write(Math.floor(0.40) + "<br />")
document.write(Math.floor(5) + "<br />")
document.write(Math.floor(5.1) + "<br />")
document.write(Math.floor(-5.1) + "<br />")
document.write(Math.floor(-5.9))

</script>
输出：
0
0
5
5
-6
-6
TIY
floor()
如何使用 floor() 方法。■◆83■返回数的自然对数：底为e()                 简化命令：．对数■．对数■返回数的自然对数（底为e）。



定义和用法
log() 方法可返回一个数的自然对数。
语法
Math.log(x)
参数	描述
x	必需。任意数值或表达式。
返回值
x 的自然对数。
说明
参数 x 必须大于 0。
实例
在本例中，我们将对不同的数运用 log() ：
<script type="text/javascript">

document.write(Math.log(2.7183) + "<br />")
document.write(Math.log(2) + "<br />")
document.write(Math.log(1) + "<br />")
document.write(Math.log(0) + "<br />")
document.write(Math.log(-1))

</script>
输出：
1.0000066849139877
0.6931471805599453
0
-Infinity
NaN
TIY
log()
如何使用 log 方法。■◆83■返回 x 和 y 中的最高值()                  简化命令：．取大■．取大■返回 x 和 y 中的最高值。



max() 方法可返回两个指定的数中带有较大的值的那个数。
语法
Math.max(x...)
参数	描述
x	0 或多个值。在 ECMASCript v3 之前，该方法只有两个参数。
返回值
参数中最大的值。如果没有参数，则返回 -Infinity。如果有某个参数为 NaN，或是不能转换成数字的非数字值，则返回 NaN。
实例
在本例中，我们将展示如何使用 max() 来返回指定数字中带有最高值的数字：
<script type="text/javascript">

document.write(Math.max(5,7) + "<br />")
document.write(Math.max(-3,5) + "<br />")
document.write(Math.max(-3,-5) + "<br />")
document.write(Math.max(7.25,7.30))

</script>
输出：
7
5
-3
7.3
TIY
max()
如何使用 max() 来返回指定数字中带有最高值的数字。■◆83■返回 x 和 y 中的最低值()                  简化命令：．取小■．取小■返回 x 和 y 中的最低值。


定义和用法
min() 方法可返回指定的数字中带有最低值的数字。
语法
Math.min(x,y)
参数	描述
x	0 或多个值。在 ECMASCript v3 之前，该方法只有两个参数。
返回值
参数中最小的值。如果没有参数，则返回 Infinity。如果有某个参数为 NaN，或是不能转换成数字的非数字值，则返回 NaN。
实例
在本例中，我们将展示如何使用 min() 来返回指定数字中带有最低值的数字：
<script type="text/javascript">

document.write(Math.min(5,7) + "<br />")
document.write(Math.min(-3,5) + "<br />")
document.write(Math.min(-3,-5) + "<br />")
document.write(Math.min(7.25,7.30))

</script>
输出：
5
-3
-5
7.25
TIY
min()
如何使用 min() 来取得指定数字中带有最低值的数字。■◆83■返回 x 的 y 次幂()                        简化命令：．次幂■．次幂■返回 x 的 y 次幂。


定义和用法
pow() 方法可返回 x 的 y 次幂的值。
语法
Math.pow(x,y)
参数	描述
x	必需。底数。必须是数字。
y	必需。幂数。必须是数字。
返回值
x 的 y 次幂。
说明
如果结果是虚数或负数，则该方法将返回 NaN。如果由于指数过大而引起浮点溢出，则该方法将返回 Infinity。
实例
在下面的例子中，我们将把 pow() 运用到不同的数字组合上：
<script type="text/javascript">

document.write(Math.pow(0,0) + "<br />")
document.write(Math.pow(0,1) + "<br />")
document.write(Math.pow(1,1) + "<br />")
document.write(Math.pow(1,10) + "<br />")
document.write(Math.pow(2,3) + "<br />")
document.write(Math.pow(-2,3) + "<br />")
document.write(Math.pow(2,4) + "<br />")
document.write(Math.pow(-2,4) + "<br />")

</script>
输出：
1
0
1
1
8
-8
16
16
TIY
pow()
如何使用 pow() 方法。■◆83■返回 0 ~ 1 之间的随机数()                 简化命令：．随机■．随机■返回 0 ~ 1 之间的随机数。



定义和用法
random() 方法可返回介于 0 ~ 1 之间的一个随机数。
语法
Math.random()
返回值
0.0 ~ 1.0 之间的一个伪随机数。
实例
在本例中，我们将取得介于 0 到 1 之间的一个随机数：
<script type="text/javascript">

document.write(Math.random())

</script>
输出：
0.3166404312942177
TIY
random()
如何使用 random() 来取得一个随机数。■◆83■把数四舍五入为最接近的整数()              简化命令：．四舍■．四舍■把数四舍五入为最接近的整数。



定义和用法
round() 方法可把一个数字舍入为最接近的整数。
语法
Math.round(x)
参数	描述
x	必需。必须是数字。
返回值
与 x 最接近的整数。
说明
对于 0.5，该方法将进行上舍入。
例如，3.5 将舍入为 4，而 -3.5 将舍入为 -3。
实例
把不同的数舍入为最接近的整数：
<script type="text/javascript">

document.write(Math.round(0.60) + "<br />")
document.write(Math.round(0.50) + "<br />")
document.write(Math.round(0.49) + "<br />")
document.write(Math.round(-4.40) + "<br />")
document.write(Math.round(-4.60))

</script>
输出：
1
1
0
-4
-5
TIY
round()
如何使用 round() 方法。■◆83■返回数的正弦()                            简化命令：．正弦■．正弦■返回数的正弦。


定义和用法
sin() 方法可返回一个数字的正弦。
语法
Math.sin(x)
参数	描述
x	必需。一个以弧度表示的角。将角度乘以 0.017453293 （2PI/360）即可转换为弧度。
返回值
参数 x 的正弦值。返回值在 -1.0 到 1.0 之间。
实例
在本例中，我们将返回不同数字的正弦：
<script type="text/javascript">

document.write(Math.sin(3) + "<br />")
document.write(Math.sin(-3) + "<br />")
document.write(Math.sin(0) + "<br />")
document.write(Math.sin(Math.PI) + "<br />")
document.write(Math.sin(Math.PI/2)

</script>
输出：
0.1411200080598672
-0.1411200080598672
0
1.2246063538223772e-16
1
TIY
sin()
如何使用 sin() 来取得一些数字的正弦。■◆83■返回数的平方根()                          简化命令：．平方根■．平方根■返回数的平方根。




定义和用法
sqrt() 方法可返回一个数的平方根。
语法
Math.sqrt(x)
参数	描述
x	必需。必须是大于等于 0 的数。
返回值
参数 x 的平方根。如果 x 小于 0，则返回 NaN。
提示和注释
提示：Math.pow() 方法可以计算一个数的任意次根。
实例
在本例中，我们将返回不同数字的平方根：
var a=Math.sqrt(0);
var b=Math.sqrt(1);
var c=Math.sqrt(9);
var d=Math.sqrt(0.64);
var e=Math.sqrt(-9);
输出：
0
1
3
0.8
NaN
亲自试一试■◆83■返回角的正切()                            简化命令：．正切■．正切■返回角的正切。



定义和用法
tan() 方法可返回一个表示某个角的正切的数字。
语法
Math.tan(x)
参数	描述
x	必需。一个以弧度表示的角。将角度乘以 0.017453293 （2PI/360）即可转换为弧度。
返回值
参数 x 的正切值。
实例
在本例中，我们将计算不同数字的正切值：
<script type="text/javascript">

document.write(Math.tan(0.50) + "<br />")
document.write(Math.tan(-0.50) + "<br />")
document.write(Math.tan(5) + "<br />")
document.write(Math.tan(10) + "<br />")
document.write(Math.tan(-5) + "<br />")
document.write(Math.tan(-10))

</script>
输出：
0.5463024898437905
-0.5463024898437905
-3.380515006246586
0.6483608274590866
3.380515006246586
-0.6483608274590866
TIY
tan()
如何使用 tan() 来计算不同数字的正切值。■◆83■返回该对象的源代码()                      简化命令：．返回源码■．返回源码■返回该对象的源代码。



定义和用法
toSource() 方法返回表示对象源代码的字符串。
语法
object.toSource()
提示和注释
注释：该方法在 Internet Explorer 中无效。
实例
下面的例子向您展示 toSource() 方法的用法：
<script type="text/javascript">

function employee(name,job,born)
{
this.name=name;
this.job=job;
this.born=born;
}

var bill=new employee("Bill Gates","Engineer",1985);

document.write(bill.toSource());

</script>
输出：
({name:"Bill Gates", job:"Engineer", born:1985}) 
TIY■◆83■返回 Math 对象的原始值()                  简化命令：．取原值■．取原值■返回 Math 对象的原始值。




定义和用法
valueOf() 方法返回 Math 对象的原始值。
该原始值由 Math 对象派生的所有对象继承。
valueOf() 方法通常由 JavaScript 在后台自动调用，并不显式地出现在代码中。
语法
mathObject.valueOf()■◆8■数值■数值■Number 对象
Number 对象是原始数值的包装对象。
创建 Number 对象的语法：
var myNum=new Number(value);
var myNum=Number(value);
参数
参数 value 是要创建的 Number 对象的数值，或是要转换成数字的值。
返回值
当 Number() 和运算符 new 一起作为构造函数使用时，它返回一个新创建的 Number 对象。如果不用 new 运算符，把 Number() 作为一个函数来调用，它将把自己的参数转换成一个原始的数值，并且返回这个值（如果转换失败，则返回 NaN）。■◆112■返回对创建此对象的 Number 函数的引用   简化命令：．构造函数■．构造函数■返回对创建此对象的 Number 函数的引用。







定义和用法
constructor 属性返回对创建此对象的 Boolean 函数的引用。
语法
object.constructor
实例
在本例中，我们将展示如何使用 constructor 属性：
<script type="text/javascript">

var test=new Boolean();

if (test.constructor==Array)
{
document.write("This is an Array");
}
if (test.constructor==Boolean)
{
document.write("This is a Boolean");
}
if (test.constructor==Date)
{
document.write("This is a Date");
}
if (test.constructor==String)
{
document.write("This is a String");
}

</script>
输出：
This is a Boolean
TIY
TIY
constructor
在本例中，我们将展示如何使用 constructor 属性。■◆112■可表示的最大的数                       简化命令：．最大■．最大■可表示的最大的数。



定义和用法
MAX_VALUE 属性是 JavaScript 中可表示的最大的数。它的近似值为 1.7976931348623157 x 10308。
语法
Number.MAX_VALUE
实例
返回 JavaScript 中可能的最大值：
<script type="text/javascript">

document.write(Number.MAX_VALUE);

</script>
输出：
1.7976931348623157e+308
TIY
TIY
MAX_VALUE
本例返回 JavaScript 中最大的数。■◆112■可表示的最小的数                       简化命令：．最小■．最小■可表示的最小的数。




定义和用法
MIN_VALUE 属性是 JavaScript 中可表示的最小的数（接近 0 ，但不是负数）。它的近似值为 5 x 10-324。
语法
Number.MIN_VALUE
实例
返回 JavaScript 中可能的最小值：
<script type="text/javascript">

document.write(Number.MIN_VALUE);

</script>
输出：
5e-324
TIY
TIY
MIN_VALUE
本例返回 JavaScript 中最小的数。■◆112■非数字值                               简化命令：．非数■．非数■非数字值。


定义和用法
NaN 属性是代表非数字值的特殊值。该属性用于指示某个值不是数字。可以把 Number 对象设置为该值，来指示其不是数字值。
提示：请使用 isNaN() 全局函数来判断一个值是否是 NaN 值。
语法
Number.NaN
说明
Number.NaN 是一个特殊值，说明某些算术运算（如求负数的平方根）的结果不是数字。方法 parseInt() 和 parseFloat() 在不能解析指定的字符串时就返回这个值。对于一些常规情况下返回有效数字的函数，也可以采用这种方法，用 Number.NaN 说明它的错误情况。
JavaScript 以 NaN 的形式输出 Number.NaN。请注意，NaN 与其他数值进行比较的结果总是不相等的，包括它自身在内。因此，不能与 Number.NaN 比较来检测一个值是不是数字，而只能调用 isNaN() 来比较。
在 ECMAScript v1 和其后的版本中，还可以用预定义的全局属性 NaN 代替 Number.NaN。
提示和注释
提示：请使用 isNaN() 来判断一个值是否是数字。原因是 NaN 与所有值都不相等，包括它自己。
实例
用 NaN 指示某个值是否是数字：
<script type="text/javascript">

var Month=30;

if (Month < 1 || Month > 12)
{
Month = Number.NaN;
}

document.write(Month);

</script>
输出：
Nan
TIY
TIY
NaN
如何通过 NaN 来判断一个值。
相关页面
JavaScript 全局对象参考手册：NaN 属性
JavaScript 全局对象参考手册：isNaN() 函数■◆112■负无穷大，溢出时返回该值               简化命令：．负无穷■．负无穷■负无穷大，溢出时返回该值。



定义和用法
NEGATIVE_INFINITY 属性表示小于 Number.MIN_VALUE 的值。
该值代表负无穷大。
语法
Number.NEGATIVE_INFINITY
说明
Number.NEGATIVE_INFINITY 是一个特殊值，它在算术运算或函数生成一个比 JavaScript 能表示的最小负数还小的数（也就是比 -Number.MAX_VALUE 还小的数）时返回。
JavaScript 显示 NEGATIVE_INFINITY 时使用的是 -Infinity。这个值的算术行为和无穷大非常相似。例如，任何数乘无穷大结果仍为无穷大，任何数被无穷大除的结果为 0。
在 ECMAScript v1 和其后的版本中，还可以用 -Infinity 代替 Number.NEGATIVE_INFINITY。
实例
在本例中，我们将使用 NEGATIVE_INFINITY：
<script type="text/javascript">

var x=(-Number.MAX_VALUE)*2
if (x==Number.NEGATIVE_INFINITY)
  {
  document.write("Value of x: " + x);
  }

</script>
输出：
Value of x: -Infinity
TIY
TIY
NEGATIVE_INFINITY
如何通过 NEGATIVE_INFINITY 来判断一个值是否是负无穷大。
相关页面
JavaScript 全局对象参考手册：Infinity 属性
JavaScript 全局对象参考手册：isFinite() 函数■◆112■正无穷大，溢出时返回该值               简化命令：．正无穷■．正无穷■正无穷大，溢出时返回该值。




定义和用法
POSITIVE_INFINITY 属性表示大于 Number.MAX_VALUE 的值。
该值代表正无穷大。
语法
Number.POSITIVE_INFINITY
说明
Number.POSITIVE_INFINITY 是一个特殊值，它在算术运算或函数生成一个比 JavaScript 能表示的最大的数还大的数（也就是比 Number.MAX_VALUE 还大的数）时返回。
JavaScript 显示 POSITIVE_INFINITY 时使用的是 Infinity。这个值的算术行为和无穷大非常相似。例如，任何数乘无穷大结果仍为无穷大，任何数被无穷大除的结果为 0。
在 ECMAScript v1 和其后的版本中，还可以用 Infinity 代替 Number.POSITIVE_INFINITY。
实例
在本例中，我们将使用 POSITIVE_INFINITY：
<script type="text/javascript">

var x=(Number.MAX_VALUE)*2
if (x==Number.POSITIVE_INFINITY)
  {
  document.write("Value of x: " + x);
  }

</script>
输出：
Value of x: Infinity
TIY
TIY
POSITIVE_INFINITY
如何通过 POSITIVE_INFINITY 来判断一个值是否是正无穷大。
相关页面
JavaScript 全局对象参考手册：Infinity 属性
JavaScript 全局对象参考手册：isFinite() 函数■◆112■使您有能力向对象添加属性和方法         简化命令：．添加■．添加■使您有能力向对象添加属性和方法。


■◆112■把数字转换为字符串，使用指定的基数()   简化命令：．取串■．取串■把数字转换为字符串，使用指定的基数。


定义和用法
toString() 方法可把一个 Number 对象转换为一个字符串，并返回结果。
语法
NumberObject.toString(radix)
参数	描述
radix	可选。规定表示数字的基数，使 2 ~ 36 之间的整数。若省略该参数，则使用基数 10。但是要注意，如果该参数是 10 以外的其他值，则 ECMAScript 标准允许实现返回任意值。
返回值
数字的字符串表示。例如，当 radix 为 2 时，NumberObject 会被转换为二进制值表示的字符串。
抛出
当调用该方法的对象不是 Number 时抛出 TypeError 异常。
实例
在本例中，我们将把一个数字转换为字符串：
<script type="text/javascript">

var number = new Number(1337);
document.write (number.toString())

</script>
输出：
1337
TIY
toString()
如何使用 toString() 来把数字转换为字符串。
JavaScript Number 对象参考手册
课外书
如需更多有关类型转换的知识，请阅读 JavaScript 高级教程中的相关内容：■◆112■数字转换字符串，使用本地数字格式顺序() 简化命令：．本地变串■．本地变串■把数字转换为字符串，使用本地数字格式顺序。



定义和用法
toLocaleString() 方法可把一个 Number 对象转换为本地格式的字符串。
语法
NumberObject.toLocaleString()
返回值
数字的字符串表示，由实现决定，根据本地规范进行格式化，可能影响到小数点或千分位分隔符采用的标点符号。
抛出
当调用该方法的对象不是 Number 时抛出 TypeError 异常。■◆112■数字转字符串,小数点后指定位数()        简化命令：．数字变串■．数字变串■把数字转换为字符串，结果的小数点后有指定位数的数字。



定义和用法
toFixed() 方法可把 Number 四舍五入为指定小数位数的数字。
语法
NumberObject.toFixed(num)
参数	描述
num	必需。规定小数的位数，是 0 ~ 20 之间的值，包括 0 和 20，有些实现可以支持更大的数值范围。如果省略了该参数，将用 0 代替。
返回值
返回 NumberObject 的字符串表示，不采用指数计数法，小数点后有固定的 num 位数字。如果必要，该数字会被舍入，也可以用 0 补足，以便它达到指定的长度。如果 num 大于 le+21，则该方法只调用 NumberObject.toString()，返回采用指数计数法表示的字符串。
抛出
当 num 太小或太大时抛出异常 RangeError。0 ~ 20 之间的值不会引发该异常。有些实现支持更大范围或更小范围内的值。
当调用该方法的对象不是 Number 时抛出 TypeError 异常。
实例
在本例中，我们将把数字舍入为仅有一位小数的数字：
Show the number 13.37 with one decimal:
<script type="text/javascript">
var num = new Number(13.37);
document.write (num.toFixed(1))
</script>
输出：
Show the number 13.37 with one decimal:
13.4
TIY
toFixed()
如何使用 toFixed() 来舍入一个数字。■◆112■把对象的值转换为指数计数法()           简化命令：．指数计数■．指数计数■把对象的值转换为指数计数法。




定义和用法
toExponential() 方法可把对象的值转换成指数计数法。
语法
NumberObject.toExponential(num)
参数	描述
num	必需。规定指数计数法中的小数位数，是 0 ~ 20 之间的值，包括 0 和 20，有些实现可以支持更大的数值范围。如果省略了该参数，将使用尽可能多的数字。
返回值
返回 NumberObject 的字符串表示，采用指数计数法，即小数点之前有一位数字，小数点之后有 num 位数字。该数字的小数部分将被舍入，必要时用 0 补足，以便它达到指定的长度。
抛出
当 num 太小或太大时抛出异常 RangeError。0 ~ 20 之间的值不会引发该异常。有些实现支持更大范围或更小范围内的值。
当调用该方法的对象不是 Number 时抛出 TypeError 异常。
实例
在本例中，我们将把一个数字转换为指数计数法：
Show 10,000 as an exponential notation:
<script type="text/javascript">
var num = new Number(10000);
document.write (num.toExponential(1))
</script>
输出：
Show 10,000 as an exponential notation:
1.0e+4
TIY
toExponential()
如何使用 toExponential() 来把数字转换为指数计数法。■◆112■把数字格式化为指定的长度()             简化命令：．格式长度■．格式长度■把数字格式化为指定的长度。



定义和用法
toPrecision() 方法可在对象的值超出指定位数时将其转换为指数计数法。
语法
NumberObject.toPrecision(num)
参数	描述
num	必需。规定必须被转换为指数计数法的最小位数。该参数是 1 ~ 21 之间（且包括 1 和 21）的值。有效实现允许有选择地支持更大或更小的 num。如果省略了该参数，则调用方法 toString()，而不是把数字转换成十进制的值。
返回值
返回 NumberObject 的字符串表示，包含 num 个有效数字。如果 num 足够大，能够包括 NumberObject 整数部分的所有数字，那么返回的字符串将采用定点计数法。否则，采用指数计数法，即小数点前有一位数字，小数点后有 num-1 位数字。必要时，该数字会被舍入或用 0 补足。
抛出
当 num 太小或太大时抛出异常 RangeError。1 ~ 21 之间的值不会引发该异常。有些实现支持更大范围或更小范围内的值。
当调用该方法的对象不是 Number 时抛出 TypeError 异常。
实例
在本例中，我们将把一个数字转换为指数计数法：
Show 10,000 as an exponential notation:
<script type="text/javascript">
var num = new Number(10000);
document.write (num.toPrecision(4))
</script>
输出：
Show 10,000 as an exponential notation:
1.000e+4
TIY
toPrecision()
如何使用 toPrecision() 来把数字转换为指数计数法。■◆112■返回一个 Number 对象的基本数字值()     简化命令：．取原值■．取原值■返回一个 Number 对象的基本数字值。




定义和用法
valueOf() 方法可以字符串返回数字。
字符串的输出通常等于该数字。
valueOf() 方法通常由 JavaScript 在后台自动进行调用，而不是显式地处于代码中。
语法
NumberObject.valueOf()
返回值
NumberObject 的原始数值。
抛出
当调用该方法的对象不是 Number 时抛出 TypeError 异常。■◆8■文本（字符串）■字符串■String 对象
String 对象用于处理文本（字符串）。
创建 String 对象的语法：
new String(s);
String(s);
参数
参数 s 是要存储在 String 对象中或转换成原始字符串的值。
返回值
当 String() 和运算符 new 一起作为构造函数使用时，它返回一个新创建的 String 对象，存放的是字符串 s 或 s 的字符串表示。
当不用 new 运算符调用 String() 时，它只把 s 转换成原始的字符串，并返回转换后的值。
■◆126■对创建该对象的函数的引用              简化命令：．构造函数■．构造函数■对创建该对象的函数的引用■◆126■字符串的长度                          简化命令：．长度■．长度■字符串的长度



length 属性可返回字符串中的字符数目。
语法
stringObject.length
实例
在本例中，我们将展示如何使用 length 属性来返回字符串中的字符数：
<script type="text/javascript">

var txt="Hello World!"
document.write(txt.length)

</script>
输出：
12
TIY
length
在本例中，我们将展示如何使用 length 属性。■◆126■允许您向对象添加属性和方法            简化命令：．添加■．添加■允许您向对象添加属性和方法■◆126■创建 HTML 锚()                        简化命令：．建锚■．建锚■创建 HTML 锚。



定义和用法
anchor() 方法用于创建 HTML 锚。
stringObject.anchor(anchorname)
参数	描述
anchorname	必需。为锚定义名称。
实例
在本例中，我们会为文本添加一个锚：
<script type="text/javascript">

var txt="Hello world!"
document.write(txt.anchor("myanchor"))

</script>
上面的代码将输出为纯粹的 HTML：
<a name="myanchor">Hello world!</a>■◆126■用大号字体显示字符串()                简化命令：．大号■．大号■用大号字体显示字符串。



定义和用法
big() 方法用于把字符串显示为大号字体。
stringObject.big()
实例
在本例中，"Hello world!" 将被显示为大号字体：
<script type="text/javascript">

var str="Hello world!"
document.write(str.big())

</script>
TIY
big()
如何使用 big() 把字符串显示为大号字体。■◆126■显示闪动字符串()                      简化命令：．闪动■．闪动■显示闪动字符串。



定义和用法
blink() 方法用于显示闪动的字符串。
语法
stringObject.blink()
提示和注释
注释：此方法无法工作于 Internet Explorer 中。
实例
在本例中，"Hello world!" 将被显示为闪动的文本：
<script type="text/javascript">

var str="Hello world!"
document.write(str.blink())

</script>
TIY
blink()
如何使用 blink() 来显示闪动的文本。■◆126■使用粗体显示字符串()                  简化命令：．粗体■．粗体■使用粗体显示字符串。



定义和用法
bold() 方法用于把字符串显示为粗体。
语法
stringObject.bold()
实例
在本例中，"Hello world!" 将被显示为粗体：
<script type="text/javascript">

var str="Hello world!"
document.write(str.bold())

</script>
TIY
bold()
如何使用 bold() 把字符串显示为粗体。■◆126■返回在指定位置的字符()                简化命令：．位置■．位置■返回在指定位置的字符。



定义和用法
charAt() 方法可返回指定位置的字符。
请注意，JavaScript 并没有一种有别于字符串类型的字符数据类型，所以返回的字符是长度为 1 的字符串。
语法
stringObject.charAt(index)
参数	描述
index	必需。表示字符串中某个位置的数字，即字符在字符串中的下标。
提示和注释
注释：字符串中第一个字符的下标是 0。如果参数 index 不在 0 与 string.length 之间，该方法将返回一个空字符串。
实例
在字符串 "Hello world!" 中，我们将返回位置 1 的字符：
<script type="text/javascript">

var str="Hello world!"
document.write(str.charAt(1))

</script>
以上代码的输出是：
e
TIY
charAt()
如何使用 charAt() 从某个字符串取得具体的字符。■◆126■返回在指定的位置的字符Unicode编码()   简化命令：．字符码■．字符码■返回在指定的位置的字符的 Unicode 编码。


定义和用法
charCodeAt() 方法可返回指定位置的字符的 Unicode 编码。这个返回值是 0 - 65535 之间的整数。
方法 charCodeAt() 与 charAt() 方法执行的操作相似，只不过前者返回的是位于指定位置的字符的编码，而后者返回的是字符子串。
语法
stringObject.charCodeAt(index)
参数	描述
index	必需。表示字符串中某个位置的数字，即字符在字符串中的下标。
提示和注释
注释：字符串中第一个字符的下标是 0。如果 index 是负数，或大于等于字符串的长度，则 charCodeAt() 返回 NaN。
实例
在字符串 "Hello world!" 中，我们将返回位置 1 的字符的 Unicode 编码：
<script type="text/javascript">

var str="Hello world!"
document.write(str.charCodeAt(1))

</script>
以上代码的输出是：
101
TIY
charCodeAt()
如何使用 charCodeAt() 来获得字符串中某个具体字符的 Unicode 编码。■◆126■连接字符串()                          简化命令：．连接■．连接■连接字符串。



定义和用法
concat() 方法用于连接两个或多个字符串。
语法
stringObject.concat(stringX,stringX,...,stringX)
参数	描述
stringX	必需。将被连接为一个字符串的一个或多个字符串对象。
concat() 方法将把它的所有参数转换成字符串，然后按顺序连接到字符串 stringObject 的尾部，并返回连接后的字符串。请注意，stringObject 本身并没有被更改。
stringObject.concat() 与 Array.concat() 很相似。
提示和注释
提示：请注意，使用 " + " 运算符来进行字符串的连接运算通常会更简便一些。
实例
在本例中，我们将创建两个字符串，然后使用 concat() 把它们显示为一个字符串：
<script type="text/javascript">

var str1="Hello "
var str2="world!"
document.write(str1.concat(str2))

</script>
以上代码的输出是：
Hello world!
TIY
concat()
如何使用 concat() 来连接两个字符串。■◆126■以打字机文本显示字符串()              简化命令：．打字■．打字■以打字机文本显示字符串。


定义和用法
fixed() 方法用于把字符串显示为打字机字体。
语法
stringObject.fixed()
实例
在本例中，"Hello world!" 将被显示为打字机文本：
<script type="text/javascript">

var str="Hello world!"
document.write(str.fixed())

</script>
TIY
fixed()
如何使用 fixed() 把字符串显示为打字机字体。■◆126■使用指定的颜色来显示字符串()          简化命令：．字色■．字色■使用指定的颜色来显示字符串。



定义和用法
fontcolor() 方法用于按照指定的颜色来显示字符串。
语法
stringObject.fontcolor(color)
参数	描述
color	必需。为字符串规定 font-color。该值必须是颜色名(red)、RGB 值(rgb(255,0,0))或者十六进制数(#FF0000)。
实例
在本例中，"Hello world!" 将显示为红色：
<script type="text/javascript">

var str="Hello world!"
document.write(str.fontcolor("Red"))

</script>
TIY
fontcolor()
如何使用 fontcolor() 来把字符串显示为红色。■◆126■使用指定的尺寸来显示字符串()          简化命令：．字值■．字值■使用指定的尺寸来显示字符串。



定义和用法
fontsize() 方法用于按照指定的尺寸来显示字符串。
语法
stringObject.fontsize(size)
提示和注释
注释：size 参数必须是从 1 至 7 的数字。
实例
在本例中，"Hello world!" 将显示为大号字：
<script type="text/javascript">

var str="Hello world!"
document.write(str.fontsize(7))

</script>
TIY
fontsize()
如何使用 fontsize() 把字符串显示为大号字。■◆126■从字符编码创建一个字符串()            简化命令：．码串■．码串■从字符编码创建一个字符串。




定义和用法
fromCharCode() 可接受一个指定的 Unicode 值，然后返回一个字符串。
语法
String.fromCharCode(numX,numX,...,numX)
参数	描述
numX	必需。一个或多个 Unicode 值，即要创建的字符串中的字符的 Unicode 编码。
提示和注释
注释：该方法是 String 的静态方法，字符串中的每个字符都由单独的数字 Unicode 编码指定。
它不能作为您已创建的 String 对象的方法来使用。因此它的语法应该是 String.fromCharCode()，而不是 myStringObject.fromCharCode()。
实例
在本例中，我们将根据 Unicode 来输出 "HELLO" 和 "ABC"：
<script type="text/javascript">

document.write(String.fromCharCode(72,69,76,76,79))
document.write("<br />")
document.write(String.fromCharCode(65,66,67))

</script>
以上代码的输出：
HELLO
ABC
TIY
fromCharCode()
如何使用 fromCharCode() 来根据 Unicode 值显示字符串。
参阅
charCodeAt() 方法■◆126■检索字符串()                          正则命令：．寻找■．寻找■检索字符串。



定义和用法
indexOf() 方法可返回某个指定的字符串值在字符串中首次出现的位置。
语法
stringObject.indexOf(searchvalue,fromindex)
参数	描述
searchvalue	必需。规定需检索的字符串值。
fromindex	可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的首字符开始检索。
说明
该方法将从头到尾地检索字符串 stringObject，看它是否含有子串 searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的开头（没有指定 fromindex 时）。如果找到一个 searchvalue，则返回 searchvalue 的第一次出现的位置。stringObject 中的字符位置是从 0 开始的。
提示和注释
注释：indexOf() 方法对大小写敏感！
注释：如果要检索的字符串值没有出现，则该方法返回 -1。
实例
在本例中，我们将在 "Hello world!" 字符串内进行不同的检索：
<script type="text/javascript">

var str="Hello world!"
document.write(str.indexOf("Hello") + "<br />")
document.write(str.indexOf("World") + "<br />")
document.write(str.indexOf("world"))

</script>
以上代码的输出：
0
-1
6
TIY
indexOf()
如何使用 indexOf() 在字符串内进行检索。
参阅
charCodeAt() 方法、lastIndexOf() 方法、substring() 方法■◆126■使用斜体显示字符串()                  简化命令：．斜体■．斜体■使用斜体显示字符串。


定义和用法
italics() 方法用于把字符串显示为斜体。
语法
stringObject.italics()
实例
在本例中，"Hello world!" 将被显示为斜体：
<script type="text/javascript">

var str="Hello world!"
document.write(str.italics())

</script>
TIY
italics()
如何使用 italics() 把字符串显示为斜体。■◆126■从后向前搜索字符串()                  简化命令：．后找■．后找■从后向前搜索字符串。



定义和用法
lastIndexOf() 方法可返回一个指定的字符串值最后出现的位置，在一个字符串中的指定位置从后向前搜索。
语法
stringObject.lastIndexOf(searchvalue,fromindex)
参数	描述
searchvalue	必需。规定需检索的字符串值。
fromindex	可选的整数参数。规定在字符串中开始检索的位置。它的合法取值是 0 到 stringObject.length - 1。如省略该参数，则将从字符串的最后一个字符处开始检索。
返回值
如果在 stringObject 中的 fromindex 位置之前存在 searchvalue，则返回的是出现的最后一个 searchvalue 的位置。
说明
该方法将从尾到头地检索字符串 stringObject，看它是否含有子串 searchvalue。开始检索的位置在字符串的 fromindex 处或字符串的结尾（没有指定 fromindex 时）。如果找到一个 searchvalue，则返回 searchvalue 的第一个字符在 stringObject 中的位置。stringObject 中的字符位置是从 0 开始的。
提示和注释
注释：lastIndexOf() 方法对大小写敏感！
注释：如果要检索的字符串值没有出现，则该方法返回 -1。
实例
在本例中，我们将在 "Hello world!" 字符串内进行不同的检索：
<script type="text/javascript">

var str="Hello world!"
document.write(str.lastIndexOf("Hello") + "<br />")
document.write(str.lastIndexOf("World") + "<br />")
document.write(str.lastIndexOf("world"))

</script>
以上代码的输出：
0
-1
6
TIY
lastIndexOf()
如何使用 lastIndexOf() 在字符串内进行检索。
参阅
charCodeAt() 方法、indexOf() 方法、substring() 方法■◆126■将字符串显示为链接()                  简化命令：．链接■．链接■将字符串显示为链接。



定义和用法
link() 方法用于把字符串显示为超链接。
语法
stringObject.link(url)
参数	描述
url	必需。规定要链接的 URL。
实例
在本例中，"Free Web Tutorials!" 将被显示为超链接：
<script type="text/javascript">

var str="Free Web Tutorials!"
document.write(str.link("http://www.w3school.com.cn"))

</script>
TIY
link()
如何使用 link() 来把字符串显示为超链接。■◆126■用本地特定的顺序来比较两个字符串()    简化命令：．比较■．比较■用本地特定的顺序来比较两个字符串。


定义和用法
用本地特定的顺序来比较两个字符串。
语法
stringObject.localeCompare(target)
参数	描述
target	要以本地特定的顺序与 stringObject 进行比较的字符串。
返回值
说明比较结果的数字。如果 stringObject 小于 target，则 localeCompare() 返回小于 0 的数。如果 stringObject 大于 target，则该方法返回大于 0 的数。如果两个字符串相等，或根据本地排序规则没有区别，该方法返回 0。
说明
把 < 和 > 运算符应用到字符串时，它们只用字符的 Unicode 编码比较字符串，而不考虑当地的排序规则。以这种方法生成的顺序不一定是正确的。例如，在西班牙语中，其中字符 “ch” 通常作为出现在字母 “c” 和 “d” 之间的字符来排序。
localeCompare() 方法提供的比较字符串的方法，考虑了默认的本地排序规则。ECMAscript 标准并没有规定如何进行本地特定的比较操作，它只规定该函数采用底层操作系统提供的排序规则。
实例
在本例中，我们将用本地特定排序规则对字符串数组进行排序：
var str;
str.sort (function(a,b){return a.localeCompare(b)})


■◆126■找到一个或多个正则表达式的匹配()      正则命令：．匹配■．匹配■找到一个或多个正则表达式的匹配。




定义和用法
match() 方法可在字符串内检索指定的值，或找到一个或多个正则表达式的匹配。
该方法类似 indexOf() 和 lastIndexOf()，但是它返回指定的值，而不是字符串的位置。
语法
stringObject.match(searchvalue)
stringObject.match(regexp)
参数	描述
searchvalue	必需。规定要检索的字符串值。
regexp	必需。规定要匹配的模式的 RegExp 对象。如果该参数不是 RegExp 对象，则需要首先把它传递给 RegExp 构造函数，将其转换为 RegExp 对象。
返回值
存放匹配结果的数组。该数组的内容依赖于 regexp 是否具有全局标志 g。
说明
match() 方法将检索字符串 stringObject，以找到一个或多个与 regexp 匹配的文本。这个方法的行为在很大程度上有赖于 regexp 是否具有标志 g。
如果 regexp 没有标志 g，那么 match() 方法就只能在 stringObject 中执行一次匹配。如果没有找到任何匹配的文本， match() 将返回 null。否则，它将返回一个数组，其中存放了与它找到的匹配文本有关的信息。该数组的第 0 个元素存放的是匹配文本，而其余的元素存放的是与正则表达式的子表达式匹配的文本。除了这些常规的数组元素之外，返回的数组还含有两个对象属性。index 属性声明的是匹配文本的起始字符在 stringObject 中的位置，input 属性声明的是对 stringObject 的引用。
如果 regexp 具有标志 g，则 match() 方法将执行全局检索，找到 stringObject 中的所有匹配子字符串。若没有找到任何匹配的子串，则返回 null。如果找到了一个或多个匹配子串，则返回一个数组。不过全局匹配返回的数组的内容与前者大不相同，它的数组元素中存放的是 stringObject 中所有的匹配子串，而且也没有 index 属性或 input 属性。
注意：在全局检索模式下，match() 即不提供与子表达式匹配的文本的信息，也不声明每个匹配子串的位置。如果您需要这些全局检索的信息，可以使用 RegExp.exec()。
实例
例子 1
在本例中，我们将在 "Hello world!" 中进行不同的检索：
<script type="text/javascript">

var str="Hello world!"
document.write(str.match("world") + "<br />")
document.write(str.match("World") + "<br />")
document.write(str.match("worlld") + "<br />")
document.write(str.match("world!"))

</script>
输出：
world
null
null
world!
例子 2
在本例中，我们将使用全局匹配的正则表达式来检索字符串中的所有数字：
<script type="text/javascript">

var str="1 plus 2 equal 3"
document.write(str.match(/\d+/g))

</script>
输出：
1,2,3
TIY
match() 1
如何使用 match() 来检索一个字符串。
match() 2
如何使用 match() 来检索一个正则表达式的匹配。■◆126■替换与正则表达式匹配的子串()          正则命令：．串替换■．串替换■替换与正则表达式匹配的子串。



定义和用法
replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。
语法
stringObject.replace(regexp/substr,replacement)
参数	描述
regexp/substr	
必需。规定子字符串或要替换的模式的 RegExp 对象。
请注意，如果该值是一个字符串，则将它作为要检索的直接量文本模式，而不是首先被转换为 RegExp 对象。
replacement	必需。一个字符串值。规定了替换文本或生成替换文本的函数。
返回值
一个新的字符串，是用 replacement 替换了 regexp 的第一次匹配或所有匹配之后得到的。
说明
字符串 stringObject 的 replace() 方法执行的是查找并替换的操作。它将在 stringObject 中查找与 regexp 相匹配的子字符串，然后用 replacement 来替换这些子串。如果 regexp 具有全局标志 g，那么 replace() 方法将替换所有匹配的子串。否则，它只替换第一个匹配子串。
replacement 可以是字符串，也可以是函数。如果它是字符串，那么每个匹配都将由字符串替换。但是 replacement 中的 $ 字符具有特定的含义。如下表所示，它说明从模式匹配得到的字符串将用于替换。
字符	替换文本
$1、$2、...、$99	与 regexp 中的第 1 到第 99 个子表达式相匹配的文本。
$&	与 regexp 相匹配的子串。
$`	位于匹配子串左侧的文本。
$'	位于匹配子串右侧的文本。
$$	直接量符号。
注意：ECMAScript v3 规定，replace() 方法的参数 replacement 可以是函数而不是字符串。在这种情况下，每个匹配都调用该函数，它返回的字符串将作为替换文本使用。该函数的第一个参数是匹配模式的字符串。接下来的参数是与模式中的子表达式匹配的字符串，可以有 0 个或多个这样的参数。接下来的参数是一个整数，声明了匹配在 stringObject 中出现的位置。最后一个参数是 stringObject 本身。
实例
例子 1
在本例中，我们将使用 "W3School" 替换字符串中的 "Microsoft"：
<script type="text/javascript">

var str="Visit Microsoft!"
document.write(str.replace(/Microsoft/, "W3School"))

</script>
输出：
Visit W3School!
例子 2
在本例中，我们将执行一次全局替换，每当 "Microsoft" 被找到，它就被替换为 "W3School"：
<script type="text/javascript">

var str="Welcome to Microsoft! "
str=str + "We are proud to announce that Microsoft has "
str=str + "one of the largest Web Developers sites in the world."

document.write(str.replace(/Microsoft/g, "W3School"))

</script>
输出：
Welcome to W3School! We are proud to announce that W3School
has one of the largest Web Developers sites in the world.
例子 3
您可以使用本例提供的代码来确保匹配字符串大写字符的正确：
text = "javascript Tutorial";
text.replace(/javascript/i, "JavaScript");
例子 4
在本例中，我们将把 "Doe, John" 转换为 "John Doe" 的形式：
name = "Doe, John";
name.replace(/(\w+)\s*, \s*(\w+)/, "$2 $1");
例子 5
在本例中，我们将把所有的花引号替换为直引号：
name = '"a", "b"';
name.replace(/"([^"]*)"/g, "'$1'");
例子 6
在本例中，我们将把字符串中所有单词的首字母都转换为大写：
name = 'aaa bbb ccc';
uw=name.replace(/\b\w+\b/g, function(word){
  return word.substring(0,1).toUpperCase()+word.substring(1);}
  );
TIY
replace() 1
如何使用 replace() 来替换字符串中的字符。
replace() 2 - 全局搜索
如何使用 replace() 进行全局替换。
replace() 3 - 对大小写不敏感的搜索
如何使用 replace() 确保大写字母的正确性。
replace() 4
如何使用 replace() 来转换姓名的格式。
replace() 5
如何使用 replace() 来转换引号。
replace() 6
如何使用 replace() 把单词的首字母转换为大写。■◆126■检索与正则表达式相匹配的值()          简化命令：．寻找■．寻找■检索与正则表达式相匹配的值。



定义和用法
search() 方法用于检索字符串中指定的子字符串，或检索与正则表达式相匹配的子字符串。
语法
stringObject.search(regexp)
参数	描述
regexp	
该参数可以是需要在 stringObject 中检索的子串，也可以是需要检索的 RegExp 对象。
注释：要执行忽略大小写的检索，请追加标志 i。
返回值
stringObject 中第一个与 regexp 相匹配的子串的起始位置。
注释：如果没有找到任何匹配的子串，则返回 -1。
说明
search() 方法不执行全局匹配，它将忽略标志 g。它同时忽略 regexp 的 lastIndex 属性，并且总是从字符串的开始进行检索，这意味着它总是返回 stringObject 的第一个匹配的位置。
实例
例子 1
在本例中，我们将检索 "W3School"：
<script type="text/javascript">

var str="Visit W3School!"
document.write(str.search(/W3School/))

</script>
输出：
6
在下面的例子中，无法检索到 w3school（因为 search() 对大小写敏感）。
<script type="text/javascript">

var str="Visit W3School!"
document.write(str.search(/w3school/))

</script>
输出：
-1
例子 2
在本例中，我们将执行一次忽略大小写的检索：
<script type="text/javascript">

var str="Visit W3School!"
document.write(str.search(/w3school/i))

</script>
输出：
6
TIY
search()
如何使用 search() 来检索字符串中指定的子串。
search() 忽略大小写的检索
如何使用 search() 来检索字符串中指定的子串。■◆126■提取字符串片断并返回被提取的部分()    简化命令：．选区■．选区■提取字符串的片断，并在新的字符串中返回被提取的部分。



定义和用法
slice() 方法可提取字符串的某个部分，并以新的字符串返回被提取的部分。
语法
stringObject.slice(start,end)
参数	描述
start	要抽取的片断的起始下标。如果是负数，则该参数规定的是从字符串的尾部开始算起的位置。也就是说，-1 指字符串的最后一个字符，-2 指倒数第二个字符，以此类推。
end	紧接着要抽取的片段的结尾的下标。若未指定此参数，则要提取的子串包括 start 到原字符串结尾的字符串。如果该参数是负数，那么它规定的是从字符串的尾部开始算起的位置。
返回值
一个新的字符串。包括字符串 stringObject 从 start 开始（包括 start）到 end 结束（不包括 end）为止的所有字符。
说明
String 对象的方法 slice()、substring() 和 substr() （不建议使用）都可返回字符串的指定部分。slice() 比 substring() 要灵活一些，因为它允许使用负数作为参数。slice() 与 substr() 有所不同，因为它用两个字符的位置来指定子串，而 substr() 则用字符位置和长度来指定子串。
还要注意的是，String.slice() 与 Array.slice() 相似。
实例
例子 1
在本例中，我们将提取从位置 6 开始的所有字符：
<script type="text/javascript">

var str="Hello happy world!"
document.write(str.slice(6))

</script>
输出：
happy world!
例子 2
在本例中，我们将提取从位置 6 到位置 11 的所有字符：
<script type="text/javascript">

var str="Hello happy world!"
document.write(str.slice(6,11))

</script>
输出：
happy
TIY
slice()
如何使用 slice() 从字符串提取字符。■◆126■使用小字号来显示字符串()              简化命令：．小号■．小号■使用小字号来显示字符串。



定义和用法
small() 方法用于把字符串显示为小号字。
语法
stringObject.small()
实例
在本例中，"Hello world!" 将显示为小号字：
<script type="text/javascript">

var str="Hello world!"
document.write(str.small())

</script>
TIY
small()
如何使用 small() 把字符串显示为小号字。■◆126■把字符串分割为字符串数组()            正则命令：．分割■．分割■把字符串分割为字符串数组。



定义和用法
split() 方法用于把一个字符串分割成字符串数组。
语法
stringObject.split(separator,howmany)
参数	描述
separator	必需。字符串或正则表达式，从该参数指定的地方分割 stringObject。
howmany	可选。该参数可指定返回的数组的最大长度。如果设置了该参数，返回的子串不会多于这个参数指定的数组。如果没有设置该参数，整个字符串都会被分割，不考虑它的长度。
返回值
一个字符串数组。该数组是通过在 separator 指定的边界处将字符串 stringObject 分割成子串创建的。返回的数组中的字串不包括 separator 自身。
但是，如果 separator 是包含子表达式的正则表达式，那么返回的数组中包括与这些子表达式匹配的字串（但不包括与整个正则表达式匹配的文本）。
提示和注释
注释：如果把空字符串 ("") 用作 separator，那么 stringObject 中的每个字符之间都会被分割。
注释：String.split() 执行的操作与 Array.join 执行的操作是相反的。
实例
例子 1
在本例中，我们将按照不同的方式来分割字符串：
<script type="text/javascript">

var str="How are you doing today?"

document.write(str.split(" ") + "<br />")
document.write(str.split("") + "<br />")
document.write(str.split(" ",3))

</script>
输出：
How,are,you,doing,today?
H,o,w, ,a,r,e, ,y,o,u, ,d,o,i,n,g, ,t,o,d,a,y,?
How,are,you
例子 2
在本例中，我们将分割结构更为复杂的字符串：
"2:3:4:5".split(":")	//将返回["2", "3", "4", "5"]
"|a|b|c".split("|")	//将返回["", "a", "b", "c"]
例子 3
使用下面的代码，可以把句子分割成单词：
var words = sentence.split(' ')
或者使用正则表达式作为 separator：
var words = sentence.split(/\s+/)
例子 4
如果您希望把单词分割为字母，或者把字符串分割为字符，可使用下面的代码：
"hello".split("")	//可返回 ["h", "e", "l", "l", "o"]
若只需要返回一部分字符，请使用 howmany 参数：
"hello".split("", 3)	//可返回 ["h", "e", "l"]
TIY
split()
如何使用 split() 来分割字符串。■◆126■使用删除线来显示字符串()              简化命令：．删除线■．删除线■使用删除线来显示字符串。



定义和用法
strike() 方法用于显示加删除线的字符串。
语法
stringObject.strike()
实例
在本例中，"Hello world!" 将被加上一条删除线：
<script type="text/javascript">

var str="Hello world!"
document.write(str.strike())

</script>
TIY
strike()
如何使用 strike() 来显示加了删除线的字符串。■◆126■把字符串显示为下标()                  简化命令：．下标■．下标■把字符串显示为下标。



定义和用法
sub() 方法用于把字符串显示为下标。
语法
stringObject.sub()
实例
在本例中，"Hello world!" 将被显示为下标：
<script type="text/javascript">

var str="Hello world!"
document.write(str.sub())

</script>
TIY
sub()
如何使用 sub() 把字符串显示为下标。■◆126■从起始索引号提取字符串中指定数目字符()简化命令：．提取■．提取■从起始索引号提取字符串中指定数目的字符。



定义和用法
substr() 方法可在字符串中抽取从 start 下标开始的指定数目的字符。
语法
stringObject.substr(start,length)
参数	描述
start	必需。要抽取的子串的起始下标。必须是数值。如果是负数，那么该参数声明从字符串的尾部开始算起的位置。也就是说，-1 指字符串中最后一个字符，-2 指倒数第二个字符，以此类推。
length	可选。子串中的字符数。必须是数值。如果省略了该参数，那么返回从 stringObject 的开始位置到结尾的字串。
返回值
一个新的字符串，包含从 stringObject 的 start（包括 start 所指的字符） 处开始的 length 个字符。如果没有指定 length，那么返回的字符串包含从 start 到 stringObject 的结尾的字符。
提示和注释
注释：substr() 的参数指定的是子串的开始位置和长度，因此它可以替代 substring() 和 slice() 来使用。
重要事项：ECMAscript 没有对该方法进行标准化，因此反对使用它。
重要事项：在 IE 4 中，参数 start 的值无效。在这个 BUG 中，start 规定的是第 0 个字符的位置。在之后的版本中，此 BUG 已被修正。
实例
例子 1
在本例中，我们将使用 substr() 从字符串中提取一些字符：
<script type="text/javascript">

var str="Hello world!"
document.write(str.substr(3))

</script>
输出：
lo world!
例子 2
在本例中，我们将使用 substr() 从字符串中提取一些字符：
<script type="text/javascript">

var str="Hello world!"
document.write(str.substr(3,7))

</script>
输出：
lo worl
TIY
substr()
如何使用 substr() 从字符串提取一些字符。■◆126■提取字符串中两个指定的索引号之间字符()简化命令：．提取二■．提取二■提取字符串中两个指定的索引号之间的字符。



定义和用法
substring() 方法用于提取字符串中介于两个指定下标之间的字符。
语法
stringObject.substring(start,stop)
参数	描述
start	必需。一个非负的整数，规定要提取的子串的第一个字符在 stringObject 中的位置。
stop	
可选。一个非负的整数，比要提取的子串的最后一个字符在 stringObject 中的位置多 1。
如果省略该参数，那么返回的子串会一直到字符串的结尾。
返回值
一个新的字符串，该字符串值包含 stringObject 的一个子字符串，其内容是从 start 处到 stop-1 处的所有字符，其长度为 stop 减 start。
说明
substring() 方法返回的子串包括 start 处的字符，但不包括 stop 处的字符。
如果参数 start 与 stop 相等，那么该方法返回的就是一个空串（即长度为 0 的字符串）。如果 start 比 stop 大，那么该方法在提取子串之前会先交换这两个参数。
提示和注释
重要事项：与 slice() 和 substr() 方法不同的是，substring() 不接受负的参数。
实例
例子 1
在本例中，我们将使用 substring() 从字符串中提取一些字符：
<script type="text/javascript">

var str="Hello world!"
document.write(str.substring(3))

</script>
输出：
lo world!
亲自试一试
例子 2
在本例中，我们将使用 substring() 从字符串中提取一些字符：
<script type="text/javascript">

var str="Hello world!"
document.write(str.substring(3,7))

</script>
输出：
lo w
亲自试一试■◆126■把字符串显示为上标()                  简化命令：．上标■．上标■把字符串显示为上标。



定义和用法
sup() 方法用于把字符串显示为上标。
语法
stringObject.sup()
实例
在本例中，"Hello world!" 将被显示为上标：
<script type="text/javascript">

var str="Hello world!"
document.write(str.sup())

</script>
TIY
sup()
如何使用 sup() 把字符串显示为上标。■◆126■把字符串转换为小写()                  简化命令：．小写■．小写■把字符串转换为小写。



定义和用法
toLocaleLowerCase() 方法用于把字符串转换为小写。
语法
stringObject.toLocaleLowerCase()
返回值
一个新的字符串，在其中 stringObject 的所有大写字符全部被转换为了小写字符。
说明
与 toLowerCase() 不同的是，toLocaleLowerCase() 方法按照本地方式把字符串转换为小写。只有几种语言（如土耳其语）具有地方特有的大小写映射，所有该方法的返回值通常与 toLowerCase() 一样。
实例
在本例中，"Hello world!" 将以小写字母来显示：
<script type="text/javascript">

var str="Hello World!"
document.write(str.toLocaleLowerCase())

</script>■◆126■把字符串转换为大写()                  简化命令：．大写■．大写■把字符串转换为大写。



定义和用法
toLocaleUpperCase() 方法用于把字符串转换为大写。
语法
stringObject.toLocaleUpperCase()
返回值
一个新的字符串，在其中 stringObject 的所有小写字符全部被转换为了大写字符。
说明
与 toUpperCase() 不同的是，toLocaleUpperCase() 方法按照本地方式把字符串转换为大写。只有几种语言（如土耳其语）具有地方特有的大小写映射，所有该方法的返回值通常与 toUpperCase() 一样。
实例
在本例中，"Hello world!" 将以大写字母来显示：
<script type="text/javascript">

var str="Hello World!"
document.write(str.toLocaleUpperCase())

</script>■◆126■把字符串转换为小写()                  简化命令：．小写二■．小写二■把字符串转换为小写。


定义和用法
toLowerCase() 方法用于把字符串转换为小写。
语法
stringObject.toLowerCase()
返回值
一个新的字符串，在其中 stringObject 的所有大写字符全部被转换为了小写字符。
实例
在本例中，"Hello world!" 将以小写字母来显示：
<script type="text/javascript">

var str="Hello World!"
document.write(str.toLowerCase())

</script>
TIY
toLowerCase()
如何使用 toLowerCase() 来把字符串转换成小写。■◆126■把字符串转换为大写()                  简化命令：．大写二■．大写二■把字符串转换为大写。


定义和用法
toUpperCase() 方法用于把字符串转换为大写。
语法
stringObject.toUpperCase()
返回值
一个新的字符串，在其中 stringObject 的所有小写字符全部被转换为了大写字符。
实例
在本例中，"Hello world!" 将以大写字母来显示：
<script type="text/javascript">

var str="Hello World!"
document.write(str.toUpperCase())

</script>
TIY
toUpperCase()
如何使用 toUpperCase() 来把字符串转换成大写。■◆126■代表对象的源代码()                    简化命令：．返回源码■．返回源码■代表对象的源代码。■◆126■返回字符串()                          简化命令：．取串■．取串■返回字符串。



定义和用法
toString() 方法返回字符串。
语法
stringObject.toString()
返回值
stringObject 的原始字符串值。一般不会调用该方法。
抛出
当调用该方法的对象不是 String 时抛出 TypeError 异常。
参阅
array.toString() 、 boolean.toString() 、 date.toString() 、 Number.toString()
array.toLocaleString() 、 date.toLocaleString() 、 Number.toLocaleString()
stringObject.valueOf()
JavaScript String 对象参考手册■◆126■返回某个字符串对象的原始值()          简化命令：．取原值■．取原值■返回某个字符串对象的原始值。



定义和用法
valueOf() 方法可返回 String 对象的原始值。
原始值是由从 String 对象下来的所有对象继承的。
valueOf() 方法通常由 JavaScript 在后台自动进行调用，而不是显式地处于代码中。
语法
stringObject.valueOf()
抛出
当调用该方法的对象不是 String 时抛出 TypeError 异常。■◆8■正则式■正则式■RegExp 对象
RegExp 对象表示正则表达式，它是对字符串执行模式匹配的强大工具。
直接量语法
/pattern/attributes
创建 RegExp 对象的语法：
new RegExp(pattern, attributes);
参数
参数 pattern 是一个字符串，指定了正则表达式的模式或其他正则表达式。
参数 attributes 是一个可选的字符串，包含属性 "g"、"i" 和 "m"，分别用于指定全局匹配、区分大小写的匹配和多行匹配。ECMAScript 标准化之前，不支持 m 属性。如果 pattern 是正则表达式，而不是字符串，则必须省略该参数。
返回值
一个新的 RegExp 对象，具有指定的模式和标志。如果参数 pattern 是正则表达式而不是字符串，那么 RegExp() 构造函数将用与指定的 RegExp 相同的模式和标志创建一个新的 RegExp 对象。
如果不用 new 运算符，而将 RegExp() 作为函数调用，那么它的行为与用 new 运算符调用时一样，只是当 pattern 是正则表达式时，它只返回 pattern，而不再创建一个新的 RegExp 对象。
抛出
SyntaxError - 如果 pattern 不是合法的正则表达式，或 attributes 含有 "g"、"i" 和 "m" 之外的字符，抛出该异常。
TypeError - 如果 pattern 是 RegExp 对象，但没有省略 attributes 参数，抛出该异常。■◆164■RegExp 对象是否具有标志 g。             简化命令：．全局■．全局■RegExp 对象是否具有标志 g。



定义和用法
global 属性用于返回正则表达式是否具有标志 "g"。
它声明了给定的正则表达式是否执行全局匹配。
如果 g 标志被设置，则该属性为 true，否则为 false。
语法
RegExpObject.global
实例
在下面的例子中，我们将查看正则表达式是否具有标志 g：
<script type="text/javascript">
var str = "Visit W3School.com.cn";
var patt1 = new RegExp("W3");

if(patt1.global)
  {
  alert("Global property is set");
  }
else
  {
  alert("Global property is NOT set.");
  }
</script>
TIY
global
如何使用 global 属性来检测正则表达式是否具有标志 g。■◆164■RegExp 对象是否具有标志 i。             简化命令：．是否i■．是否i■RegExp 对象是否具有标志 i。




定义和用法
ignoreCase 属性规定是否设置 "i" 标志。
如果设置了 "i" 标志，则返回 true，否则返回 false。
语法
RegExpObject.ignoreCase
实例
在下面的例子中，我们将查看正则表达式是否具有标志 i：
<script type="text/javascript">
var str = "Visit W3School";
var patt1 = new RegExp("W3");

if(patt1.ignoreCase)
  {
  alert("ignoreCase property is set");
  }
else
  {
  alert("ignoreCase property is NOT set.");
  }
</script>
TIY
ignoreCase
如何使用 ignoreCase 属性来检测正则表达式是否具有标志 i。■◆164■一个整数，标示开始下一次匹配的字符位置。简化命令：．下次位置■．下次位置■一个整数，标示开始下一次匹配的字符位置。



定义和用法
lastIndex 属性用于规定下次匹配的起始位置。
语法
RegExpObject.lastIndex
说明
该属性存放一个整数，它声明的是上一次匹配文本之后的第一个字符的位置。
上次匹配的结果是由方法 RegExp.exec() 和 RegExp.test() 找到的，它们都以 lastIndex 属性所指的位置作为下次检索的起始点。这样，就可以通过反复调用这两个方法来遍历一个字符串中的所有匹配文本。
该属性是可读可写的。只要目标字符串的下一次搜索开始，就可以对它进行设置。当方法 exec() 或 test() 再也找不到可以匹配的文本时，它们会自动把 lastIndex 属性重置为 0。
提示和注释
重要事项：不具有标志 g 和不表示全局模式的 RegExp 对象不能使用 lastIndex 属性。
提示：如果在成功地匹配了某个字符串之后就开始检索另一个新的字符串，需要手动地把这个属性设置为 0。
实例
在下面的例子中，我们将输出匹配完成之后的 lastIndex 属性：
<script type="text/javascript">
var str = "The rain in Spain stays mainly in the plain";
var patt1 = new RegExp("ain", "g");

patt1.test(str)
document.write("Match found. index now at: " + patt1.lastIndex);
</script>
TIY
lastIndex
如何使用 lastIndex 属性来检测从何处开始下一次匹配。■◆164■RegExp 对象是否具有标志 m。             简化命令：．是否m■．是否m■RegExp 对象是否具有标志 m。


定义和用法
multiline 属性用于返回正则表达式是否具有标志 m。
它声明了给定的正则表达式是否以多行模式执行模式匹配。
在这种模式中，如果要检索的字符串中含有换行符，^ 和 $ 锚除了匹配字符串的开头和结尾外还匹配每行的开头和结尾。
例如，模式 /W3School$/im 匹配 "w3school" 和 "W3School\nisgreat"。（\n 是换行符\u000A）。
如果 m 标志被设置，则该属性为 true，否则为 false。
语法
RegExpObject.multiline
实例
在下面的例子中，我们将查看正则表达式是否具有标志 m：
<script type="text/javascript">
var str = "Visit W3School.com.cn";
var patt1 = new RegExp("W3","m");

if(patt1.multiline)
  {
  alert("Multiline property is set");
  }
else
  {
  alert("Multiline property is NOT set.");
  }
</script>
TIY
multiline
如何使用 multiline 属性来检测正则表达式是否具有标志 m。■◆164■正则表达式的源文本。                    简化命令：．源文本■．源文本■正则表达式的源文本。




定义和用法
source 属性用于返回模式匹配所用的文本。
该文本不包括正则表达式直接量使用的定界符，也不包括标志 g、i、m。
语法
RegExpObject.source
实例
在下面的例子中，我们将获得用于模式匹配的文本：
<script type="text/javascript">
var str = "Visit W3School.com.cn";
var patt1 = new RegExp("W3S","g");

document.write("The regular expression is: " + patt1.source);
</script>
TIY
source
如何使用 source 属性来获得用于模式匹配的文本。■◆164■编译正则表达式()                        简化命令：．改变■．改变■编译正则表达式。



定义和用法
compile() 方法用于在脚本执行过程中编译正则表达式。
compile() 方法也可用于改变和重新编译正则表达式。
语法
RegExpObject.compile(regexp,modifier)
参数	描述
regexp	正则表达式。
modifier	规定匹配的类型。"g" 用于全局匹配，"i" 用于区分大小写，"gi" 用于全局区分大小写的匹配。
实例
在字符串中全局搜索 "man"，并用 "person" 替换。然后通过 compile() 方法，改变正则表达式，用 "person" 替换 "man" 或 "woman"，：
<script type="text/javascript">

var str="Every man in the world! Every woman on earth!";

patt=/man/g;
str2=str.replace(patt,"person");
document.write(str2+"<br />");

patt=/(wo)?man/g;
patt.compile(patt);
str2=str.replace(patt,"person");
document.write(str2);

</script>
输出：
Every person in the world! Every woperson on earth!
Every person in the world! Every person on earth!
TIY
TIY
compile()
如何使用 compile() 来改变正则表达式。■◆164■检索字符串指定值返回找到值并确定其位置()简化命令：．正则寻找■．正则寻找■检索字符串中指定的值。返回找到的值，并确定其位置。



定义和用法
exec() 方法用于检索字符串中的正则表达式的匹配。
语法
RegExpObject.exec(string)
参数	描述
string	必需。要检索的字符串。
返回值
返回一个数组，其中存放匹配的结果。如果未找到匹配，则返回值为 null。
说明
exec() 方法的功能非常强大，它是一个通用的方法，而且使用起来也比 test() 方法以及支持正则表达式的 String 对象的方法更为复杂。
如果 exec() 找到了匹配的文本，则返回一个结果数组。否则，返回 null。此数组的第 0 个元素是与正则表达式相匹配的文本，第 1 个元素是与 RegExpObject 的第 1 个子表达式相匹配的文本（如果有的话），第 2 个元素是与 RegExpObject 的第 2 个子表达式相匹配的文本（如果有的话），以此类推。除了数组元素和 length 属性之外，exec() 方法还返回两个属性。index 属性声明的是匹配文本的第一个字符的位置。input 属性则存放的是被检索的字符串 string。我们可以看得出，在调用非全局的 RegExp 对象的 exec() 方法时，返回的数组与调用方法 String.match() 返回的数组是相同的。
但是，当 RegExpObject 是一个全局正则表达式时，exec() 的行为就稍微复杂一些。它会在 RegExpObject 的 lastIndex 属性指定的字符处开始检索字符串 string。当 exec() 找到了与表达式相匹配的文本时，在匹配后，它将把 RegExpObject 的 lastIndex 属性设置为匹配文本的最后一个字符的下一个位置。这就是说，您可以通过反复调用 exec() 方法来遍历字符串中的所有匹配文本。当 exec() 再也找不到匹配的文本时，它将返回 null，并把 lastIndex 属性重置为 0。
提示和注释
重要事项：如果在一个字符串中完成了一次模式匹配之后要开始检索新的字符串，就必须手动地把 lastIndex 属性重置为 0。
提示：请注意，无论 RegExpObject 是否是全局模式，exec() 都会把完整的细节添加到它返回的数组中。这就是 exec() 与 String.match() 的不同之处，后者在全局模式下返回的信息要少得多。因此我们可以这么说，在循环中反复地调用 exec() 方法是唯一一种获得全局模式的完整模式匹配信息的方法。
实例
在本例中，我们将全局检索字符串中的 W3School：
<script type="text/javascript">

var str = "Visit W3School"; 
var patt = new RegExp("W3School","g");
var result;

while ((result = patt.exec(str)) != null)  {
  document.write(result);
  document.write("<br />");
  document.write(patt.lastIndex);
 }
</script>
输出：
W3School
14
亲自试一试
TIY
exec()
如何使用 exec() 来检索字符串。■◆164■检索字符串中指定的值返回true或false()   简化命令：．存在■．存在■检索字符串中指定的值。返回 true 或 false。



定义和用法
test() 方法用于检测一个字符串是否匹配某个模式.
语法
RegExpObject.test(string)
参数	描述
string	必需。要检测的字符串。
返回值
如果字符串 string 中含有与 RegExpObject 匹配的文本，则返回 true，否则返回 false。
说明
调用 RegExp 对象 r 的 test() 方法，并为它传递字符串 s，与这个表示式是等价的：(r.exec(s) != null)。
实例
在下面的例子中，我们将检索 "W3School"：
<script type="text/javascript">
var str = "Visit W3School";
var patt1 = new RegExp("W3School");

var result = patt1.test(str);

document.write("Result: " + result);
</script>
输出：
Result: true
TIY
test()
如何使用 test() 来检索字符串。■◆164■修饰符■修饰符■■◆173■执行对大小写不敏感的匹配。              简化命令：i■i■执行对大小写不敏感的匹配。



定义和用法
i 修饰符用于执行对大小写不敏感的匹配。
语法
new RegExp("regexp","i")
直接量语法：
/regexp/i
浏览器支持
所有主流浏览器都支持 i 修饰符。
实例
对字符串中的 "w3school" 进行不分大小写的搜索：
var str="Visit W3School";
var patt1=/w3school/i;
下面被标记的文本显示了表达式获得匹配的位置：
Visit W3School
      --------
TIY■◆173■执行全局匹配(找所有匹配非在第一匹配止)  简化命令：g■g■执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。



定义和用法
g 修饰符用于执行全局匹配（查找所有匹配而非在找到第一个匹配后停止）。
语法
new RegExp("regexp","g")
直接量语法：
/regexp/g
浏览器支持
所有主流浏览器都支持 g 修饰符。
实例
例子 1
对 "is" 进行全局搜索：
var str="Is this all there is?";
var patt1=/is/g;
下面被标记的文本显示了表达式获得匹配的位置：
Is this all there is?
     --           --
TIY
例子 2
对 "is" 进行全局且大小写不敏感的搜索：
var str="Is this all there is?";
var patt1=/is/gi;
下面被标记的文本显示了表达式获得匹配的位置：
Is this all there is?
--   --           --
TIY■◆173■执行多行匹配。                          简化命令：m■m■执行多行匹配。■◆164■方括号■方括号■方括号用于查找某个范围内的字符■◆177■查找方括号之间的任何字符。              简化命令：[abc]■[abc]■查找方括号之间的任何字符。



定义和用法
[abc] 表达式用于查找方括号之间的任何字符。
方括号内的字符可以是任何字符或字符范围。
语法
new RegExp("[abc]")
直接量语法：
/[abc]/
浏览器支持
所有主流浏览器都支持 [abc] 表达式。
实例
在字符串中对字符范围 [a-h] 进行全局搜索：
var str="Is this all there is?";
var patt1=/[a-h]/g;
下面被标记的文本显示了表达式获得匹配的位置：
Is this all there is?
    -   -    -- -
■◆177■查找任何不在方括号之间的字符。          简化命令：[^abc]■[^abc]■查找任何不在方括号之间的字符。



定义和用法
[^abc] 表达式用于查找任何不在方括号之间的字符。
方括号内的字符可以是任何字符或字符范围。
语法
new RegExp("[^xyz]")
直接量语法：
/[^xyz]/
浏览器支持
所有主流浏览器都支持 [^abc] 表达式。
实例
对不在字符范围 [a-h] 内的字符进行全局搜索：
var str="Is this all there is?";
var patt1=/[^a-h]/g;
下面被标记的文本显示了表达式获得匹配的位置：
Is this all there is?
-- - --  -- -  -  --■◆177■查找任何从 0 至 9 的数字。              简化命令：[0-9]■[0-9]■查找任何从 0 至 9 的数字。■◆177■查找任何从小写 a 到小写 z 的字符。      简化命令：[a-z]■[a-z]■查找任何从小写 a 到小写 z 的字符。■◆177■查找任何从大写 A 到大写 Z 的字符。      简化命令：[A-Z]■[A-Z]■查找任何从大写 A 到大写 Z 的字符。■◆177■查找任何从大写 A 到小写 z 的字符。      简化命令：[A-z]■[A-z]■查找任何从大写 A 到小写 z 的字符。■◆177■查找给定集合内的任何字符。              简化命令：[adgk]■[adgk]■查找给定集合内的任何字符。■◆177■查找给定集合外的任何字符。              简化命令：[^adgk]■[^adgk]■查找给定集合外的任何字符。■◆177■查找任何指定的选项。                    简化命令：(red|blue|green)■(red|blue|green)■查找任何指定的选项。■◆164■元字符■元字符■元字符（Metacharacter）是拥有特殊含义的字符■◆187■查找单个字符，除了换行和行结束符。      简化命令：.■.■查找单个字符，除了换行和行结束符。



定义和用法
. 元字符用于查找单个字符，除了换行和行结束符。
语法
new RegExp("regexp.")
直接量语法：
/regexp./
浏览器支持
所有主流浏览器都支持 . 元字符。
实例
对字符串中的 "h.t" 进行全局搜索：
var str="That's hot!";
var patt1=/h.t/g;
下面被标记的文本显示了表达式获得匹配的位置：
That's hot!
 ---   ---■◆187■查找单词字符。                          简化命令：\w■\w■查找单词字符。



定义和用法
\w 元字符用于查找单词字符。
语法
new RegExp("\w")
直接量语法：
/\w/
浏览器支持
所有主流浏览器都支持 \w 元字符。
实例
对字符串中的单词字符进行全局搜索：
var str="Give 100%!";
var patt1=/\w/g;
下面被标记的文本显示了表达式获得匹配的位置：
Give 100%!
---- ---■◆187■查找非单词字符。                        简化命令：\W■\W■查找非单词字符。



定义和用法
\W 元字符用于查找非单词字符。
单词字符包括：a-z、A-Z、0-9，以及下划线。
语法
new RegExp("\W")
直接量语法：
/\W/
浏览器支持
所有主流浏览器都支持 \W 元字符。
实例
对字符串中的非单词字符进行全局搜索：
var str="Give 100%!";
var patt1=/\W/g;
下面被标记的文本显示了表达式获得匹配的位置：
Give 100%!
        --■◆187■查找数字。                              简化命令：\d■\d■查找数字。



定义和用法
\d 元字符用于查找数字字符。
语法
new RegExp("\d")
直接量语法：
/\d/
浏览器支持
所有主流浏览器都支持 \d 元字符。
实例
对数字进行全局搜索：
var str="Give 100%!";
var patt1=/\d/g;
下面被标记的文本显示了表达式获得匹配的位置：
Give 100%!
     ---■◆187■查找非数字字符。                        简化命令：\D■\D■查找非数字字符。



定义和用法
\D 元字符用于查找非数字字符。
语法
new RegExp("\D")
直接量语法：
/\D/
浏览器支持
所有主流浏览器都支持 \D 元字符。
实例
对字符串中的非数字字符进行全局搜索：
var str="Give 100%!";
var patt1=/\D/g;
下面被标记的文本显示了表达式获得匹配的位置：
Give 100%!
----    --■◆187■查找空白字符。                          简化命令：\s■\s■查找空白字符。



定义和用法
\s 元字符用于查找空白字符。
空白字符可以是：
空格符 (space character)
制表符 (tab character)
回车符 (carriage return character)
换行符 (new line character)
垂直换行符 (vertical tab character)
换页符 (form feed character)
语法
new RegExp("\s")
直接量语法：
/\s/
浏览器支持
所有主流浏览器都支持 \s 元字符。
实例
对字符串中的空白字符进行全局搜索：
var str="Is this all there is?";
var patt1=/\s/g;
下面被标记的文本显示了表达式获得匹配的位置：
Is this all there is?
  -    -   -     -■◆187■查找非空白字符。                        简化命令：\S■\S■查找非空白字符。


定义和用法
\S 元字符用于查找非空白字符。
空白字符可以是：
空格符 (space character)
制表符 (tab character)
回车符 (carriage return character)
换行符 (new line character)
垂直换行符 (vertical tab character)
换页符 (form feed character)
语法
new RegExp("\S")
直接量语法：
/\S/
浏览器支持
所有主流浏览器都支持 \S 元字符。
实例
对字符串中的非空白字符进行全局搜索：
var str="Is this all there is?";
var patt1=/\S/g;
下面被标记的文本显示了表达式获得匹配的位置：
Is this all there is?
-- ---- --- ----- ---■◆187■匹配单词边界。                          简化命令：\b■\b■匹配单词边界。



定义和用法
\b 元字符匹配单词边界。
在单词边界匹配的位置，单词字符后面或前面不与另一个单词字符直接相邻。请注意，匹配的单词边界并不包含在匹配中。换句话说，匹配的单词边界的长度为零。（不要与 [\b] 混淆。）
如果未找到匹配，则返回 null。
提示：\b 元字符通常用于查找位于单词的开头或结尾的匹配。
例子：
/\bm/ 匹配 "moon" 中的 'm'；
/oo\b/ 不匹配 "moon" 中的 'oo'，因为 'oo' 后面的 'n' 是一个单词字符；
/oon\b/ 匹配 "moon" 中的 'oon'，因为 'oon' 位于字符串的末端，后面没有单词字符；
/\w\b\w/ 不匹配任何字符，因为单词字符之后绝不会同时紧跟着非单词字符和单词字符。
亲自试一试
语法
new RegExp("\bregexp")
直接量语法：
/\bregexp/
浏览器支持
所有主流浏览器都支持 \b 元字符。
实例
对字符串中的单词的开头或结尾进行 "W3" 的全局搜索：
var str="Visit W3School";
var patt1=/\bW3/g;
下面被标记的文本显示了表达式获得匹配的位置：
Visit W3School
      --■◆187■匹配非单词边界。                        简化命令：\B■\B■匹配非单词边界。



定义和用法
\B 元字符匹配非单词边界。匹配位置的上一个和下一个字符的类型是相同的：即必须同时是单词，或必须同时是非单词字符。字符串的开头和结尾处被视为非单词字符。
如果未找到匹配，则返回 null。
提示：\B 元字符通常用于查找不处在单词的开头或结尾的匹配。
例如：/\B../ 匹配 "noonday" 中的 'oo'，而 /y\B./ 匹配 "possibly yesterday." 中的 'ye'。
亲自试一试
语法
new RegExp("\Bregexp")
直接量语法：
/\Bregexp/
浏览器支持
所有主流浏览器都支持 \B 元字符。
实例
对字符串中不位于单词开头或结尾的 "School" 进行全局搜索：
var str="Visit W3School";
var patt1=/\BSchool/g;
下面被标记的文本显示了表达式获得匹配的位置：
Visit W3School
        ------■◆187■查找 NUL 字符。                         简化命令：\0■\0■查找 NUL 字符。■◆187■查找换行符。                            简化命令：\n■\n■查找换行符。




定义和用法
\n 元字符用于查找换行符。
\n 返回换行符被找到的位置。如果未找到匹配，则返回 -1。
语法
new RegExp("\n")
直接量语法：
/\n/
浏览器支持
所有主流浏览器都支持 \n 元字符。
实例
搜索字符串中的换行字符：
var str="Visit W3School.\nLearn Javascript.";
var patt1=/\n/;
下面被标记的文本显示了表达式获得匹配的位置：
Visit W3School.\nLearn Javascript.
               --■◆187■查找换页符。                            简化命令：\f■\f■查找换页符。■◆187■查找回车符。                            简化命令：\r■\r■查找回车符。■◆187■查找制表符。                            简化命令：\t■\t■查找制表符。■◆187■查找垂直制表符。                        简化命令：\v■\v■查找垂直制表符。■◆187■查找以八进制数 xxx 规定的字符。         简化命令：\xxx■\xxx■查找以八进制数 xxx 规定的字符。



定义和用法
\xxx 元字符用于查找以八进制数 xxx 规定的字符。
如果未找到匹配，则返回 null。
语法
new RegExp("\xxx")
直接量语法：
/\xxx/
浏览器支持
所有主流浏览器都支持 \xxx 元字符。
实例
对字符串中的八进制 127 (W) 进行全局搜索：
var str="Visit W3School. Hello World!";
var patt1=/\127/g;
下面被标记的文本显示了表达式获得匹配的位置：
Visit W3School. Hello World!
      -               -■◆187■查找以十六进制数 dd 规定的字符。        简化命令：\xdd■\xdd■查找以十六进制数 dd 规定的字符。



定义和用法
\xdd 元字符查找以十六进制数 dd 规定的字符。
如果未找到匹配，则返回 null。
语法
new RegExp("\xdd")
直接量语法：
/\xdd/
浏览器支持
所有主流浏览器都支持 \xdd 元字符。
实例
对字符串中的十六进制 57 (W) 进行全局搜索：
var str="Visit W3School. Hello World!";
var patt1=/\x57/g;
下面被标记的文本显示了表达式获得匹配的位置：
Visit W3School. Hello World!
      -               -■◆187■查找以十六进制数xxxx规定的Unicode字符。 简化命令：\uxxxx■\uxxxx■查找以十六进制数 xxxx 规定的 Unicode 字符。



定义和用法
\uxxxx 元字符用于查找以十六进制数 xxxx 规定的 Unicode 字符。
如果未找到匹配，则返回 null。
语法
new RegExp("\uxxxx")
直接量语法：
/\uxxxx/
浏览器支持
所有主流浏览器都支持 \uxxxx 元字符。
实例
对字符串中的十六进制 0057 (W) 进行全局搜索：
var str="Visit W3School. Hello World!";
var patt1=/\u0057/g;
下面被标记的文本显示了表达式获得匹配的位置：
Visit W3School. Hello World!
      -               -■◆164■量词■量词■■◆206■匹配任何包含至少一个 n 的字符串。       简化命令：n+■n+■匹配任何包含至少一个 n 的字符串。




定义和用法
n+ 量词匹配包含至少一个 n 的任何字符串。
语法
new RegExp("n+")
直接量语法：
/n+/
浏览器支持
所有主流浏览器都支持 + 量词。
实例
例子 1
对至少一个 "o" 进行全局搜索：
var str="Hellooo World! Hello W3School!";
var patt1=/o+/g;
下面被标记的文本显示了表达式获得匹配的位置：
Hellooo World! Hello W3School!
    ---  -         -      --
TIY
例子 2
对至少一个单词字符进行全局搜索：
var str="Hello World! Hello W3School!";
var patt1=/\w+/g;
下面被标记的文本显示了表达式获得匹配的位置：
Hello World! Hello W3School!
----- -----  ----- --------■◆206■匹配任何包含零个或多个 n 的字符串。     简化命令：n*■n*■匹配任何包含零个或多个 n 的字符串。

定义和用法
n+ 量词匹配包含零个或多个 n 的任何字符串。
语法
new RegExp("n*")
直接量语法：
/n*/
浏览器支持
所有主流浏览器都支持 * 量词。
实例
例子 1
对 "l" 进行全局搜索，包括其后紧跟的一个或多个 "o"：
var str="Hellooo World! Hello W3School!";
var patt1=/lo*/g;
下面被标记的文本显示了表达式获得匹配的位置：
Hellooo World! Hello W3School!
  -----    -     ---        -
TIY
例子 2
对 "1" 进行全局搜索，包括其后紧跟的一个或多个 "0"：
var str="1, 100 or 1000?";
var patt1=/10*/g;
下面被标记的文本显示了表达式获得匹配的位置：
1, 100 or 1000?
-  ---    ----■◆206■匹配任何包含零个或一个 n 的字符串。     简化命令：n?■n?■匹配任何包含零个或一个 n 的字符串。



定义和用法
n? 量词匹配任何包含零个或一个 n 的字符串。
语法
new RegExp("n?")
直接量语法：
/n?/
浏览器支持
所有主流浏览器都支持 ? 量词。
实例
对 "1" 进行全局搜索，包括其后紧跟的零个或一个 "0"：
var str="1, 100 or 1000?";
var patt1=/10?/g;
下面被标记的文本显示了表达式获得匹配的位置：
1, 100 or 1000?
-  --     --■◆206■匹配包含 X 个 n 的序列的字符串。        简化命令：n{X}■n{X}■匹配包含 X 个 n 的序列的字符串。




定义和用法
n{X,} 量词匹配包含 X 个 n 的序列的字符串。
X 必须是数字。
语法
new RegExp("n{X}")
直接量语法：
/n{X}/
浏览器支持
所有主流浏览器都支持 {X} 量词。
实例
对包含四位数字序列的子串进行全局搜索：
var str="100, 1000 or 10000?";
var patt1=/\d{4}/g;
下面被标记的文本显示了表达式获得匹配的位置：
100, 1000 or 10000?
     ----    ----■◆206■匹配包含 X 或 Y 个 n 的序列的字符串。   简化命令：n{X,Y}■n{X,Y}■匹配包含 X 或 Y 个 n 的序列的字符串。



定义和用法
n{X,Y} 量词匹配包含 X 或 Y 个 n 的序列的字符串。
X 和 Y 必须是数字。
语法
new RegExp("n{X,Y}")
直接量语法：
/n{X,Y}/
浏览器支持
所有主流浏览器都支持 {X,Y} 量词。
实例
对包含三位或四位数字序列的子串进行全局搜索：
var str="100, 1000 or 10000?";
var patt1=/\d{3,4}/g;
下面被标记的文本显示了表达式获得匹配的位置：
100, 1000 or 10000?
---  ----    ----■◆206■匹配包含至少 X 个 n 的序列的字符串。    简化命令：n{X,}■n{X,}■匹配包含至少 X 个 n 的序列的字符串。




定义和用法
n{X,} 量词匹配包含至少 X 个 n 的序列的字符串。
X 必须是数字。
语法
new RegExp("n{X,}")
直接量语法：
/n{X,}/
浏览器支持
所有主流浏览器都支持 {X,} 量词。
实例
对包含至少三位数字序列的子串进行全局搜索：
var str="100, 1000 or 10000?";
var patt1=/\d{3,}/g;
下面被标记的文本显示了表达式获得匹配的位置：
100, 1000 or 10000?
---  ----    -----■◆206■匹配任何结尾为 n 的字符串。             简化命令：n$■n$■匹配任何结尾为 n 的字符串。



n$ 量词匹配任何结尾为 n 的字符串。
语法
new RegExp("n$")
直接量语法：
/n$/
浏览器支持
所有主流浏览器都支持 $ 量词。
实例
对字符串结尾的 "is" 进行全局搜索：
var str="Is this his";
var patt1=/is$/g;
下面被标记的文本显示了表达式获得匹配的位置：
Is this his
         --■◆206■匹配任何开头为 n 的字符串。             简化命令：^n■^n■匹配任何开头为 n 的字符串。




定义和用法
n^ 量词匹配任何开头为 n 的字符串。
语法
new RegExp("^n")
直接量语法：
/^n/
浏览器支持
所有主流浏览器都支持 ^ 量词。
实例
对字符串开头的 "is" 进行全局搜索：
var str="Is this his";
var patt1=/^Is/g;
下面被标记的文本显示了表达式获得匹配的位置：
Is this his
--■◆206■匹配任何其后紧接指定字符串 n 的字符串。 简化命令：?=n■?=n■匹配任何其后紧接指定字符串 n 的字符串。



定义和用法
?=n 量词匹配任何其后紧接指定字符串 n 的字符串。
语法
new RegExp("regexp(?=n)")
直接量语法：
/regexp(?=n)/
浏览器支持
所有主流浏览器都支持 ?= 量词。
实例
对其后紧跟 "all" 的 "is" 进行全局搜索：
var str="Is this all there is";
var patt1=/is(?= all)/g;
下面被标记的文本显示了表达式获得匹配的位置：
Is this all there is
     --■◆206■匹配任何其后没紧接指定字符串n的字符串。 简化命令：?!n■?!n■匹配任何其后没有紧接指定字符串 n 的字符串。



定义和用法
?!n 量词匹配其后没有紧接指定字符串 n 的任何字符串。
语法
new RegExp("regexp(?!n)")
直接量语法：
/regexp(?!n)/
浏览器支持
所有主流浏览器都支持 ?! 量词。
实例
对其后没有紧跟 "all" 的 "is" 进行全局搜索：
var str="Is this all there is";
var patt1=/is(?! all)/gi;
下面被标记的文本显示了表达式获得匹配的位置：
Is this all there is
--                --■◆8■全局■全局■全局对象描述
全局对象是预定义的对象，作为 JavaScript 的全局函数和全局属性的占位符。通过使用全局对象，可以访问所有其他所有预定义的对象、函数和属性。全局对象不是任何对象的属性，所以它没有名称。
在顶层 JavaScript 代码中，可以用关键字 this 引用全局对象。但通常不必用这种方式引用全局对象，因为全局对象是作用域链的头，这意味着所有非限定性的变量和函数名都会作为该对象的属性来查询。例如，当JavaScript 代码引用 parseInt() 函数时，它引用的是全局对象的 parseInt 属性。全局对象是作用域链的头，还意味着在顶层 JavaScript 代码中声明的所有变量都将成为全局对象的属性。
全局对象只是一个对象，而不是类。既没有构造函数，也无法实例化一个新的全局对象。
在 JavaScript 代码嵌入一个特殊环境中时，全局对象通常具有环境特定的属性。实际上，ECMAScript 标准没有规定全局对象的类型，JavaScript 的实现或嵌入的 JavaScript 都可以把任意类型的对象作为全局对象，只要该对象定义了这里列出的基本属性和函数。例如，在允许通过 LiveConnect 或相关的技术来脚本化 Java 的 JavaScript 实现中，全局对象被赋予了这里列出的 java 和 Package 属性以及 getClass() 方法。而在客户端 JavaScript 中，全局对象就是 Window 对象，表示允许 JavaScript 代码的 Web 浏览器窗口。
例子
在 JavaScript 核心语言中，全局对象的预定义属性都是不可枚举的，所有可以用 for/in 循环列出所有隐式或显式声明的全局变量，如下所示：
var variables = "";

for (var name in this) 
{
variables += name + "<br />";
}

document.write(variables);■◆217■代表正的无穷大的数值。                  简化命令：．无穷大■．无穷大■代表正的无穷大的数值。



定义和用法
Infinity 属性用于存放表示正无穷大的数值。
语法
Infinity
说明
无法使用 for/in 循环来枚举 Infinity 属性，也不能用 delete 运算符来删除它。
Infinity 不是常量，可以把它设置为其他值。
实例
在本例中，我们将展示当一个数超出了 infinity 的限制发生的情况：
<script type="text/javascript">

var t1=1.7976931348623157E+10308
document.write(t1)

document.write("<br />")

var t2=-1.7976931348623157E+10308
document.write(t2)

</script>
输出：
Infinity
-Infinity
TIY
Infinity
如果一个数超出了 infinity 的限制会发生什么呢？■◆217■代表 java.* 包层级的一个 JavaPackage。  简化命令：．java■．java■代表 java.* 包层级的一个 JavaPackage。



定义和用法
表示 java.* 包层级的 JavaPackage。
语法
java
说明
在包含了 LiveConnect 或其他用于脚本化 Java 的技术的 JavaScript 实现中，全局 java 属性就是一个 JavaPackage 对象，它表示 java.* 包层级。这个属性的存在意味着像 java.util 这样的一个 JavaScript 表示式引用的是 java.util 包。对于不符合 java.* 层级的 Java 包，请参阅全局 Packages 属性。■◆217■指示某个值是不是数字值。                简化命令：．非数■．非数■指示某个值是不是数字值。




定义和用法
NaN 属性用于引用特殊的非数字值。
语法
NaN
说明
无法使用 for/in 循环来枚举 NaN 属性，也不能用 delete 运算符来删除它。
NaN 不是常量，可以把它设置为其他值。
提示和注释
提示：请使用 isNaN() 来判断一个值是否是数字。原因是 NaN 与所有值都不相等，包括它自己。
实例
在本例中，我们将展示当一个数超出了 infinity 的限制发生的情况：
<script type="text/javascript">

var test1="300"
var test2="Hello World!"

document.write(Number(test1)+ "<br />")
document.write(Number(test2)+ "<br />")

document.write(isNaN(test1)+ "<br />")
document.write(isNaN(test2))

</script>
输出：
300
NaN
false
true
TIY
NaN
如何通过 NaN 来判断一个值。■◆217■根 JavaPackage 对象。                   简化命令：．Packages■．Packages■根 JavaPackage 对象。


定义和用法
根 JavaPackage。
语法
Packages
说明
在包含了 LiveConnect 或其他用于脚本化 Java 的技术的 JavaScript 实现中，全局 Packages 属性就是一个 JavaPackage 对象，其属性是 Java 解释器所知道的所有包的根。例如，Packages.javax.swing 引用的是 Java 包 javax.swing。全局属性 java 是 Packages.java 的简写。■◆217■指示未定义的值。                        简化命令：．未定义■．未定义■指示未定义的值。


定义和用法
undefined 属性用于存放 JavaScript 的 undefined 值。
语法
undefined
说明
无法使用 for/in 循环来枚举 undefined 属性，也不能用 delete 运算符来删除它。
undefined 不是常量，可以把它设置为其他值。
当尝试读取不存在的对象属性时也会返回 undefined。
提示和注释
提示：只能用 === 运算来测试某个值是否是未定义的，因为 == 运算符认为 undefined 值等价于 null。
注释：null 表示无值，而 undefined 表示一个未声明的变量，或已声明但没有赋值的变量，或一个并不存在的对象属性。
实例
在本例中，我们将检测两个变量中未定义的一个：
<script type="text/javascript">

var t1=""
var t2

if (t1===undefined) {document.write("t1 is undefined")}
if (t2===undefined) {document.write("t2 is undefined")}

</script>
输出：
t2 is undefined
TIY
undefined
如何检测两个变量中未定义的一个。■◆217■解码某个编码的 URI()                    简化命令：．解码URI■．解码URI■解码某个编码的 URI。


定义和用法
decodeURI() 函数可对 encodeURI() 函数编码过的 URI 进行解码。
语法
decodeURI(URIstring)
参数	描述
URIstring	必需。一个字符串，含有要解码的 URI 或其他要解码的文本。
返回值
URIstring 的副本，其中的十六进制转义序列将被它们表示的字符替换。
实例
在本例中，我们将使用 decodeURI() 对一个编码后的 URI 进行解码：
<script type="text/javascript">

var test1="http://www.w3school.com.cn/My first/"

document.write(encodeURI(test1)+ "<br />")
document.write(decodeURI(test1))

</script>
输出：
http://www.w3school.com.cn/My%20first/
http://www.w3school.com.cn/My first/
TIY
decodeURI()
如何使用 decodeURI() 对编码后的 URI 进行解码。■◆217■解码一个编码的 URI 组件()               简化命令：．解码组件■．解码组件■解码一个编码的 URI 组件。



定义和用法
decodeURIComponent() 函数可对 encodeURIComponent() 函数编码的 URI 进行解码。
语法
decodeURIComponent(URIstring)
参数	描述
URIstring	必需。一个字符串，含有编码 URI 组件或其他要解码的文本。
返回值
URIstring 的副本，其中的十六进制转义序列将被它们表示的字符替换。
实例
在本例中，我们将使用 decodeURIComponent() 对编码后的 URI 进行解码：
<script type="text/javascript">

var test1="http://www.w3school.com.cn/My first/"

document.write(encodeURIComponent(test1)+ "<br />")
document.write(decodeURIComponent(test1))

</script>
输出：
http%3A%2F%2Fwww.w3school.com.cn%2FMy%20first%2F
http://www.w3school.com.cn/My first/
TIY
decodeURIComponent()
如何使用 decodeURIComponent() 对编码后的 URI 进行解码。■◆217■把字符串编码为 URI()                    简化命令：．编码URI■．编码URI■把字符串编码为 URI。


定义和用法
encodeURI() 函数可把字符串作为 URI 进行编码。
语法
encodeURI(URIstring)
参数	描述
URIstring	必需。一个字符串，含有 URI 或其他要编码的文本。
返回值
URIstring 的副本，其中的某些字符将被十六进制的转义序列进行替换。
说明
该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ' ( ) 。
该方法的目的是对 URI 进行完整的编码，因此对以下在 URI 中具有特殊含义的 ASCII 标点符号，encodeURI() 函数是不会进行转义的：;/?:@&=+$,#
提示和注释
提示：如果 URI 组件中含有分隔符，比如 ? 和 #，则应当使用 encodeURIComponent() 方法分别对各组件进行编码。
实例
在本例中，我们将使用 encodeURI() 对 URI 进行编码：
<script type="text/javascript">

document.write(encodeURI("http://www.w3school.com.cn")+ "<br />")
document.write(encodeURI("http://www.w3school.com.cn/My first/"))
document.write(encodeURI(",/?:@&=+$#"))

</script>
输出：
http://www.w3school.com.cn
http://www.w3school.com.cn/My%20first/
,/?:@&=+$#■◆217■把字符串编码为 URI 组件()               简化命令：．编码组件■．编码组件■把字符串编码为 URI 组件。


定义和用法
encodeURIComponent() 函数可把字符串作为 URI 组件进行编码。
语法
encodeURIComponent(URIstring)
参数	描述
URIstring	必需。一个字符串，含有 URI 组件或其他要编码的文本。
返回值
URIstring 的副本，其中的某些字符将被十六进制的转义序列进行替换。
说明
该方法不会对 ASCII 字母和数字进行编码，也不会对这些 ASCII 标点符号进行编码： - _ . ! ~ * ' ( ) 。
其他字符（比如 ：;/?:@&=+$,# 这些用于分隔 URI 组件的标点符号），都是由一个或多个十六进制的转义序列替换的。
提示和注释
提示：请注意 encodeURIComponent() 函数 与 encodeURI() 函数的区别之处，前者假定它的参数是 URI 的一部分（比如协议、主机名、路径或查询字符串）。因此 encodeURIComponent() 函数将转义用于分隔 URI 各个部分的标点符号。
实例
在本例中，我们将使用 encodeURIComponent() 对 URI 进行编码：
<script type="text/javascript">

document.write(encodeURIComponent("http://www.w3school.com.cn"))
document.write("<br />")
document.write(encodeURIComponent("http://www.w3school.com.cn/p 1/"))
document.write("<br />")
document.write(encodeURIComponent(",/?:@&=+$#"))

</script>
输出：
http%3A%2F%2Fwww.w3school.com.cn
http%3A%2F%2Fwww.w3school.com.cn%2Fp%201%2F
%2C%2F%3F%3A%40%26%3D%2B%24%23
TIY
encodeURIComponent()
如何使用 encodeURIComponent() 来编码不同的 URI。■◆217■对字符串进行编码()                      简化命令：．串编码■．串编码■对字符串进行编码。


定义和用法
escape() 函数可对字符串进行编码，这样就可以在所有的计算机上读取该字符串。
语法
escape(string)
参数	描述
string	必需。要被转义或编码的字符串。
返回值
已编码的 string 的副本。其中某些字符被替换成了十六进制的转义序列。
说明
该方法不会对 ASCII 字母和数字进行编码，也不会对下面这些 ASCII 标点符号进行编码： * @ - _ + . / 。其他所有的字符都会被转义序列替换。
提示和注释
提示：可以使用 unescape() 对 escape() 编码的字符串进行解码。
注释：ECMAScript v3 反对使用该方法，应用使用 decodeURI() 和 decodeURIComponent() 替代它。
实例
在本例中，我们将使用 escape() 来编码字符串：
<script type="text/javascript">

document.write(escape("Visit W3School!") + "<br />")
document.write(escape("?!=()#%&"))

</script>
输出：
Visit%20W3School%21
%3F%21%3D%28%29%23%25%26■◆217■计算JavaScript字符串并作为代码来执行()  简化命令：．串执行■．串执行■计算 JavaScript 字符串，并把它作为脚本代码来执行。



定义和用法
eval() 函数可计算某个字符串，并执行其中的的 JavaScript 代码。
语法
eval(string)
参数	描述
string	必需。要计算的字符串，其中含有要计算的 JavaScript 表达式或要执行的语句。
返回值
通过计算 string 得到的值（如果有的话）。
说明
该方法只接受原始字符串作为参数，如果 string 参数不是原始字符串，那么该方法将不作任何改变地返回。因此请不要为 eval() 函数传递 String 对象来作为参数。
如果试图覆盖 eval 属性或把 eval() 方法赋予另一个属性，并通过该属性调用它，则 ECMAScript 实现允许抛出一个 EvalError 异常。
抛出
如果参数中没有合法的表达式和语句，则抛出 SyntaxError 异常。
如果非法调用 eval()，则抛出 EvalError 异常。
如果传递给 eval() 的 Javascript 代码生成了一个异常，eval() 将把该异常传递给调用者。
提示和注释
提示：虽然 eval() 的功能非常强大，但在实际使用中用到它的情况并不多。
实例
例子 1
在本例中，我们将在几个字符串上运用 eval()，并看看返回的结果：
<script type="text/javascript">

eval("x=10;y=20;document.write(x*y)")

document.write(eval("2+2"))

var x=10
document.write(eval(x+17))

</script>
输出：
200
4
27■◆217■返回一个 JavaObject 的 JavaClass()      简化命令：．java类■．java类■返回一个 JavaObject 的 JavaClass。


定义和用法
getClass() 函数可返回一个 JavaObject 的 JavaClass。
语法
getClass(javaobj)
参数	描述
javaobj	一个 JavaObject 对象。
返回值
javaobj 的 JavaClass 对象。
说明
该函数可接受一个 JavaObject 对象作为其参数，并返回该对象的 JavaClass，即返回 JavaClass 对象。该 JavaClass 对象表示 Java 对象的 Java 类，而这个 Java 对象所表示的 Java 类是由 JavaObject 指定的。
习惯用法
请不要把 JavaScript 的 getClass() 函数与所有 Java 对象的 getClass 方法混淆在一起。也不要把 JavaScript 的 JavaClass 对象与 Java java.lang.Class 类混淆了。
请看下面这行代码，它可创建一个 Java Rectangle 对象：
var obj = new java.awt.Rectangle();
obj 是一个保存了 JavaObject 的 JavaScript 变量。我们可以调用 JavaScript 函数 getClass() 返回一个 JavaClass 对象，该 JavaClass 对象表示 java.awt.Rectangle 类：
var cls = getClass(obj);
而调用 Java getClass() 的方式有所不同，且执行完全不同的功能：
cls = obj.getClass();
在执行了上面这行代码后，cls 是表示 java.lang.class 对象的一个 Java Object。这个 java.lang.class 对象是一个 Java 对象，它是 java.awt.Rectangle 类的一个 Java 表示。
最后，对于任何的 JavaObject obj，您do会看到下面的表示式始终为 true：
(getClass(obj.getClass()) == java.lang.Class)■◆217■检查某个值是否为有穷大的数()            简化命令：．有限数■．有限数■检查某个值是否为有穷大的数。


定义和用法
isFinite() 函数用于检查其参数是否是无穷大。
语法
isFinite(number)
参数	描述
number	必需。要检测的数字。
返回值
如果 number 是有限数字（或可转换为有限数字），那么返回 true。否则，如果 number 是 NaN（非数字），或者是正、负无穷大的数，则返回 false。
实例
在本例中，我们将使用 isFinite() 在检测无穷数：
<script type="text/javascript">

document.write(isFinite(123)+ "<br />")
document.write(isFinite(-1.23)+ "<br />")
document.write(isFinite(5-2)+ "<br />")
document.write(isFinite(0)+ "<br />")
document.write(isFinite("Hello")+ "<br />")
document.write(isFinite("2005/12/12")+ "<br />")

</script>
输出：
true
true
true
true
false
false
TIY
isFinite()
如何使用 isFinite()。■◆217■检查某个值是否是数字()                  简化命令：．非数■．非数■检查某个值是否是数字。


定义和用法
isNaN() 函数用于检查其参数是否是非数字值。
语法
isNaN(x)
参数	描述
x	必需。要检测的值。
返回值
如果 x 是特殊的非数字值 NaN（或者能被转换为这样的值），返回的值就是 true。如果 x 是其他值,则返回 false。
说明
isNaN() 函数可用于判断其参数是否是 NaN，该值表示一个非法的数字（比如被 0 除后得到的结果）。
如果把 NaN 与任何值（包括其自身）相比得到的结果均是 false，所以要判断某个值是否是 NaN，不能使用 == 或 === 运算符。正因为如此，isNaN() 函数是必需的。
提示和注释
提示：isNaN() 函数通常用于检测 parseFloat() 和 parseInt() 的结果，以判断它们表示的是否是合法的数字。当然也可以用 isNaN() 函数来检测算数错误，比如用 0 作除数的情况。
实例
检查数字是否非法：
<script>

document.write(isNaN(123));
document.write(isNaN(-1.23));
document.write(isNaN(5-2));
document.write(isNaN(0));
document.write(isNaN("Hello"));
document.write(isNaN("2005/12/12"));

</script>
输出：
false
false
false
false
true
true
亲自试一试■◆217■把对象的值转换为数字()                  简化命令：．取数■．取数■把对象的值转换为数字。


定义和用法
Number() 函数把对象的值转换为数字。
语法
Number(object)
参数	描述
object	必需。JavaScript 对象。
返回值
如果参数是 Date 对象，Number() 返回从 1970 年 1 月 1 日至今的毫秒数。
如果对象的值无法转换为数字，那么 Number() 函数返回 NaN。
实例
在本例中，我们将尝试把不同的对象转换为数字：
<script type="text/javascript">

var test1= new Boolean(true);
var test2= new Boolean(false);
var test3= new Date();
var test4= new String("999");
var test5= new String("999 888");

document.write(Number(test1)+ "<br />");
document.write(Number(test2)+ "<br />");
document.write(Number(test3)+ "<br />");
document.write(Number(test4)+ "<br />");
document.write(Number(test5)+ "<br />");

</script>
输出：
1
0
1256657776588
999
NaN
TIY
Number()
如何使用 Number() 把对象的值转换为数字。■◆217■解析一个字符串并返回一个浮点数()        简化命令：．取浮数■．取浮数■解析一个字符串并返回一个浮点数。



定义和用法
parseFloat() 函数可解析一个字符串，并返回一个浮点数。
该函数指定字符串中的首个字符是否是数字。如果是，则对字符串进行解析，直到到达数字的末端为止，然后以数字返回该数字，而不是作为字符串。
语法
parseFloat(string)
参数	描述
string	必需。要被解析的字符串。
详细说明
parseFloat 是全局函数，不属于任何对象。
parseFloat 将它的字符串参数解析成为浮点数并返回。如果在解析过程中遇到了正负号（+ 或 -）、数字 (0-9)、小数点，或者科学记数法中的指数（e 或 E）以外的字符，则它会忽略该字符以及之后的所有字符，返回当前已经解析到的浮点数。同时参数字符串首位的空白符会被忽略。
如果参数字符串的第一个字符不能被解析成为数字，则 parseFloat 返回 NaN。
提示：您可以通过调用 isNaN 函数来判断 parseFloat 的返回结果是否是 NaN。如果让 NaN 作为了任意数学运算的操作数，则运算结果必定也是 NaN。
返回值
返回解析后的数字。
提示和注释
注释：开头和结尾的空格是允许的。
提示：如果字符串的第一个字符不能被转换为数字，那么 parseFloat() 会返回 NaN。
提示：如果只想解析数字的整数部分，请使用 parseInt() 方法。
实例
例子 1
在本例中，我们将使用 parseFloat() 来解析不同的字符串：
<script type="text/javascript">

document.write(parseFloat("10")) 
document.write(parseFloat("10.00")) 
document.write(parseFloat("10.33")) 
document.write(parseFloat("34 45 66")) 
document.write(parseFloat(" 60 ")) 
document.write(parseFloat("40 years"))
document.write(parseFloat("He was 40"))

</script>
输出：
10
10
10.33
34
60
40
NaN
亲自试一试
例子 2
下面的例子都返回 3.14：
<script type="text/javascript">

document.write(parseFloat("3.14")) 
document.write(parseFloat("314e-2")) 
document.write(parseFloat("0.0314E+2")) 
document.write(parseFloat("3.14more non-digit characters")) 

</script>
输出：
3.14
亲自试一试
例子 3
下面的例子将返回 NaN：
<script type="text/javascript">

document.write(parseFloat("FF2")) 

</script>
输出：
NaN
亲自试一试
JavaScript 全局对象参考手册■◆217■解析一个字符串并返回一个整数()          简化命令：．取整数■．取整数■解析一个字符串并返回一个整数。


定义和用法
parseInt() 函数可解析一个字符串，并返回一个整数。
语法
parseInt(string, radix)
参数	描述
string	必需。要被解析的字符串。
radix	
可选。表示要解析的数字的基数。该值介于 2 ~ 36 之间。
如果省略该参数或其值为 0，则数字将以 10 为基础来解析。如果它以 “0x” 或 “0X” 开头，将以 16 为基数。
如果该参数小于 2 或者大于 36，则 parseInt() 将返回 NaN。
返回值
返回解析后的数字。
说明
当参数 radix 的值为 0，或没有设置该参数时，parseInt() 会根据 string 来判断数字的基数。
举例，如果 string 以 "0x" 开头，parseInt() 会把 string 的其余部分解析为十六进制的整数。如果 string 以 0 开头，那么 ECMAScript v3 允许 parseInt() 的一个实现把其后的字符解析为八进制或十六进制的数字。如果 string 以 1 ~ 9 的数字开头，parseInt() 将把它解析为十进制的整数。
提示和注释
注释：只有字符串中的第一个数字会被返回。
注释：开头和结尾的空格是允许的。
提示：如果字符串的第一个字符不能被转换为数字，那么 parseFloat() 会返回 NaN。
实例
在本例中，我们将使用 parseInt() 来解析不同的字符串：
parseInt("10");			//返回 10
parseInt("19",10);		//返回 19 (10+9)
parseInt("11",2);		//返回 3 (2+1)
parseInt("17",8);		//返回 15 (8+7)
parseInt("1f",16);		//返回 31 (16+15)
parseInt("010");		//未定：返回 10 或 8
TIY
parseInt()
如何使用 parseInt() 来解析不同的字符串。
JavaScript 全局对象参考手册
课外书
如需更多有关类型转换的知识，请阅读 JavaScript 高级教程中的相关内容：
ECMAScript 类型转换■◆217■把对象的值转换为字符串()                简化命令：．对象串■．对象串■把对象的值转换为字符串。


定义和用法
String() 函数把对象的值转换为字符串。
语法
String(object)
参数	描述
object	必需。JavaScript 对象。
实例
在本例中，我们将尝试把不同的对象转换为字符串：
<script type="text/javascript">

var test1= new Boolean(1);
var test2= new Boolean(0);
var test3= new Boolean(true);
var test4= new Boolean(false);
var test5= new Date();
var test6= new String("999 888");
var test7=12345;

document.write(String(test1)+ "<br />");
document.write(String(test2)+ "<br />");
document.write(String(test3)+ "<br />");
document.write(String(test4)+ "<br />");
document.write(String(test5)+ "<br />");
document.write(String(test6)+ "<br />");
document.write(String(test7)+ "<br />");

</script>
输出：
true
false
true
false
Wed Oct 28 00:17:40 UTC+0800 2009
999 888
12345
TIY
String()
如何使用 String() 把对象的值转换为字符串。■◆217■对由 escape() 编码的字符串进行解码()    简化命令：．解串编码■．解串编码■对由 escape() 编码的字符串进行解码。


定义和用法
unescape() 函数可对通过 escape() 编码的字符串进行解码。
语法
unescape(string)
参数	描述
string	必需。要解码或反转义的字符串。
返回值
string 被解码后的一个副本。
说明
该函数的工作原理是这样的：通过找到形式为 %xx 和 %uxxxx 的字符序列（x 表示十六进制的数字），用 Unicode 字符 \u00xx 和 \uxxxx 替换这样的字符序列进行解码。
提示和注释
注释：ECMAScript v3 已从标准中删除了 unescape() 函数，并反对使用它，因此应该用 decodeURI() 和 decodeURIComponent() 取而代之。
实例
在本例中，我们将使用 escape() 来编码字符串，然后使用 unescape() 对其解码：
<script type="text/javascript">

var test1="Visit W3School!"

test1=escape(test1)
document.write (test1 + "<br />")

test1=unescape(test1)
document.write(test1 + "<br />")

</script>
输出：
Visit%20W3School%21
Visit W3School!
TIY
unescape()
如何使用 unescape() 来解码字符串。■◆-1■浏览器对象■■■◆237■窗口■窗口■Window 对象
Window 对象表示浏览器中打开的窗口。
如果文档包含框架（frame 或 iframe 标签），浏览器会为 HTML 文档创建一个 window 对象，并为每个框架创建一个额外的 window 对象。
注释：没有应用于 window 对象的公开标准，不过所有浏览器都支持该对象。
IE: Internet Explorer, F: Firefox, O: Opera.



Window 对象描述
Window 对象表示一个浏览器窗口或一个框架。在客户端 JavaScript 中，Window 对象是全局对象，所有的表达式都在当前的环境中计算。也就是说，要引用当前窗口根本不需要特殊的语法，可以把那个窗口的属性作为全局变量来使用。例如，可以只写 document，而不必写 window.document。
同样，可以把当前窗口对象的方法当作函数来使用，如只写 alert()，而不必写 Window.alert()。
除了上面列出的属性和方法，Window 对象还实现了核心 JavaScript 所定义的所有全局属性和方法。
Window 对象的 window 属性和 self 属性引用的都是它自己。当你想明确地引用当前窗口，而不仅仅是隐式地引用它时，可以使用这两个属性。除了这两个属性之外，parent 属性、top 属性以及 frame[] 数组都引用了与当前 Window 对象相关的其他 Window 对象。
要引用窗口中的一个框架，可以使用如下语法：
frame[i]		//当前窗口的框架
self.frame[i]	//当前窗口的框架
w.frame[i]	//窗口 w 的框架
要引用一个框架的父窗口（或父框架），可以使用下面的语法：
parent		//当前窗口的父窗口
self.parent	//当前窗口的父窗口
w.parent 		//窗口 w 的父窗口
要从顶层窗口含有的任何一个框架中引用它，可以使用如下语法：
top		//当前框架的顶层窗口
self.top		//当前框架的顶层窗口
f.top		//框架 f 的顶层窗口
新的顶层浏览器窗口由方法 Window.open() 创建。当调用该方法时，应把 open() 调用的返回值存储在一个变量中，然后使用那个变量来引用新窗口。新窗口的 opener 属性反过来引用了打开它的那个窗口。
一般来说，Window 对象的方法都是对浏览器窗口或框架进行某种操作。而 alert() 方法、confirm() 方法和 prompt 方法则不同，它们通过简单的对话框与用户进行交互。■◆238■返回窗口中所有命名的框架（框架集合数组）简化命令：．框架集■．框架集■返回窗口中所有命名的框架。
该集合是 Window 对象的数组，每个 Window 对象在窗口中含有一个框架或 <iframe>。属性 frames.length 存放数组 frames[] 中含有的元素个数。注意，frames[] 数组中引用的框架可能还包括框架，它们自己也具有 frames[] 数组。



功能：frames[]是窗口中所有命名的框架组成的数组。这个数组的每个元素都是一个Window对象，对应于窗口中的一个框架。

 

语法：window.frames

 

浏览器窗口中每个定义的框架都是frames[]数组中的元素。

 

假设ifr 是一个以存在的 iframe 的 ID 和 NAME 值: 获取iframe的方法有：

document.getElementById(“ifr”);

window.frames[“ifr”];

 

要想使用iframe内的函数,变量就必须通过第二种方法.因为它取的是一个完整的DOM模型第一种方法只是取出了一个OBJECT而已.

如果只想改变iframe的 src 或者 border , scrolling 等 attributes(与property不是一个概念,property是不能写在标签内的,比如:scrollHeight,innerHTML等),就需要用到第一种方法.

如果想取得iframe的页面(不是iframe本身),就需要使用第二种方法,因为它取得的是一个完整的DOM模型,比如想得到iframe的document.body的内容,就只能用第二种方法.

还要注意的是,如果在iframe的页面未完全装入的时候,调用iframe的DOM模型,会发生很严重的错误,所以,你要准备一个容错模式.

 

frames.length属性存放了frames[]数组的长度。

注：frames[]数组的元素内部还可以有框架，所以frames[i]可以有自己的frames[]数组。

实例1检测当前页面中框架个数。

代码：

<script type="text/javascript">
document.write( "框架个数："+window.frames.length );
</script>

这段代码的效果为：框架个数：1

注：本页面中包含有一个<iframe>定义的框架。■◆238■返回窗口是否已被关闭                    简化命令：．关闭■．关闭■返回窗口是否已被关闭。



定义和用法
closed 属性可返回一个布尔值，该值声明了窗口是否已经关闭。该属性为只读。
当浏览器窗口关闭时，表示该窗口的 Windows 对象并不会消失，它将继续存在，不过它的 closed 属性将设置为 true。
语法
window.closed
实例
下面的例子可检测新窗口是否已被关闭：
<html>
<head>
<script type="text/javascript">
function ifClosed()
  {
  document.write("'myWindow' has been closed!")
  }
  
function ifNotClosed()
  {
  document.write("'myWindow' has not been closed!")
  }

function checkWin()
  {
  if (myWindow.closed)
    ifClosed()
  else
    ifNotClosed()
  }
</script>
</head>
<body>

<script type="text/javascript">
myWindow=window.open('','','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
</script>

<input type="button" value="Has 'myWindow' been closed?"
onclick="checkWin()">

</body>
</html>
TIY
检测窗口是否已关闭■◆238■设置或返回窗口状态栏中的默认文本        简化命令：．底栏■．底栏■设置或返回窗口状态栏中的默认文本。


定义和用法
defaultStatus 属性可设置或返回窗口状态栏中的默认文本。该属性可读可写。
该文本会在页面加载时被显示。
语法
window.defaultStatus=sometext
实例
下面的例子讲在状态栏设置文本：
<html>
<body>

<script type="text/javascript">
window.defaultStatus="This is the default text in the status bar!!";
</script>

<p>Look at the text in the statusbar.</p>

</body>
</html>
TIY
在状态栏设置默认的文本■◆238■对 Document 对象的只读引用              简化命令：．文档■．文档■对 Document 对象的只读引用。请参阅Document 对象



Document 对象
每个载入浏览器的 HTML 文档都会成为 Document 对象。
Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
提示：Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.


Document 对象描述
HTMLDocument 接口对 DOM Document 接口进行了扩展，定义 HTML 专用的属性和方法。
很多属性和方法都是 HTMLCollection 对象（实际上是可以用数组或名称索引的只读数组），其中保存了对锚、表单、链接以及其他可脚本元素的引用。
这些集合属性都源自于 0 级 DOM。它们已经被 Document.getElementsByTagName() 所取代，但是仍然常常使用，因为他们很方便。
write() 方法值得注意，在文档载入和解析的时候，它允许一个脚本向文档中插入动态生成的内容。
注意，在 1 级 DOM 中，HTMLDocument 定义了一个名为 getElementById() 的非常有用的方法。在 2 级 DOM 中，该方法已经被转移到了 Document 接口，它现在由 HTMLDocument 继承而不是由它定义了。■◆238■对History对象的只读引用请看History对象  简化命令：．历史■．历史■对 History 对象的只读引用。请参数 History 对象。



History 对象
History 对象包含用户（在浏览器窗口中）访问过的 URL。
History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问。
注释：没有应用于 History 对象的公开标准，不过所有浏览器都支持该对象。
IE: Internet Explorer, F: Firefox, O: Opera.


History 对象描述
History 对象最初设计来表示窗口的浏览历史。但出于隐私方面的原因，History 对象不再允许脚本访问已经访问过的实际 URL。唯一保持使用的功能只有 back()、forward() 和 go() 方法。
例子
下面一行代码执行的操作与单击后退按钮执行的操作一样：
history.back()
下面一行代码执行的操作与单击两次后退按钮执行的操作一样：
history.go(-2)■◆238■返回窗口的文档显示区的高度              简化命令：．显区高■．显区高■返回窗口的文档显示区的高度。



定义和用法
只读属性，声明了窗口的文档显示区的高度和宽度，以像素计。
这里的宽度和高度不包括菜单栏、工具栏以及滚动条等的高度。
IE 不支持这些属性。它用 document.documentElement 或 document.body （与 IE 的版本相关）的 clientWidth 和 clientHeight 属性作为替代。■◆238■返回窗口的文档显示区的宽度              简化命令：．显区宽■．显区宽■返回窗口的文档显示区的宽度。




定义和用法
只读属性，声明了窗口的文档显示区的高度和宽度，以像素计。
这里的宽度和高度不包括菜单栏、工具栏以及滚动条等的高度。
IE 不支持这些属性。它用 document.documentElement 或 document.body （与 IE 的版本相关）的 clientWidth 和 clientHeight 属性作为替代。■◆238■设置或返回窗口中的框架数量              简化命令：．框架数■．框架数■设置或返回窗口中的框架数量。■◆238■窗口或框架的Location对象请看Location对象简化命令：．锚信息■．锚信息■用于窗口或框架的 Location 对象。请参阅Location 对象。



Location 对象
Location 对象包含有关当前 URL 的信息。
Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。
例子
把用户带到一个新的地址
IE: Internet Explorer, F: Firefox, O: Opera.



Location 对象描述
Location 对象存储在 Window 对象的 Location 属性中，表示那个窗口中当前显示的文档的 Web 地址。它的 href 属性存放的是文档的完整 URL，其他属性则分别描述了 URL 的各个部分。这些属性与 Anchor 对象（或 Area 对象）的 URL 属性非常相似。当一个 Location 对象被转换成字符串，href 属性的值被返回。这意味着你可以使用表达式 location 来替代 location.href。
不过 Anchor 对象表示的是文档中的超链接，Location 对象表示的却是浏览器当前显示的文档的 URL（或位置）。但是 Location 对象所能做的远远不止这些，它还能控制浏览器显示的文档的位置。如果把一个含有 URL 的字符串赋予 Location 对象或它的 href 属性，浏览器就会把新的 URL 所指的文档装载进来，并显示出来。
除了设置 location 或 location.href 用完整的 URL 替换当前的 URL 之外，还可以修改部分 URL，只需要给 Location 对象的其他属性赋值即可。这样做就会创建新的 URL，其中的一部分与原来的 URL 不同，浏览器会将它装载并显示出来。例如，假设设置了Location对象的 hash 属性，那么浏览器就会转移到当前文档中的一个指定的位置。同样，如果设置了 search 属性，那么浏览器就会重新装载附加了新的查询字符串的 URL。
除了 URL 属性外，Location 对象的 reload() 方法可以重新装载当前文档，replace() 可以装载一个新文档而无须为它创建一个新的历史记录，也就是说，在浏览器的历史列表中，新文档将替换当前文档。■◆238■设置或返回窗口的名称                    简化命令：．名称■．名称■设置或返回窗口的名称。



定义和用法
name 属性可设置或返回存放窗口的名称的一个字符串。
该名称是在 open() 方法创建窗口时指定的或者使用一个 <frame> 标记的 name 属性指定的。
窗口的名称可以用作一个 <a> 或者 <form> 标记的 target 属性的值。以这种方式使用 target 属性声明了超链接文档或表单提交结果应该显示于指定的窗口或框架中。
语法
window.name=name
实例
下面的例子可返回新窗口的名称：
<html>
<head>
<script type="text/javascript">
function checkWin()
  {
  document.write(myWindow.name)
  }
</script>
</head>
<body>

<script type="text/javascript">
myWindow=window.open('','MyName','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
</script>

<input type="button" value="What's the name of 'myWindow'?"
onclick="checkWin()">

</body>
</html>
TIY
返回新窗口的名称■◆238■对Navigator对象的只读引用看浏览器对象   简化命令：．浏览器■．浏览器■对 Navigator 对象的只读引用。请参数Navigator 对象。

Navigator 对象
Navigator 对象包含有关浏览器的信息。
注释：没有应用于 navigator 对象的公开标准，不过所有浏览器都支持该对象。
IE: Internet Explorer, F: Firefox, O: Opera.

Navigator 对象描述
Navigator 对象包含的属性描述了正在使用的浏览器。可以使用这些属性进行平台专用的配置。
虽然这个对象的名称显而易见的是 Netscape 的 Navigator 浏览器，但其他实现了 JavaScript 的浏览器也支持这个对象。
Navigator 对象的实例是唯一的，可以用 Window 对象的 navigator 属性来引用它。■◆238■返回对创建此窗口的窗口的引用            简化命令：．母窗■．母窗■返回对创建此窗口的窗口的引用。



定义和用法
opener 属性是一个可读可写的属性，可返回对创建该窗口的 Window 对象的引用。
opener 属性非常有用，创建的窗口可以引用创建它的窗口所定义的属性和函数。
语法
window.opener
提示和注释
注释：只有表示顶层窗口的 Window 对象的 operner 属性才有效，表示框架的 Window 对象的 operner 属性无效。
实例
下面的例子可向 opener 窗口写文本（父窗口）：
<html>
<body>

<script type="text/javascript">
myWindow=window.open('','MyName','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
myWindow.focus()
myWindow.opener.document.write("This is the parent window")
</script>

</body>
</html>
TIY
向 opener 窗口写文本■◆238■返回窗口的外部高度                      简化命令：．外高■．外高■返回窗口的外部高度。



定义和用法
outerheight 属性是一个只读的整数，声明了整个窗口的高度。
语法
window.outerheight=pixels
提示和注释
提示：IE 不支持此属性，且没有提供替代的属性。
实例
下面的例子可把新窗口设置为 100x100 像素：
<html>
<body>

<script type="text/javascript">
myWindow=window.open('','')
myWindow.outerheight="100"
myWindow.outerwidth="100"
myWindow.document.write("This is 'myWindow'")
myWindow.focus()
</script>

</body>
</html>
TIY
设置窗口的高度和宽度■◆238■返回窗口的外部宽度                      简化命令：．外宽■．外宽■返回窗口的外部宽度。



定义和用法
outerwidth 属性是一个只读的整数，声明了整个窗口的宽度。
语法
window.outerwidth=pixels
提示和注释
提示：IE 不支持此属性，且没有提供替代的属性。
实例
下面的例子可把新窗口设置为 100x100 像素：
<html>
<body>

<script type="text/javascript">
myWindow=window.open('','')
myWindow.outerheight="100"
myWindow.outerwidth="100"
myWindow.document.write("This is 'myWindow'")
myWindow.focus()
</script>

</body>
</html>
TIY
设置窗口的高度和宽度■◆238■设或返回当前页相对窗口显示区左上角X位置 简化命令：．页X■．页X■设置或返回当前页面相对于窗口显示区左上角的 X 位置。■◆238■设或返回当前页相对窗口显示区左上角Y位置 简化命令：．页Y■．页Y■设置或返回当前页面相对于窗口显示区左上角的 Y 位置。■◆238■返回父窗口                              简化命令：．父窗■．父窗■返回父窗口。■◆238■对Screen对象的只读引用请看Screen对象    简化命令：．屏幕■．屏幕■对 Screen 对象的只读引用。请参数 Screen 对象。


Screen 对象
Screen 对象包含有关客户端显示屏幕的信息。
注释：没有应用于 screen 对象的公开标准，不过所有浏览器都支持该对象。
IE: Internet Explorer, F: Firefox, O: Opera.




Screen 对象描述
每个 Window 对象的 screen 属性都引用一个 Screen 对象。Screen 对象中存放着有关显示浏览器屏幕的信息。JavaScript 程序将利用这些信息来优化它们的输出，以达到用户的显示要求。例如，一个程序可以根据显示器的尺寸选择使用大图像还是使用小图像，它还可以根据显示器的颜色深度选择使用 16 位色还是使用 8 位色的图形。另外，JavaScript 程序还能根据有关屏幕尺寸的信息将新的浏览器窗口定位在屏幕中间。■◆238■返回对当前窗口的引用等价于Window属性    简化命令：．自己■．自己■返回对当前窗口的引用。等价于 Window 属性。



定义和用法
self 属性可返回对窗口自身的只读引用。等价于 Window 属性。
语法
window.self
实例
下面的例子窗口是否在一个框架中，如果是，则跳出框架：
<html>
<head>
<script type="text/javascript">
function breakout()
  {
  if (window.top!=window.self) 
    {
    window.top.location="tryjs_breakout.htm"
    }
  }
</script>
</head>
<body>

<input type="button" onclick="breakout()"
value="Break out of frame!">

</body>
</html>
TIY
跳出框架
HTML DOM Window 对象参考手册■◆238■设置窗口状态栏的文本                    简化命令：．状态栏■．状态栏■设置窗口状态栏的文本。




定义和用法
status 属性可设置或返回窗口状态栏中的文本。
语法
window.status=sometext
说明
status 属性是一个可读可写的字符串，声明了要在窗口状态栏中显示的一条消息。通常显示这条消息的时间是有限的，直到其他的消息将它覆盖，或者用户把鼠标移动到窗口的其他区域为止。当擦除了 status 声明的消息时，状态栏要么恢复为它默认的空白状态，要么是再次显示出属性 defaultStatus 声明的默认消息。
据我们所知，不少浏览器已经关闭了脚本化它们的状态栏的功能。这是一项安全措施，防止隐藏了超链接真正目的的钓鱼攻击。
实例
下面的例子讲在状态栏设置文本：
<html>
<body>

<script type="text/javascript">
window.status="Some text in the status bar!!"
</script>

</body>
</html>
TIY
在窗口的状态栏设置文本
HTML DOM Window 对象参考手册■◆238■返回最顶层的先辈窗口                    简化命令：．顶窗■．顶窗■返回最顶层的先辈窗口。



定义和用法
top 属性返回最顶层的先辈窗口。
该属性返回对一个顶级窗口的只读引用。如果窗口本身就是一个顶级窗口，top 属性存放对窗口自身的引用。如果窗口是一个框架，那么 top 属性引用包含框架的顶层窗口。
语法
window.top
实例
下面的例子窗口是否在一个框架中，如果是，则跳出框架：
<html>
<head>
<script type="text/javascript">
function breakout()
{
if (window.top!=window.self) 
{
window.top.location="tryjs_breakout.htm"
}
}
</script>
</head>

<body>
<form>
Click the button to break out of the frame:
<input type="button" onclick="breakout()" value="Break out!">
</form>
</body>

</html>
亲自试一试
TIY
跳出框架
调整窗口的尺寸
把窗口调整为指定的尺寸■◆238■此属性等价self属性包含对窗口自身的引用  简化命令：．窗口■．窗口■window 属性等价于 self 属性，它包含了对窗口自身的引用。■◆238■只读整数窗口左上角在屏幕上x坐标和y坐标  简化命令：．坐标左■．坐标左■只读整数。声明了窗口的左上角在屏幕上的的 x 坐标和 y 坐标。IE、Safari 和 Opera 支持 screenLeft 和 screenTop，而 Firefox 和 Safari 支持 screenX 和 screenY。■◆238■只读整数窗口左上角在屏幕上x坐标和y坐标  简化命令：．坐标顶■．坐标顶■只读整数。声明了窗口的左上角在屏幕上的的 x 坐标和 y 坐标。IE、Safari 和 Opera 支持 screenLeft 和 screenTop，而 Firefox 和 Safari 支持 screenX 和 screenY。■◆238■只读整数窗口左上角在屏幕上x坐标和y坐标  简化命令：．坐标X■．坐标X■只读整数。声明了窗口的左上角在屏幕上的的 x 坐标和 y 坐标。IE、Safari 和 Opera 支持 screenLeft 和 screenTop，而 Firefox 和 Safari 支持 screenX 和 screenY。■◆238■只读整数窗口左上角在屏幕上x坐标和y坐标  简化命令：．坐标Y■．坐标Y■只读整数。声明了窗口的左上角在屏幕上的的 x 坐标和 y 坐标。IE、Safari 和 Opera 支持 screenLeft 和 screenTop，而 Firefox 和 Safari 支持 screenX 和 screenY。■◆238■显示带有一段消息和一个确认按钮的警告框()简化命令：警告框■警告框■显示带有一段消息和一个确认按钮的警告框。




定义和用法
alert() 方法用于显示带有一条指定消息和一个 OK 按钮的警告框。
语法
alert(message)
参数	描述
message	要在 window 上弹出的对话框中显示的纯文本（而非 HTML 文本）
实例
<html>
<head>
<script type="text/javascript">
function display_alert()
  {
  alert("I am an alert box!!")
  }
</script>
</head>
<body>

<input type="button" onclick="display_alert()"
value="Display alert box" />

</body>
</html>
TIY
显示一个对话框
显示带有折行的对话框■◆238■把键盘焦点从顶层窗口移开()              简化命令：移焦■移焦■把键盘焦点从顶层窗口移开。



定义和用法
blur() 方法可把键盘焦点从顶层窗口移开。
语法
window.blur()
说明
方法 blur() 可把键盘焦点从顶层浏览器窗口移走，整个窗口由 Window 对象指定。哪个窗口最终获得键盘焦点并没有指定。
提示和注释
注释：在某些浏览器上，该方法可能无效。
实例
<html>
<body>

<script type="text/javascript">
myWindow=window.open('','','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
myWindow.blur()
</script>

</body>
</html>
TIY
把焦点移到新窗口
从新窗口移开焦点■◆238■取消由设周期()设置的周期()              简化命令：撤周期■撤周期■取消由 setInterval() 设置的 timeout。




定义和用法
clearInterval() 方法可取消由 setInterval() 设置的 timeout。
clearInterval() 方法的参数必须是由 setInterval() 返回的 ID 值。
语法
clearInterval(id_of_setinterval)
参数	描述
id_of_setinterval	由 setInterval() 返回的 ID 值。
实例
下面这个例子将每隔 50 毫秒调用 clock() 函数。您也可以使用一个按钮来停止这个 clock：
<html>
<body>

<input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
  {
  var t=new Date()
  document.getElementById("clock").value=t
  }
</script>
</form>
<button onclick="int=window.clearInterval(int)">
Stop interval</button>

</body>
</html>
TIY
使用 setInterval() 和 clearInterval()■◆238■取消由设延时方法设置的延时()            简化命令：撤延时■撤延时■取消由 setTimeout() 方法设置的 timeout。





定义和用法
clearTimeout() 方法可取消由 setTimeout() 方法设置的 timeout。
语法
clearTimeout(id_of_settimeout)
参数	描述
id_of_settimeout	由 setTimeout() 返回的 ID 值。该值标识要取消的延迟执行代码块。
实例
下面的例子每秒调用一次 timedCount() 函数。您也可以使用一个按钮来终止这个定时消息：
<html>
<head>
<script type="text/javascript">
var c=0
var t
function timedCount()
  {
  document.getElementById('txt').value=c
  c=c+1
  t=setTimeout("timedCount()",1000)
  }
function stopCount()
  {
  clearTimeout(t)
  }
</script>
</head>
<body>

<form>
<input type="button" value="Start count!" onClick="timedCount()">
<input type="text" id="txt">
<input type="button" value="Stop count!" onClick="stopCount()">
</form>

</body>
</html>
TIY
带有停止按钮的计时程序■◆238■关闭浏览器窗口()                        简化命令：关窗■关窗■关闭浏览器窗口。




定义和用法
close() 方法用于关闭浏览器窗口。
语法
window.close()
说明
方法 close() 将关闭有 window 指定的顶层浏览器窗口。某个窗口可以通过调用 self.close() 或只调用 close() 来关闭其自身。
只有通过 JavaScript 代码打开的窗口才能够由 JavaScript 代码关闭。这阻止了恶意的脚本终止用户的浏览器。
实例
下面的例子可关闭新的浏览器：
<html>
<head>
<script type="text/javascript">
function closeWin()
  {
  myWindow.close()
  }
</script>
</head>
<body>

<script type="text/javascript">
myWindow=window.open('','','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
</script>

<input type="button" value="Close 'myWindow'"
onclick="closeWin()" />

</body>
</html>
TIY
在点击按钮时关闭浏览器■◆238■带有消息以及确认和取消按钮的对话框()    简化命令：对话框■对话框■显示带有一段消息以及确认按钮和取消按钮的对话框。




定义和用法
confirm() 方法用于显示一个带有指定消息和 OK 及取消按钮的对话框。
语法
confirm(message)
参数	描述
message	要在 window 上弹出的对话框中显示的纯文本（而非 HTML 文本）
说明
如果用户点击确定按钮，则 confirm() 返回 true。如果点击取消按钮，则 confirm() 返回 false。
在用户点击确定按钮或取消按钮把对话框关闭之前，它将阻止用户对浏览器的所有输入。在调用 confirm() 时，将暂停对 JavaScript 代码的执行，在用户作出响应之前，不会执行下一条语句。
提示和注释
提示：对话框按钮的文字是不可改变的，因此请小心地编写问题或消息，使它适合用确认和取消来回答。
实例
<html>
<head>
<script type="text/javascript">
function disp_confirm()
  {
  var r=confirm("Press a button")
  if (r==true)
    {
    document.write("You pressed OK!")
    }
  else
    {
    document.write("You pressed Cancel!")
    }
  }
</script>
</head>
<body>

<input type="button" onclick="disp_confirm()"
value="Display a confirm box" />

</body>
</html>
TIY
显示一个确认框■◆238■创建一个 pop-up 窗口()                  简化命令：建弹窗■建弹窗■创建一个 pop-up 窗口。




定义和用法
createPopup() 方法用于创建一个 pop-up 窗口。
语法
window.createPopup()
实例
<html>
<head>
<script type="text/javascript">
function show_popup()
{
var p=window.createPopup()
var pbody=p.document.body
pbody.style.backgroundColor="lime"
pbody.style.border="solid black 1px"
pbody.innerHTML="This is a pop-up! Click outside to close."
p.show(150,150,200,50,document.body)
}
</script>
</head>

<body>
<button onclick="show_popup()">Create pop-up!</button>
</body>

</html>
TIY
创建 pop-up■◆238■把键盘焦点给予一个窗口()                简化命令：给焦■给焦■把键盘焦点给予一个窗口。



定义和用法
focus() 方法可把键盘焦点给予一个窗口。
语法
window.focus()
实例
下面的例子可确保新的窗口得到焦点：
<html>
<body>

<script type="text/javascript">
myWindow=window.open('','','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
myWindow.focus()
</script>

</body>
</html>
TIY
把焦点给予新窗口
从新窗口移开焦点■◆238■可相对窗口当前坐标把它移动指定像素()    简化命令：窗移■窗移■可相对窗口的当前坐标把它移动指定的像素。



定义和用法
moveBy() 方法可相对窗口的当前坐标把它移动指定的像素。
语法
window.moveBy(x,y)
参数	描述
x	要把窗口右移的像素数
y	要把窗口下移的像素数
实例
下面的例子将把窗口相对其当前位置移动 50 个像素：
<html>
<head>
<script type="text/javascript">
function moveWin()
  {
  myWindow.moveBy(50,50)
  }
</script>
</head>
<body>

<script type="text/javascript">
myWindow=window.open('','','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
</script>

<input type="button" value="Move 'myWindow'"
onclick="moveWin()" />

</body>
</html>
TIY
通过 moveBy() 移动窗口■◆238■把窗口的左上角移动到一个指定坐标()      简化命令：窗到■窗到■把窗口的左上角移动到一个指定的坐标。



定义和用法
moveTo() 方法可把窗口的左上角移动到一个指定的坐标。
语法
window.moveTo(x,y)
参数	描述
x	窗口新位置的 x 坐标
y	窗口新位置的 y 坐标
提示和注释
注释：出于安全方面的原因，浏览器限制此方法使其不能把窗口移出屏幕。
实例
下面的例子讲把新窗口移动到指定的坐标：
<html>
<head>
<script type="text/javascript">
function moveWin()
  {
  myWindow.moveTo(50,50)
  }
</script>
</head>
<body>

<script type="text/javascript">
myWindow=window.open('','','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
</script>

<input type="button" value="Move 'myWindow'"
onclick="moveWin()" />

</body>
</html>
TIY
通过 moveTo() 移动窗口


■◆238■打开新浏览器窗口或查找已命名窗口()      简化命令：开窗■开窗■打开一个新的浏览器窗口或查找一个已命名的窗口。



定义和用法
open() 方法用于打开一个新的浏览器窗口或查找一个已命名的窗口。
语法
window.open(URL,name,features,replace)
参数	描述
URL	一个可选的字符串，声明了要在新窗口中显示的文档的 URL。如果省略了这个参数，或者它的值是空字符串，那么新窗口就不会显示任何文档。
name	一个可选的字符串，该字符串是一个由逗号分隔的特征列表，其中包括数字、字母和下划线，该字符声明了新窗口的名称。这个名称可以用作标记 <a> 和 <form> 的属性 target 的值。如果该参数指定了一个已经存在的窗口，那么 open() 方法就不再创建一个新窗口，而只是返回对指定窗口的引用。在这种情况下，features 将被忽略。
features	一个可选的字符串，声明了新窗口要显示的标准浏览器的特征。如果省略该参数，新窗口将具有所有标准特征。在窗口特征这个表格中，我们对该字符串的格式进行了详细的说明。
replace
一个可选的布尔值。规定了装载到窗口的 URL 是在窗口的浏览历史中创建一个新条目，还是替换浏览历史中的当前条目。支持下面的值：
true - URL 替换浏览历史中的当前条目。
false - URL 在浏览历史中创建新的条目。
提示和注释
重要事项：请不要混淆方法 Window.open() 与方法 Document.open()，这两者的功能完全不同。为了使您的代码清楚明白，请使用 Window.open()，而不要使用 open()。
实例 1
下面的例子讲在新浏览器窗口中打开 www.w3school.com.cn ：
<html>
<head>
<script type="text/javascript">
function open_win() 
{
window.open("http://www.w3school.com.cn")
}
</script>
</head>
<body>

<input type=button value="Open Window" onclick="open_win()" />

</body>
</html>
实例 2
下面的例子讲在新浏览器窗口中打开 about:blank 页：
<html>
<body>

<script type="text/javascript">
myWindow=window.open('','','width=200,height=100')
myWindow.document.write("This is 'myWindow'")
myWindow.focus()
</script>

</body>
</html>
TIY
通过点击按钮来打开一个窗口
打开一个新窗口，并控制其外观
通过一次点击打开多个窗口
打开一个新窗口
窗口特征（Window Features）
channelmode=yes|no|1|0	是否使用剧院模式显示窗口。默认为 no。
directories=yes|no|1|0	是否添加目录按钮。默认为 yes。
fullscreen=yes|no|1|0	是否使用全屏模式显示浏览器。默认是 no。处于全屏模式的窗口必须同时处于剧院模式。
height=pixels	窗口文档显示区的高度。以像素计。
left=pixels	窗口的 x 坐标。以像素计。
location=yes|no|1|0	是否显示地址字段。默认是 yes。
menubar=yes|no|1|0	是否显示菜单栏。默认是 yes。
resizable=yes|no|1|0	窗口是否可调节尺寸。默认是 yes。
scrollbars=yes|no|1|0	是否显示滚动条。默认是 yes。
status=yes|no|1|0	是否添加状态栏。默认是 yes。
titlebar=yes|no|1|0	是否显示标题栏。默认是 yes。
toolbar=yes|no|1|0	是否显示浏览器的工具栏。默认是 yes。
top=pixels	窗口的 y 坐标。
width=pixels	窗口的文档显示区的宽度。以像素计。
■◆275■是否使用剧院模式显示窗口。默认为 no。   简化命令：channelmode=yes|no■channelmode=yes|no■是否使用剧院模式显示窗口。默认为 no。

channelmode=yes|no■◆275■是否添加目录按钮。默认为 yes。          简化命令：directories=yes|no■directories=yes|no■是否添加目录按钮。默认为 yes。■◆275■是否使用全屏模式显示浏览器。默认是 no。处于全屏模式的窗口必须同时处于剧院模式。简化命令：fullscreen=yes|no■fullscreen=yes|no■是否使用全屏模式显示浏览器。默认是 no。处于全屏模式的窗口必须同时处于剧院模式。■◆275■窗口文档显示区的高度。以像素计。        简化命令：height=pixels■height=pixels■窗口文档显示区的高度。以像素计。■◆275■窗口的 x 坐标。以像素计。               简化命令：left=pixels■left=pixels■窗口的 x 坐标。以像素计。■◆275■是否显示地址字段。默认是 yes。          简化命令：location=yes|no|1|0■location=yes|no|1|0■是否显示地址字段。默认是 yes。■◆275■是否显示菜单栏。默认是 yes。            简化命令：menubar=yes|no|1|0■menubar=yes|no|1|0■是否显示菜单栏。默认是 yes。■◆275■窗口是否可调节尺寸。默认是 yes。        简化命令：resizable=yes|no|1|0■resizable=yes|no|1|0■窗口是否可调节尺寸。默认是 yes。■◆275■是否显示滚动条。默认是 yes。            简化命令：scrollbars=yes|no|1|0■scrollbars=yes|no|1|0■是否显示滚动条。默认是 yes。■◆275■是否添加状态栏。默认是 yes。            简化命令：status=yes|no|1|0■status=yes|no|1|0■是否添加状态栏。默认是 yes。■◆275■是否显示标题栏。默认是 yes。            简化命令：titlebar=yes|no|1|0■titlebar=yes|no|1|0■是否显示标题栏。默认是 yes。■◆275■是否显示浏览器的工具栏。默认是 yes。    简化命令：toolbar=yes|no|1|0■toolbar=yes|no|1|0■是否显示浏览器的工具栏。默认是 yes。■◆275■窗口的 y 坐标。                         简化命令：top=pixels■top=pixels■窗口的 y 坐标。■◆275■窗口的文档显示区的宽度。以像素计。      简化命令：width=pixels■width=pixels■窗口的文档显示区的宽度。以像素计。■◆238■打印当前窗口的内容()                    简化命令：打印■打印■打印当前窗口的内容。


定义和用法
print() 方法用于打印当前窗口的内容。
调用 print() 方法所引发的行为就像用户单击浏览器的打印按钮。通常，这会产生一个对话框，让用户可以取消或定制打印请求。
语法
window.print()
实例 1
<html>
<head>
<script type="text/javascript">
function printpage()
  {
  window.print()
  }
</script>
</head>
<body>

<input type="button" value="Print this page"
onclick="printpage()" />

</body>
</html>
TIY
打印页面■◆238■显示可提示用户输入的对话框()            简化命令：输入框■输入框■显示可提示用户输入的对话框。



定义和用法
prompt() 方法用于显示可提示用户进行输入的对话框。
语法
prompt(text,defaultText)
参数	描述
text	可选。要在对话框中显示的纯文本（而不是 HTML 格式的文本）。
defaultText	可选。默认的输入文本。
说明
如果用户单击提示框的取消按钮，则返回 null。如果用户单击确认按钮，则返回输入字段当前显示的文本。
在用户点击确定按钮或取消按钮把对话框关闭之前，它将阻止用户对浏览器的所有输入。在调用 prompt() 时，将暂停对 JavaScript 代码的执行，在用户作出响应之前，不会执行下一条语句。
实例 1
<html>
<head>
<script type="text/javascript">
function disp_prompt()
  {
  var name=prompt("Please enter your name","")
  if (name!=null && name!="")
    {
    document.write("Hello " + name + "!")
    }
  }
</script>
</head>
<body>

<input type="button" onclick="disp_prompt()"
value="Display a prompt box" />

</body>
</html>
TIY
显示提示框■◆238■按照指定的像素调整窗口的大小()          简化命令：窗大小■窗大小■按照指定的像素调整窗口的大小。



定义和用法
resizeBy() 方法用于根据指定的像素来调整窗口的大小。
语法
resizeBy(width,height)
参数	描述
width	必需。要使窗口宽度增加的像素数。可以是正、负数值。
height	可选。要使窗口高度增加的像素数。可以是正、负数值。
实例 1
<html>
<head>
<script type="text/javascript">
function resizeWindow()
  {
  window.resizeBy(-100,-100)
  }
</script>
</head>
<body>

<input type="button" onclick="resizeWindow()"
value="Resize window">

</body>
</html>
TIY
调整窗口的大小■◆238■把窗口的大小调整到指定的宽度和高度()    简化命令：窗宽高■窗宽高■把窗口的大小调整到指定的宽度和高度。



定义和用法
resizeTo() 方法用于把窗口大小调整为指定的宽度和高度。
语法
resizeTo(width,height)
参数	描述
width	必需。想要调整到的窗口的宽度。以像素计。
height	可选。想要调整到的窗口的高度。以像素计。
实例
<html>
<head>
<script type="text/javascript">
function resizeWindow()
  {
  window.resizeTo(500,300)
  }
</script>
</head>
<body>

<input type="button" onclick="resizeWindow()"
value="Resize window">

</body>
</html>
TIY
把窗口调整为指定的大小■◆238■按照指定的像素值来滚动内容()            简化命令：滚条■滚条■按照指定的像素值来滚动内容。




定义和用法
scrollBy() 方法可把内容滚动指定的像素数。
语法
scrollBy(xnum,ynum)
参数	描述
xnum	必需。把文档向右滚动的像素数。
ynum	必需。把文档向下滚动的像素数。
实例
下面的例子可把内容滚动 100 像素：
<html>
<head>
<script type="text/javascript">
function scrollWindow()
  {
  window.scrollBy(100,100)
  }
</script>
</head>
<body>

<input type="button" onclick="scrollWindow()" value="Scroll" />
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>

</body>
</html>
TIY
通过 scrollBy() 滚动文档■◆238■把内容滚动到指定的坐标()                简化命令：条到■条到■把内容滚动到指定的坐标。




定义和用法
scrollTo() 方法可把内容滚动到指定的坐标。
语法
scrollTo(xpos,ypos)
参数	描述
xpos	必需。要在窗口文档显示区左上角显示的文档的 x 坐标。
ypos	必需。要在窗口文档显示区左上角显示的文档的 y 坐标。
实例
下面的例子可把内容滚动到位置 100,500：
<html>
<head>
<script type="text/javascript">
function scrollWindow()
  {
  window.scrollTo(100,500)
  }
</script>
</head>
<body>

<input type="button" onclick="scrollWindow()" value="Scroll" />
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<br />
<p>SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL SCROLL</p>

</body>
</html>
TIY
通过 scrollTo() 把窗口滚动到指定的位置■◆238■指定周期(毫秒计)调用函数或计算表达式()  简化命令：设周期■设周期■按照指定的周期（以毫秒计）来调用函数或计算表达式。




定义和用法
setInterval() 方法可按照指定的周期（以毫秒计）来调用函数或计算表达式。
setInterval() 方法会不停地调用函数，直到 clearInterval() 被调用或窗口被关闭。由 setInterval() 返回的 ID 值可用作 clearInterval() 方法的参数。
语法
setInterval(code,millisec[,"lang"])
参数	描述
code	必需。要调用的函数或要执行的代码串。
millisec	必须。周期性执行或调用 code 之间的时间间隔，以毫秒计。
返回值
一个可以传递给 Window.clearInterval() 从而取消对 code 的周期性执行的值。
实例
<html>
<body>

<input type="text" id="clock" size="35" />
<script language=javascript>
var int=self.setInterval("clock()",50)
function clock()
  {
  var t=new Date()
  document.getElementById("clock").value=t
  }
</script>
</form>
<button onclick="int=window.clearInterval(int)">
Stop interval</button>

</body>
</html>
TIY
使用 setInterval() 和 clearInterval()■◆238■指定毫秒数调用函数或计算表达式()        简化命令：设延时■设延时■在指定的毫秒数后调用函数或计算表达式。




定义和用法
setTimeout() 方法用于在指定的毫秒数后调用函数或计算表达式。
语法
setTimeout(code,millisec)
参数	描述
code	必需。要调用的函数后要执行的 JavaScript 代码串。
millisec	必需。在执行代码前需等待的毫秒数。
提示和注释
提示：setTimeout() 只执行 code 一次。如果要多次调用，请使用 setInterval() 或者让 code 自身再次调用 setTimeout()。
实例
<html>
<head>
<script type="text/javascript">
function timedMsg()
{
var t=setTimeout("alert('5 seconds!')",5000)
}
</script>
</head>

<body>
<form>
<input type="button" value="Display timed alertbox!"
onClick="timedMsg()">
</form>
<p>Click on the button above. An alert box will be
displayed after 5 seconds.</p>
</body>

</html>
TIY
简单的计时
另一个简单的计时
无穷循环中的计时
无穷循环中的计时 - 带有一个停止按钮
一个时钟■◆237■浏览器■浏览器■Navigator 对象
Navigator 对象包含有关浏览器的信息。
注释：没有应用于 navigator 对象的公开标准，不过所有浏览器都支持该对象。
IE: Internet Explorer, F: Firefox, O: Opera.



Navigator 对象描述
Navigator 对象包含的属性描述了正在使用的浏览器。可以使用这些属性进行平台专用的配置。
虽然这个对象的名称显而易见的是 Netscape 的 Navigator 浏览器，但其他实现了 JavaScript 的浏览器也支持这个对象。
Navigator 对象的实例是唯一的，可以用 Window 对象的 navigator 属性来引用它。■◆298■返回对文档中所有嵌入式对象的引用（一个 Plugin 对象的数组）简化命令：．嵌入集■．嵌入集■
返回对文档中所有嵌入式对象的引用。
该集合是一个 Plugin 对象的数组，其中的元素代表浏览器已经安装的插件。Plug-in 对象提供的是有关插件的信息，其中包括它所支持的 MIME 类型的列表。
虽然 plugins[] 数组是由 IE 4 定义的，但是在 IE 4 中它却总是空的，因为 IE 4 不支持插件和 Plugin 对象。
	■◆298■返回浏览器的代码名                      简化命令：．代码名■．代码名■返回浏览器的代码名。



定义和用法
appCodeName 属性是一个只读字符串，声明了浏览器的代码名。
在所有以 Netscape 代码为基础的浏览器中，它的值是 "Mozilla"。为了兼容起见，在 Microsoft 的浏览器中，它的值也是 "Mozilla"。
语法
navigator.appCodeName
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>CodeName: ")
document.write(navigator.appCodeName + "</p>")
</script>
</body>

</html>
TIY
检测访问者的浏览器和版本号
有关访问者的浏览器的更多信息
有关访问者的浏览器的全部细节
根据浏览器来提醒用户■◆298■返回浏览器的次级版本                    简化命令：．次版本■．次版本■返回浏览器的次级版本。




定义和用法
appMinorVersion 属性可返回浏览器的次要版本。
语法
navigator.appMinorVersion
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>MinorVersion: ")
document.write(navigator.appMinorVersion + "</p>")
</script>
</body>

</html>
TIY
检测访问者的浏览器和版本号
有关访问者的浏览器的更多信息
有关访问者的浏览器的全部细节
根据浏览器来提醒用户■◆298■返回浏览器的名称                        简化命令：．浏览器名■．浏览器名■返回浏览器的名称。




定义和用法
appName 属性可返回浏览器的名称。
appName 属性是一个只读到字符串，声明了浏览器的名称。在基于 Netscape 的浏览器中，这个属性的值是 "Netscape"。在 IE 中，这个属性的值是 "Microsoft Internet Explorer"。其他浏览器可以正确地表示自己或者伪装成其他的浏览器以达到兼容性。
语法
navigator.appMinorVersion
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Name: ")
document.write(navigator.appName + "</p>")
</script>
</body>

</html>
TIY
检测访问者的浏览器和版本号
有关访问者的浏览器的更多信息
有关访问者的浏览器的全部细节
根据浏览器来提醒用户■◆298■返回浏览器的平台和版本信息              简化命令：．平台■．平台■返回浏览器的平台和版本信息。



appVersion 属性可返回浏览器的平台和版本信息。该属性是一个只读的字符串。
该字符串的第一部分是版本号。把该字符串传递给 parseInt() 只能获取主版本号。该属性的其余部分提供了有关浏览器版本的其他细节，包括运行它的操作系统的信息。
语法
navigator.appVersion
提示和注释
注释：不同浏览器提供的信息的格式是不同的。
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Version: ")
document.write(navigator.appVersion + "</p>")
</script>
</body>

</html>
TIY
检测访问者的浏览器和版本号
有关访问者的浏览器的更多信息
有关访问者的浏览器的全部细节
根据浏览器来提醒用户■◆298■返回当前浏览器的语言                    简化命令：．浏览器语■．浏览器语■返回当前浏览器的语言。




定义和用法
browserLanguage 属性可返回当前浏览器的语言。
语法
navigator.browserLanguage
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>BrowserLanguage: ")
document.write(navigator.browserLanguage + "</p>")
</script>
</body>

</html>
TIY
检测访问者的浏览器和版本号
有关访问者的浏览器的更多信息
有关访问者的浏览器的全部细节
根据浏览器来提醒用户■◆298■返回指明浏览器中是否启用cookie的布尔值  简化命令：．用识码■．用识码■返回指明浏览器中是否启用 cookie 的布尔值。



定义和用法
cookieEnabled 属性可返回一个布尔值，如果浏览器启用了 cookie，该属性值为 true。如果禁用了 cookie，则值为 false。
语法
navigator.cookieEnabled
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>CookieEnabled: ")
document.write(navigator.cookieEnabled + "</p>")
</script>
</body>

</html>
TIY
检测访问者的浏览器和版本号
有关访问者的浏览器的更多信息
有关访问者的浏览器的全部细节
根据浏览器来提醒用户■◆298■返回浏览器系统的 CPU 等级               简化命令：．CPU等级■．CPU等级■返回浏览器系统的 CPU 等级。


定义和用法
cpuClass 属性可返回浏览器系统的 CPU 等级。
语法
navigator.cpuClassd
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>CPUClass: ")
document.write(navigator.cpuClass + "</p>")
</script>
</body>

</html>
TIY
检测访问者的浏览器和版本号
有关访问者的浏览器的更多信息
有关访问者的浏览器的全部细节
根据浏览器来提醒用户■◆298■返回指明系统是否处于脱机模式的布尔值    简化命令：．联机■．联机■返回指明系统是否处于脱机模式的布尔值。



定义和用法
onLine 属性是一个只读的布尔值，声明了系统是否处于脱机模式。
注释：在 IE 4+ 中，用户可以在浏览器中选择脱机工作的状态。当脱机工作被选后，系统就进入了脱机状态，内容将从缓存进行读取。
语法
navigator.onLine
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>OnLine: ")
document.write(navigator.onLine + "</p>")
</script>
</body>

</html>
TIY
检测访问者的浏览器和版本号
有关访问者的浏览器的更多信息
有关访问者的浏览器的全部细节■◆298■返回运行浏览器的操作系统平台            简化命令：．系统■．系统■返回运行浏览器的操作系统平台。



定义和用法
platform 属性是一个只读的字符串，声明了运行浏览器的操作系统和（或）硬件平台。
虽然该属性没有标准的值集合，但它有些常用值，比如 "Win32"、"MacPPC" 以及 "Linuxi586"，等等。
语法
navigator.platform
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Platform: ")
document.write(navigator.platform + "</p>")
</script>
</body>

</html>■◆298■返回OS使用的默认语言                    简化命令：．系统语言■．系统语言■返回 OS 使用的默认语言。




定义和用法
systemLanguage 属性可返回操作系统使用的默认语言。
语法
navigator.systemLanguage
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>SystemLanguage: ")
document.write(navigator.systemLanguage + "</p>")
</script>
</body>

</html>■◆298■返回客户机发送服务器的user-agent头部值  简化命令：．代理头■．代理头■返回由客户机发送服务器的 user-agent 头部的值。



定义和用法
userAgent 属性是一个只读的字符串，声明了浏览器用于 HTTP 请求的用户代理头的值。
一般来讲，它是在 navigator.appCodeName 的值之后加上斜线和 navigator.appVersion 的值构成的。
例如：Mozilla/4.0 (compatible; MSIE 6.0; Windows NT 5.2; SV1; .NET CLR 1.1.4322)。
注：用户代理头：user-agent header。
语法
navigator.userAgent
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>UserAgent: ")
document.write(navigator.userAgent + "</p>")
</script>
</body>

</html>
TIY■◆298■返回 OS 的自然语言设置                  简化命令：．使用者语言■．使用者语言■返回 OS 的自然语言设置。



定义和用法
userLanguage 属性可返回操作系统的自然语言设置。
语法
navigator.userLanguage
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>UserLanguage: ")
document.write(navigator.userLanguage + "</p>")
</script>
</body>

</html>■◆298■规定浏览器是否启用 Java()               简化命令：．可否Java■．可否Java■规定浏览器是否启用 Java。



定义和用法
javaEnabled() 方法可返回一个布尔值，该值指示浏览器是否支持并启用了 Java。如果是，则返回 true，否则返回 false。
语法
navigator.javaEnabled()
提示和注释
提示：可以使用 navigator.javaEnabled() 来检测当前浏览器是否支持 Java，从而知道浏览器是否能显示 Java 小程序。
实例
下面的例子讲返回当前浏览器是否已启用 Java 的布尔值：
<html>
<body>

<script type="text/javascript">
alert(navigator.javaEnabled())
</script>

</body>
</html>
输出：
true■◆298■规定是否启用数据污点(data tainting)()   简化命令：．是否污点■．是否污点■规定浏览器是否启用数据污点 (data tainting)。




定义和用法
taintEnabled() 方法可返回一个布尔值，该值声明了当前浏览器是否启用了 data tainting。
语法
navigator.taintEnabled()
实例
下面的例子讲返回当前浏览器是否已启用 data tainting 的布尔值：
<html>
<body>

<script type="text/javascript">
alert(navigator.taintEnabled())
</script>

</body>
</html>
输出：
false■◆237■屏幕■屏幕■Screen 对象
Screen 对象包含有关客户端显示屏幕的信息。
注释：没有应用于 screen 对象的公开标准，不过所有浏览器都支持该对象。
IE: Internet Explorer, F: Firefox, O: Opera.




Screen 对象描述
每个 Window 对象的 screen 属性都引用一个 Screen 对象。Screen 对象中存放着有关显示浏览器屏幕的信息。JavaScript 程序将利用这些信息来优化它们的输出，以达到用户的显示要求。例如，一个程序可以根据显示器的尺寸选择使用大图像还是使用小图像，它还可以根据显示器的颜色深度选择使用 16 位色还是使用 8 位色的图形。另外，JavaScript 程序还能根据有关屏幕尺寸的信息将新的浏览器窗口定位在屏幕中间。■◆314■返回除系统任务栏显示屏幕的高度          简化命令：．屏高■．屏高■返回显示屏幕的高度 (除 Windows 任务栏之外)。




定义和用法
availHeight 属性声明了显示浏览器的屏幕的可用高度，以像素计。在 Windows 这样的操作系统中，这个可用高度不包括分配给半永久特性（如屏幕底部的任务栏）的垂直空间。
语法
screen.availHeight
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Available Height: ")
document.write(screen.availHeight + "</p>")
</script>
</body>

</html>■◆314■返回除系统任务栏显示屏幕的宽度          简化命令：．屏宽■．屏宽■返回显示屏幕的宽度 (除 Windows 任务栏之外)。




定义和用法
availWidth 属性声明了显示浏览器的屏幕的可用宽度，以像素计。在 Windows 这样的操作系统中，这个可用高度不包括分配给半永久特性（如屏幕底部的任务栏）的垂直空间。
语法
screen.availWidth
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Available Width: ")
document.write(screen.availWidth + "</p>")
</script>
</body>

</html>■◆314■设置或返回调色板的比特深度              简化命令：．色板深■．色板深■设置或返回调色板的比特深度。



定义和用法
bufferDepth 属性设置或返回在 off-screen bitmap buffer 中调色板的比特深度。
语法
screen.bufferDepth=number
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Buffer Depth: ")
document.write(screen.bufferDepth + "</p>")
</script>
</body>

</html>■◆314■返回目标设备或缓冲器上调色板比特深度    简化命令：．设备色深■．设备色深■返回目标设备或缓冲器上的调色板的比特深度。



定义和用法
colorDepth 属性返回目标设备或缓冲器上的调色板的比特深度。
语法
screen.colorDepth
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Color Depth: ")
document.write(screen.colorDepth + "</p>")
</script>
</body>

</html>
TIY■◆314■返回显示屏幕的每英寸水平点数            简化命令：．英寸横点■．英寸横点■返回显示屏幕的每英寸水平点数。



定义和用法
deviceXDPI 属性返回显示屏幕的每英寸水平点数。
语法
screen.deviceXDPI
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Device XDPI: ")
document.write(screen.deviceXDPI + "</p>")
</script>
</body>

</html>
TIY■◆314■返回显示屏幕的每英寸垂直点数            简化命令：．英寸竖点■．英寸竖点■返回显示屏幕的每英寸垂直点数。



定义和用法
deviceYDPI 属性返回显示屏幕的每英寸垂直点数。
语法
screen.deviceYDPI
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Device YDPI: ")
document.write(screen.deviceYDPI + "</p>")
</script>
</body>

</html>
TIY
检测有关客户机的屏幕的细节■◆314■返回用户是否在显示控制面板启用字体平滑  简化命令：．字体平滑■．字体平滑■返回用户是否在显示控制面板中启用了字体平滑。



定义和用法
fontSmoothingEnabled 属性返回用户是否在显示控制面板中启用了字体平滑。
语法
sscreen.fontSmoothingEnabled
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>FontSmoothingEnabled: ")
document.write(screen.fontSmoothingEnabled + "</p>")
</script>
</body>

</html>■◆314■返回显示屏幕的高度                      简化命令：．全高■．全高■返回显示屏幕的高度。



定义和用法
height 属性声明了显示浏览器的屏幕的高度，以像素计。
语法
screen.height
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Height: ")
document.write(screen.height + "</p>")
</script>
</body>

</html>
TIY■◆314■返回显示屏幕每英寸的水平方向的常规点数  简化命令：．横常规点■．横常规点■返回显示屏幕每英寸的水平方向的常规点数。



定义和用法
logicalXDPI 属性可返回显示屏幕每英寸的水平方向的常规点数。
语法
screen.logicalXDPI
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Logical XDPI: ")
document.write(screen.logicalXDPI + "</p>")
</script>
</body>

</html>
TIY■◆314■返回显示屏幕每英寸的垂直方向的常规点数  简化命令：．竖常规点■．竖常规点■返回显示屏幕每英寸的垂直方向的常规点数。



定义和用法
logicalYDPI 属性可返回显示屏幕每英寸的垂直方向的常规点数。
语法
screen.logicalYDPI
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Logical YDPI: ")
document.write(screen.logicalYDPI + "</p>")
</script>
</body>

</html>■◆314■返回显示屏幕颜色分辨率即比特每像素      简化命令：．分辨率■．分辨率■返回显示屏幕的颜色分辨率（比特每像素）。




定义和用法
pixelDepth 属性返回显示屏幕的颜色分辨率（比特每像素）。
语法
screen.pixelDepth
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Pixel Depth: ")
document.write(screen.pixelDepth + "</p>")
</script>
</body>

</html>■◆314■设置或返回屏幕的刷新率                  简化命令：．刷新率■．刷新率■设置或返回屏幕的刷新率。



定义和用法
updateInterval 属性可设置或返回屏幕的刷新率。
语法
screen.updateInterval=number
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Update Interval: ")
document.write(screen.updateInterval + "</p>")
</script>
</body>

</html>
TIY■◆314■返回显示器屏幕的宽度                    简化命令：．全宽■．全宽■返回显示器屏幕的宽度。



定义和用法
width 属性声明了显示浏览器的屏幕的宽度，以像素计。
语法
screen.width
实例
<html>

<body>
<script type="text/javascript">
document.write("<p>Width: ")
document.write(screen.width + "</p>")
</script>
</body>

</html>
TIY■◆237■历史■历史■History 对象
History 对象包含用户（在浏览器窗口中）访问过的 URL。
History 对象是 window 对象的一部分，可通过 window.history 属性对其进行访问。
注释：没有应用于 History 对象的公开标准，不过所有浏览器都支持该对象。
IE: Internet Explorer, F: Firefox, O: Opera.



History 对象描述
History 对象最初设计来表示窗口的浏览历史。但出于隐私方面的原因，History 对象不再允许脚本访问已经访问过的实际 URL。唯一保持使用的功能只有 back()、forward() 和 go() 方法。
例子
下面一行代码执行的操作与单击后退按钮执行的操作一样：
history.back()
下面一行代码执行的操作与单击两次后退按钮执行的操作一样：
history.go(-2)■◆328■返回浏览器历史列表中的 URL 数量         简化命令：．URL数■．URL数■返回浏览器历史列表中的 URL 数量。



length 属性声明了浏览器历史列表中的元素数量。
注释：IE 6 和 Opera 9 以 0 开始，而 Firefox 1.5 以 1 开始。
语法
history.length
实例
<html>
<body>

<script type="text/javascript">
document.write(history.length);
</script>

</body>
</html>
输出类似：
3
TIY
使用 history 对象的 length 属性■◆328■加载history列表中的前一个URL()          简化命令：．前个■．前个■加载 history 列表中的前一个 URL。



定义和用法
back() 方法可加载历史列表中的前一个 URL（如果存在）。
调用该方法的效果等价于点击后退按钮或调用 history.go(-1)。
语法
history.back()
实例
下面的例子可在页面上创建一个后退按钮：
<html>
<head>
<script type="text/javascript">
function goBack()
  {
  window.history.back()
  }
</script>
</head>
<body>

<input type="button" value="Back" onclick="goBack()" />

</body>
</html>■◆328■加载history列表中的下一个 URL()         简化命令：．下个■．下个■加载 history 列表中的下一个 URL。




定义和用法
forward() 方法可加载历史列表中的下一个 URL。
调用该方法的效果等价于点击前进按钮或调用 history.go(1)。
语法
history.forward()
实例
下面的例子可以在页面上创建一个前进按钮：
<html>
<head>
<script type="text/javascript">
function goForward()
  {
  window.history.forward()
  }
</script>
</head>
<body>

<input type="button" value="Forward" onclick="goForward()" />

</body>
</html>■◆328■加载 history 列表中的某个具体页面()     简化命令：．跳到■．跳到■加载 history 列表中的某个具体页面。



定义和用法
go() 方法可加载历史列表中的某个具体的页面。
语法
history.go(number|URL)
说明
URL 参数使用的是要访问的 URL，或 URL 的子串。而 number 参数使用的是要访问的 URL 在 History 的 URL 列表中的相对位置。
实例
下面例子会加载历史列表中的前一个页面：
<html>
<head>
<script type="text/javascript">
function goBack()
  {
  window.history.go(-1)
  }
</script>
</head>
<body>

<input type="button" value="Back" onclick="goBack()" />

</body>
</html>■◆237■锚信息■锚信息■Location 对象
Location 对象包含有关当前 URL 的信息。
Location 对象是 Window 对象的一个部分，可通过 window.location 属性来访问。
例子
把用户带到一个新的地址
IE: Internet Explorer, F: Firefox, O: Opera.




Location 对象描述
Location 对象存储在 Window 对象的 Location 属性中，表示那个窗口中当前显示的文档的 Web 地址。它的 href 属性存放的是文档的完整 URL，其他属性则分别描述了 URL 的各个部分。这些属性与 Anchor 对象（或 Area 对象）的 URL 属性非常相似。当一个 Location 对象被转换成字符串，href 属性的值被返回。这意味着你可以使用表达式 location 来替代 location.href。
不过 Anchor 对象表示的是文档中的超链接，Location 对象表示的却是浏览器当前显示的文档的 URL（或位置）。但是 Location 对象所能做的远远不止这些，它还能控制浏览器显示的文档的位置。如果把一个含有 URL 的字符串赋予 Location 对象或它的 href 属性，浏览器就会把新的 URL 所指的文档装载进来，并显示出来。
除了设置 location 或 location.href 用完整的 URL 替换当前的 URL 之外，还可以修改部分 URL，只需要给 Location 对象的其他属性赋值即可。这样做就会创建新的 URL，其中的一部分与原来的 URL 不同，浏览器会将它装载并显示出来。例如，假设设置了Location对象的 hash 属性，那么浏览器就会转移到当前文档中的一个指定的位置。同样，如果设置了 search 属性，那么浏览器就会重新装载附加了新的查询字符串的 URL。
除了 URL 属性外，Location 对象的 reload() 方法可以重新装载当前文档，replace() 可以装载一个新文档而无须为它创建一个新的历史记录，也就是说，在浏览器的历史列表中，新文档将替换当前文档。■◆333■设置或返回从井号(#)开始的URL即锚        简化命令：．锚■．锚■设置或返回从井号 (#) 开始的 URL（锚）。



定义和用法
hash 属性是一个可读可写的字符串，该字符串是 URL 的锚部分（从 # 号开始的部分）。
语法
location.hash=anchorname
实例
假设当前的 URL 是: http://example.com:1234/test.htm#part2：
<html>
<body>

<script type="text/javascript">
document.write(location.hash);
</script>

</body>
</html>
输出：
#part2
TIY
使用 location 对象的 hash 属性
锚的数组
本例打开两个窗口。第一个窗口中包含四个按钮。第二个窗口定义了四个锚。当点击第一个窗口中的某个按钮时，onclick 事件句柄会到达第二个窗口指定的锚。■◆333■设置或返回主机名和当前URL的端口号       简化命令：．主机端口■．主机端口■设置或返回主机名和当前 URL 的端口号。



定义和用法
host 属性是一个可读可写的字符串，可设置或返回当前 URL 的主机名称和端口号。
语法
location.host
实例
假设当前的 URL 是: http://example.com:1234/test.htm#part2：
<html>
<body>

<script type="text/javascript">
document.write(location.host);
</script>

</body>
</html>
输出：
example.com:1234
TIY
使用 location 对象的 host 属性■◆333■设置或返回当前 URL 的主机名             简化命令：．主机名■．主机名■设置或返回当前 URL 的主机名。



定义和用法
hostname 属性是一个可读可写的字符串，可设置或返回当前 URL 的主机名。
语法
location.hostname
实例
假设当前的 URL 是: http://example.com:1234/test.htm#part2：
<html>
<body>

<script type="text/javascript">
document.write(location.hostname);
</script>

</body>
</html>
输出：
example.com
TIY
使用 location 对象的 hostname 属性■◆333■设置或返回完整的 URL                    简化命令：．完整URL■．完整URL■设置或返回完整的 URL。



定义和用法
href 属性是一个可读可写的字符串，可设置或返回当前显示的文档的完整 URL。
因此，我们可以通过为该属性设置新的 URL，使浏览器读取并显示新的 URL 的内容。
语法
location.href=URL
实例
假设当前的 URL 是: http://example.com:1234/test.htm#part2：
<html>
<body>

<script type="text/javascript">
document.write(location.href);
</script>

</body>
</html>
输出：
http://example.com:1234/test.htm#part2
TIY
使用 location 对象的 href 属性■◆333■设置或返回当前URL的路径部分             简化命令：．URL路径■．URL路径■设置或返回当前 URL 的路径部分。



定义和用法
pathname 属性是一个可读可写的字符串，可设置或返回当前 URL 的路径部分。
语法
location.pathname=path
实例
假设当前的 URL 是: http://example.com:1234/test/test.htm#part2：
<html>
<body>

<script type="text/javascript">
document.write(location.pathname);
</script>

</body>
</html>
输出：
/test/test.htm
TIY■◆333■设置或返回当前 URL 的端口号             简化命令：．端口■．端口■设置或返回当前 URL 的端口号。



定义和用法
port 属性是一个可读可写的字符串，可设置或返回当前 URL 的端口部分。
语法
location.port=portnumber
实例
假设当前的 URL 是: http://example.com:1234/test.htm#part2：
<html>
<body>

<script type="text/javascript">
document.write(location.port);
</script>

</body>
</html>
输出：
1234
TIY
使用 location 对象的 port 属性■◆333■设置或返回当前 URL 的协议               简化命令：．协议■．协议■设置或返回当前 URL 的协议。



定义和用法
protocol 属性是一个可读可写的字符串，可设置或返回当前 URL 的协议。
语法
location.protocol=path
实例
假设当前的 URL 是: http://example.com:1234/test.htm#part2：
<html>
<body>

<script type="text/javascript">
document.write(location.protocol);
</script>

</body>
</html>
输出：
http:
TIY
使用 location 对象的 protocol 属性■◆333■设置或返回从问号(?)开始的URL查询部分    简化命令：．查询■．查询■设置或返回从问号 (?) 开始的 URL（查询部分）。



定义和用法
search 属性是一个可读可写的字符串，可设置或返回当前 URL 的查询部分（问号 ? 之后的部分）。
语法
location.search=path_from_questionmark
实例
假设当前的 URL 是: http://www.w3school.com.cn/tiy/t.asp?f=hdom_loc_search
<html>
<body>

<script type="text/javascript">
document.write(location.search);
</script>

</body>
</html>
输出：
?f=hdom_loc_search
TIY
使用 location 的 search 属性■◆333■加载新的文档()                          简化命令：．加载文档■．加载文档■加载新的文档。



定义和用法
assign() 方法可加载一个新的文档。
语法
location.assign(URL)
实例
下面的例子将使用 assign() 来加载一个新的文档：
<html>
<head>
<script type="text/javascript">
function newDoc()
  {
  window.location.assign("http://www.w3school.com.cn")
  }
</script>
</head>
<body>

<input type="button" value="Load new document" onclick="newDoc()" />

</body>
</html>
TIY■◆333■重新加载当前文档()                      简化命令：．重载■．重载■重新加载当前文档。



定义和用法
reload() 方法用于重新加载当前文档。
语法
location.reload(force)
说明
如果该方法没有规定参数，或者参数是 false，它就会用 HTTP 头 If-Modified-Since 来检测服务器上的文档是否已改变。如果文档已改变，reload() 会再次下载该文档。如果文档未改变，则该方法将从缓存中装载文档。这与用户单击浏览器的刷新按钮的效果是完全一样的。
如果把该方法的参数设置为 true，那么无论文档的最后修改日期是什么，它都会绕过缓存，从服务器上重新下载该文档。这与用户在单击浏览器的刷新按钮时按住 Shift 健的效果是完全一样。
实例
<html>
<head>
<script type="text/javascript">
function reloadPage()
  {
  window.location.reload()
  }
</script>
</head>

<body>
<input type="button" value="Reload page"
onclick="reloadPage()" />
</body>

</html>
TIY
使用 location 的 reload() 方法■◆333■用新的文档替换当前文档()                简化命令：．新载■．新载■用新的文档替换当前文档。



定义和用法
replace() 方法可用一个新文档取代当前文档。
语法
location.replace(newURL)
说明
replace() 方法不会在 History 对象中生成一个新的记录。当使用该方法时，新的 URL 将覆盖 History 对象中的当前记录。
实例
下面的例子将使用 replace() 方法来替换当前文档：
<html>
<head>
<script type="text/javascript">
function replaceDoc()
  {
  window.location.replace("http://www.w3school.com.cn")
  }
</script>
</head>
<body>

<input type="button" value="Replace document" onclick="replaceDoc()" />

</body>
</html>
TIY■◆-1■HTMLDOM（网页操作）对象■■■◆345■文档■文档■Document 对象
每个载入浏览器的 HTML 文档都会成为 Document 对象。
Document 对象使我们可以从脚本中对 HTML 页面中的所有元素进行访问。
提示：Document 对象是 Window 对象的一部分，可通过 window.document 属性对其进行访问。



Document 对象描述
HTMLDocument 接口对 DOM Document 接口进行了扩展，定义 HTML 专用的属性和方法。
很多属性和方法都是 HTMLCollection 对象（实际上是可以用数组或名称索引的只读数组），其中保存了对锚、表单、链接以及其他可脚本元素的引用。
这些集合属性都源自于 0 级 DOM。它们已经被 Document.getElementsByTagName() 所取代，但是仍然常常使用，因为他们很方便。
write() 方法值得注意，在文档载入和解析的时候，它允许一个脚本向文档中插入动态生成的内容。
注意，在 1 级 DOM 中，HTMLDocument 定义了一个名为 getElementById() 的非常有用的方法。在 2 级 DOM 中，该方法已经被转移到了 Document 接口，它现在由 HTMLDocument 继承而不是由它定义了。■◆346■提供对文档中所有HTML元素的访问［集合］  简化命令：．所有■．所有■提供对文档中所有 HTML 元素的访问。



定义和用法
all 集合返回对文档中所有 HTML 元素的引用。
语法
document.all[i]
document.all[name]
document.all.tags[tagname]
说明
all[] 是一个多功能的类似数组的对象，它提供了对文档中所有 HTML 元素的访问。all[] 数组源自 IE 4 并且已经被很多其他的浏览器所采用。
all[] 已经被 Document 接口的标准的 getElementById() 方法和 getElementsByTagName() 方法以及 Document 对象的 getElementsByName() 方法所取代。尽管如此，这个 all[] 数组在已有的代码中仍然使用。
all[] 包含的元素保持了最初的顺序，如果你知道它们在数组中的确切数字化位置，可以直接从数组中提取它们。然而，更为常见的是使用 all[] 数组，根据它们的 HTML 属性 name 或 id 来访问元素。如果多个元素拥有指定的 name，将得到共享同一名称的元素的一个数组。■◆346■返回对文档中所有Anchor对象的引用［集合］简化命令：．链接■．链接■返回对文档中所有 Anchor 对象的引用。



定义和用法
anchors 集合可返回对文档中所有 Anchor 对象的引用。
语法
document.anchors[]
实例
<html>

<body>
<a name="first">First anchor</a><br />
<a name="second">Second anchor</a><br />
<a name="third">Third anchor</a><br />
<br />

Number of anchors in this document:
<script type="text/javascript">
document.write(document.anchors.length)
</script>
</body>

</html>
TIY
返回文档中锚的数目
返回文档中第一个锚的 innerHTML■◆346■返回对文档中所有Applet对象的引用［集合］简化命令：．java程序■．java程序■返回对文档中所有 Applet 对象的引用。



■◆346■返回对文档中所有Form对象引用［集合］    简化命令：．表单集■．表单集■返回对文档中所有 Form 对象引用。



义和用法
forms 集合可返回对文档中所有 Form 对象的引用。
语法
document.forms[]
实例
<html>
<body>

<form name="Form1"></form>
<form name="Form2"></form>
<form name="Form3"></form>

<script type="text/javascript">
document.write("This document contains: ")
document.write(document.forms.length + " forms.")
</script>

</body>
</html>
TIY
计算文档中表单的数目
访问集合中的项目■◆346■返回对文档中所有 Image 对象引用［集合］ 简化命令：．图像集■．图像集■返回对文档中所有 Image 对象引用。



定义和用法
images 集合可返回对文档中所有 Image 对象的引用。
语法
document.images[]
提示和注释
注释：为了与 0 级 DOM 兼容，该集合不包括由 <object> 标记定义的图像。
实例
<html>

<body>
<img border="0" src="hackanm.gif" width="48" height="48">
<br />
<img border="0" src="compman.gif" width="107" height="98">
<br /><br />

<script type="text/javascript">
document.write("This document contains: ")
document.write(document.images.length + " images.")
</script>
</body>

</html>
TIY
计算文档中的图像数目■◆346■返回对文档中所有Area和Link的引用［集合］简化命令：．资源集■．资源集■返回对文档中所有Area和 Link 对象引用。



定义和用法
links 集合可返回对文档中所有 Area 和 Link 对象的引用。
语法
document.links[]
实例
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>
<br />

Number of links in this document:
<script type="text/javascript">
document.write(document.links.length)
</script>

</body>
</html>
TIY
返回文档中链接的数目
返回文档中第一个链接的 id■◆346■提供对body元素的直接访问                简化命令：．主体■．主体■提供对 <body> 元素的直接访问。
对于定义了框架集的文档，该属性引用最外层的 <frameset>。■◆346■设置或返回与当前文档有关的所有cookie    简化命令：．识码■．识码■设置或返回与当前文档有关的所有 cookie。



定义和用法
cookie 属性可设置或查询与当前文档相关的所有 cookie。
语法
document.cookie
说明
该属性是一个可读可写的字符串，可使用该属性对当前文档的 cookie 进行读取、创建、修改和删除操作。
提示和注释
提示：该属性的行为与普通的读/写属性是不同的。
实例
<html>
<body>

The cookies associated with this document is: 
<script type="text/javascript">
document.write(document.cookie)
</script>

</body>
</html>
TIY
返回与当前文档相关的 cookie■◆346■返回当前文档的域名                      简化命令：．域名■．域名■返回当前文档的域名。



定义和用法
domain 属性可返回下载当前文档的服务器域名。
语法
document.domain
说明
该属性是一个只读的字符串，包含了载入当前文档的 web 服务器的主机名。
提示和注释
提示：domain 属性可以解决因同源安全策略带来的不同文档的属性共享问题。
点击这里，了解同源安全策略的详细信息。
实例
<html>
<body>

The domain name for this document is: 
<script type="text/javascript">
document.write(document.domain)
</script>

</body>
</html>
亲自试一试
TIY
返回下载当前文档的服务器域名■◆346■返回文档被最后修改的日期和时间          简化命令：．修改时间■．修改时间■返回文档被最后修改的日期和时间。



定义和用法
lastModified 属性可返回文档最后被修改的日期和时间。
语法
document.lastModified
说明
该值来自于 Last-Modified HTTP 头部，它是由 Web 服务器发送的可选项。
实例
<html>
<body>

This document was last modified on:
<script type="text/javascript">
document.write(document.lastModified)
</script>

</body>
</html>
TIY
返回文档最近被修改的日期和时间■◆346■返回载入当前文档的文档的 URL            简化命令：．载入URL■．载入URL■返回载入当前文档的文档的 URL。



定义和用法
referrer 属性可返回载入当前文档的文档的 URL。
语法
document.referrer
说明
如果当前文档不是通过超级链接访问的，则为 null。这个属性允许客户端 JavaScript 访问 HTTP 引用头部。
实例
<html>
<body>

The referrer of this document is:
<script type="text/javascript">
document.write(document.referrer)
</script>

</body>
</html>
TIY
返回当前文档的 referrer■◆346■返回当前文档的标题                      简化命令：．标题■．标题■返回当前文档的标题。



定义和用法
title 属性可返回当前文档的标题（ HTML title 元素中的文本）。
语法
document.title
实例
<html>
<head>
<title>My title</title>
</head>

<body>
The title of the document is: 
<script type="text/javascript">
document.write(document.title)
</script>
</body>

</html>
TIY
返回当前文档的标题■◆346■返回当前文档的 URL                      简化命令：．文档URL■．文档URL■返回当前文档的 URL。


定义和用法
URL 属性可返回当前文档的 URL。
语法
document.URL
说明
一般情况下，该属性的值与包含文档的 Window 的 location.href 属性相同。不过，在 URL 重定向发生的时候，这个 URL 属性保存了文档的实际 URL，而 location.href 保存了请求的 URL。
实例
<html>

<body>
The URL of this document is: 
<script type="text/javascript">
document.write(document.URL)
</script>
</body>

</html>
TIY
返回当前文档的 URL■◆346■关闭文档．打开()输出流并显示选定数据()　简化命令：．关闭■．关闭■关闭用  document.open() 方法打开的输出流，并显示选定的数据。



定义和用法
close() 方法可关闭一个由 document.open 方法打开的输出流，并显示选定的数据。
语法
document.close()
说明
该方法将关闭 open() 方法打开的文档流，并强制地显示出所有缓存的输出内容。如果您使用 write() 方法动态地输出一个文档，必须记住当你这么做的时候要调用 close() 方法，以确保所有文档内容都能显示。
一旦调用了 close()，就不应该再次调用 write()，因为这会隐式地调用 open() 来擦除当前文档并开始一个新的文档。
实例
<html>
<head>
<script type="text/javascript">
function createNewDoc()
  {
  var newDoc=document.open("text/html","replace");
  var txt="<html><body>Learning about the DOM is FUN!</body></html>";
  newDoc.write(txt);
  newDoc.close();
  }
</script>
</head>
<body>

<input type="button" value="Write to a new document"
onclick="createNewDoc()">

</body>
</html>
TIY
打开一个新的文档，添加一些文本，然后关闭它。
在新窗口打开新的文档，并添加一些文本。


■◆346■返回对拥有指定id的第一个对象的引用()    简化命令：．取ｉｄ■．取ｉｄ■返回对拥有指定 id 的第一个对象的引用。



定义和用法
getElementById() 方法可返回对拥有指定 ID 的第一个对象的引用。
语法
document.getElementById(id)
说明
HTML DOM 定义了多种查找元素的方法，除了 getElementById() 之外，还有 getElementsByName() 和 getElementsByTagName()。
不过，如果您需要查找文档中的一个特定的元素，最有效的方法是 getElementById()。
在操作文档的一个特定的元素时，最好给该元素一个 id 属性，为它指定一个（在文档中）唯一的名称，然后就可以用该 ID 查找想要的元素。
实例
例子 1
<html>
<head>
<script type="text/javascript">
function getValue()
  {
  var x=document.getElementById("myHeader")
  alert(x.innerHTML)
  }
</script>
</head>
<body>

<h1 id="myHeader" onclick="getValue()">This is a header</h1>
<p>Click on the header to alert its value</p>

</body>
</html>
例子 2
getElementById() 是一个重要的方法，在 DOM 程序设计中，它的使用非常常见。我们为您定义了一个工具函数，这样您就可以通过一个较短的名字来使用 getElementById() 方法了：
function id(x) {
  if (typeof x == "string") return document.getElementById(x);
  return x;
  }
上面这个函数接受元素 ID 作为它们的参数。对于每个这样的参数，您只要在使用前编写 x = id(x) 就可以了。
TIY
使用 getElementById()■◆346■返回带有指定名称的对象集合()            简化命令：．取名■．取名■返回带有指定名称的对象集合。



定义和用法
getElementsByName() 方法可返回带有指定名称的对象的集合。
语法
document.getElementsByName(name)
该方法与 getElementById() 方法相似，但是它查询元素的 name 属性，而不是 id 属性。
另外，因为一个文档中的 name 属性可能不唯一（如 HTML 表单中的单选按钮通常具有相同的 name 属性），所有 getElementsByName() 方法返回的是元素的数组，而不是一个元素。
实例
<html>
<head>
<script type="text/javascript">
function getElements()
  {
  var x=document.getElementsByName("myInput");
  alert(x.length);
  }
</script>
</head>
<body>

<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<br />
<input type="button" onclick="getElements()"
value="How many elements named 'myInput'?" />

</body>
</html>
TIY
使用 getElementsByName()■◆346■返回带有指定标签名的对象集合()          简化命令：．取标■．取标■返回带有指定标签名的对象集合。



定义和用法
getElementsByTagName() 方法可返回带有指定标签名的对象的集合。
语法
document.getElementsByTagName(tagname)
说明
getElementsByTagName() 方法返回元素的顺序是它们在文档中的顺序。
如果把特殊字符串 "*" 传递给 getElementsByTagName() 方法，它将返回文档中所有元素的列表，元素排列的顺序就是它们在文档中的顺序。
提示和注释
注释：传递给 getElementsByTagName() 方法的字符串可以不区分大小写。
实例
例子 1
<html>
<head>
<script type="text/javascript">
function getElements()
  {
  var x=document.getElementsByTagName("input");
  alert(x.length);
  }
</script>
</head>
<body>

<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<input name="myInput" type="text" size="20" /><br />
<br />
<input type="button" onclick="getElements()"
value="How many input elements?" />

</body>
</html>
例子 2
可以用 getElementsByTagName() 方法获取任何类型的 HTML 元素的列表。例如，下面的代码可获取文档中所有的表：
var tables = document.getElementsByTagName("table");
alert ("This document contains " + tables.length + " tables");
例子 3
如果您非常了解文档的结构，也可以使用 getElementsByTagName() 方法获取文档中的一个特定的元素。例如，下面的代码可以获得文档中的第四个段落：
var myParagragh = document.getElementsByTagName("p")[3];
不过，我们还是认为，如果您需要操作某个特定的元素，使用 getElementById() 方法将更为有效。
TIY
使用 getElementsByTagName()■◆346■打开流收集.输出()或.writeln()输出()     简化命令：．打开■．打开■打开一个流，以收集来自任何 document.write() 或 document.writeln() 方法的输出。



定义和用法
open() 方法可打开一个新文档，并擦除当前文档的内容。
语法
document.open(mimetype,replace)
参数	描述
mimetype	可选。规定正在写的文档的类型。默认值是 "text/html"。
replace	可选。当此参数设置后，可引起新文档从父文档继承历史条目。
说明
该方法将擦除当前 HTML 文档的内容，开始一个新的文档，新文档用 write() 方法或 writeln() 方法编写。
提示和注释
重要事项：调用 open() 方法打开一个新文档并且用 write() 方法设置文档内容后，必须记住用 close 方法关闭文档，并迫使其内容显示出来。
注释：属于被覆盖的文档的一部分的脚本或事件句柄不能调用该方法，因为脚本或事件句柄自身也会被覆盖。
实例
<html>
<head>
<script type="text/javascript">
function createNewDoc()
  {
  var newDoc=document.open("text/html","replace");
  var txt="<html><body>Learning about the DOM is FUN!</body></html>";
  newDoc.write(txt);
  newDoc.close();
  }
</script>
</head>
<body>

<input type="button" value="Write to a new document"
onclick="createNewDoc()">

</body>
</html>
TIY
打开一个新的文档，添加一些文本，然后关闭它。
在新窗口打开新的文档，并添加一些文本。■◆346■向文档写HTML表达式或JavaScript代码()    简化命令：．输出■．输出■向文档写 HTML 表达式 或 JavaScript 代码。



定义和用法
write() 方法可向文档写入 HTML 表达式或 JavaScript 代码。
可列出多个参数(exp1,exp2,exp3,...) ，它们将按顺序被追加到文档中。
语法
document.write(exp1,exp2,exp3,....)
说明
虽然根据 DOM 标准，该方法只接受单个字符串作为参数。不过根据经验，write() 可接受任何多个参数。
我们通常按照两种的方式使用 write() 方法：一是在使用该方在文档中输出 HTML，另一种是在调用该方法的的窗口之外的窗口、框架中产生新文档。在第二种情况中，请务必使用 close() 方法来关闭文档。
实例
<html>
<body>

<script type="text/javascript">
document.write("Hello World!");
</script>

</body>
</html>
TIY
使用 document.write() 向输出流写文本
使用 document.write() 向输出流写 HTML
使用多参数的 document.write()■◆346■等同输出()方法且每个表达式后写换行符()  简化命令：．换行输出■．换行输出■等同于 write() 方法，不同的是在每个表达式之后写一个换行符。



定义和用法
writeln() 方法与 write() 方法作用相同，外加可在每个表达式后写一个换行符。
语法
document.writeln(exp1,exp2,exp3,....)
提示和注释
提示：在编写 <pre> 标记的内容时，该方法很有用。
实例
<html>
<body>

<script type="text/javascript">
document.writeln("Hello World!");
</script>

</body>
</html>
TIY
使用 document.write() 向输出流写文本
使用 document.write() 向输出流写 HTML
使用多参数的 document.write()■◆346■返回包含指定类名的所有元素的节点列表()  简化命令：．取类■．取类■返回包含带有指定类名的所有元素的节点列表。



因为IE浏览器不支持getElementsByClassName，所以你要自己写一个方法得到class

但是火狐浏览器知道getElementsByClassName，可以直接的用

 

<html>
<head>
    <title></title>
    <script type="text/javascript">
        window.onload = function () {
            var tagName = getClass("div", "a1");

           //因为返回的是包含多个元素的数组，所以要遍历一下
            for (var i = 0; i < tagName.length; i++) { 

                tagName[i].innerHTML = "你好";
            }
           
            var tagName = getClass("div", "a2");
            for (var i = 0; i < tagName.length; i++) {
                tagName[i].innerHTML = "ALL好";
            }
        }

        function getClass(tagname, className) { //tagname指元素，className指class的值

         //判断浏览器是否支持getElementsByClassName，如果支持就直接的用
            if (document.getElementsByClassName) {   

                return getElementsByClassName(className);
            }
            else {    //当浏览器不支持getElementsByClassName的时候用下面的方法
                var tagname = document.getElementsByTagName_r(tagname);  //获取指定元素
                var tagnameAll = [];     //这个数组用于存储所有符合条件的元素
                for (var i = 0; i < tagname.length; i++) {     //遍历获得的元素
                    if (tagname[i].className == className) {     //如果获得的元素中的class的值等于指定的类名，就赋值给tagnameAll
                        tagnameAll[tagnameAll.length] = tagname[i];
                    }
                }
                return tagnameAll;
            }
        }
    </script>
</head>
<body>
<div class="a1"></div>
<div class="a1"></div>
<div class="a1"></div>
<div class="a1"></div>
<div class="a2"></div>
<div class="a2"></div>
<div class="a2"></div>
<div class="a2"></div>
</body>
</html>

我建议不要用上面的方法，用JQuery，可以省去很多的代码
■◆346■把新的子节点添加到指定节点()            简化命令：．加节点■．加节点■把新的子节点添加到指定节点。



appendChild() 方法在指定元素节点的最后一个子节点之后添加节点。

该方法返回新的子节点。

注意: 

appendChild()方法通常与document.createElement("div")或document.getElementById("id")函数同用，表示先创建然后再添加。

appendChild()的参数不是字符串而是一个对象。

如 nDiv = document.createElement("div");document.body.appendChild(nDiv);这个nDiv是没有引号的，是个div对象。 

html

[html] view plaincopyprint?<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">  
<html xmlns="http://www.w3.org/1999/xhtml">  
<head>  
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />  
<title>appendChild</title>  
<style>   
div{ background:#0000FF;width:100px;height:100px;}    
span{ background:#00FF00;width:100px;height:100px;}    
p{ background:#FF0000;width:100px;height:100px;}    
</style>   
</head>   
<body>   
<div id="a"><span>SPAN</span>DIV</div>   
<span>SPAN</span>  
<p>P</p>   
<button type="button" onclick=cloneX()>创建新节点</button>  
</body>  
</html>  

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>appendChild</title>
<style> 
div{ background:#0000FF;width:100px;height:100px;}  
span{ background:#00FF00;width:100px;height:100px;}  
p{ background:#FF0000;width:100px;height:100px;}  
</style> 
</head> 
<body> 
<div id="a"><span>SPAN</span>DIV</div> 
<span>SPAN</span>
<p>P</p> 
<button type="button" onclick=cloneX()>创建新节点</button>
</body>
</html>
js

[javascript] view plaincopyprint?function cloneX(){  
    var nDiv = document.createElement("div");  //创建之后必须通过appendChild()之类的函数才能在页面上显示   
    document.body.appendChild(nDiv); //不能用document.appendChild,必须用document.body.appendChild();   
    //var txt = document.createElement("input");   
    try{  
        var txt = document.createElement("<input name='bobo' />")   
        //只有IE可以看到,FF会进行catch(e).这种写法对IE和FF的差别属性很有用，如现在这个name属性，如果用下面FF这种写法，IE不认，所以IE要用上面的写法，其他通用属性可以用下面的写法。   
    }  
    catch(e){  
        var txt = document.createElement("input") //FF通过这种方式做到与IE一样，IE也可以直接用这种方式。   
        txt.name = 'bobo';  
    }  
    txt.style.margin = 10+'px';  
    txt.value = "bobowa";  
    nDiv.appendChild(txt);  
    b = document.getElementsByName("bobo")[0];  
    alert(b.value)  
}  

	function cloneX(){
		var nDiv = document.createElement("div");  //创建之后必须通过appendChild()之类的函数才能在页面上显示
		document.body.appendChild(nDiv); //不能用document.appendChild,必须用document.body.appendChild();
		//var txt = document.createElement("input");
		try{
			var txt = document.createElement("<input name='bobo' />") 
			//只有IE可以看到,FF会进行catch(e).这种写法对IE和FF的差别属性很有用，如现在这个name属性，如果用下面FF这种写法，IE不认，所以IE要用上面的写法，其他通用属性可以用下面的写法。
		}
		catch(e){
			var txt = document.createElement("input") //FF通过这种方式做到与IE一样，IE也可以直接用这种方式。
			txt.name = 'bobo';
		}
		txt.style.margin = 10+'px';
		txt.value = "bobowa";
		nDiv.appendChild(txt);
		b = document.getElementsByName("bobo")[0];
		alert(b.value)
	}
FF怎么获得类似IE,outHTML

html

[html] view plaincopyprint? <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">   
<html xmlns="http://www.w3.org/1999/xhtml">   
<head>   
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />   
<title>获取outerHMTL</title>   
<style>   
div{ background:#0000FF;width:100px;height:100px;}    
span{ background:#00FF00;width:100px;height:100px;}    
p{ background:#FF0000;width:100px;height:100px;}    
</style>   
</head>   
<body>   
<div id="a"><span>SPAN</span>DIV</div>   
<span>SPAN</span>  
<p>P</p>   
</body>  
</html>  

 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> 
<title>获取outerHMTL</title> 
<style> 
div{ background:#0000FF;width:100px;height:100px;}  
span{ background:#00FF00;width:100px;height:100px;}  
p{ background:#FF0000;width:100px;height:100px;}  
</style> 
</head> 
<body> 
<div id="a"><span>SPAN</span>DIV</div> 
<span>SPAN</span>
<p>P</p> 
</body>
</html>
js

[javascript] view plaincopyprint?function getOuterHTML(id){  
 var el = document.getElementById(id);  
 var newNode = document.createElement("div");  
 //document.appendChild(newNode);   
 document.body.appendChild(newNode);  
 var clone = el.cloneNode(true);  
 newNode.appendChild(clone);  
 alert(newNode.innerHTML);  
 document.body.removeChild(newNode);  
}  
getOuterHTML("a");  
■◆346■删除子节点()                            简化命令：．删节点■．删节点■删除子节点。



删除已有的 HTML 元素
如需删除 HTML 元素，您必须清楚该元素的父元素：
实例
<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>
<script>
var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.removeChild(child);
</script>
亲自试一试
例子解释
这个 HTML 文档包含一个带有两个子节点（两个 <p> 元素）的 <div> 元素：
<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>
查找 id="div1" 的元素：
var parent=document.getElementById("div1");
查找 id="p1" 的 <p> 元素：
var child=document.getElementById("p1");
从父元素中删除子元素：
parent.removeChild(child);
提示：能否在不引用父元素的情况下删除某个元素？
很抱歉。DOM 需要了解您需要删除的元素，以及它的父元素。
这里提供一个常用的解决方法：找到您需要删除的子元素，然后使用 parentNode 属性来查找其父元素：
var child=document.getElementById("p1");
child.parentNode.removeChild(child);■◆346■替换子节点()                            简化命令：．换节点■．换节点■替换子节点。



替换 HTML 元素
如需替换 HTML DOM 中的元素，请使用 replaceChild() 方法：
实例
<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>

<script>
var para=document.createElement("p");
var node=document.createTextNode("This is new.");
para.appendChild(node);

var parent=document.getElementById("div1");
var child=document.getElementById("p1");
parent.replaceChild(para,child);
</script>
亲自试一试■◆346■在指定的子节点前面插入新的子节点()      简化命令：．插节点■．插节点■在指定的子节点前面插入新的子节点。



上一个例子中的 appendChild() 方法，将新元素作为父元素的最后一个子元素进行添加。
如果不希望如此，您可以使用 insertBefore() 方法：
实例
<div id="div1">
<p id="p1">This is a paragraph.</p>
<p id="p2">This is another paragraph.</p>
</div>

<script>
var para=document.createElement("p");
var node=document.createTextNode("This is new.");
para.appendChild(node);

var element=document.getElementById("div1");
var child=document.getElementById("p1");
element.insertBefore(para,child);
</script>
亲自试一试■◆346■创建属性节点()                          简化命令：．建属节■．建属节■创建属性节点。■◆346■创建元素节点()                          简化命令：．建元节■．建元节■创建元素节点。■◆346■创建文本节点()                          简化命令：．建文节■．建文节■创建文本节点。■◆346■返回指定的属性值()                      简化命令：．取属性■．取属性■返回指定的属性值。■◆346■把指定属性设置或修改为指定的值()        简化命令：．置属性■．置属性■把指定属性设置或修改为指定的值。■◆345■链接■链接■Anchor 对象
Anchor 对象表示 HTML 超链接。
在 HTML 文档中 <a> 标签每出现一次，就会创建 Anchor 对象。
锚可用于创建指向另一个文档的链接（通过 href 属性），或者创建文档内的书签（通过 name 属性）。
您可以通过搜索 Document 对象中的 anchors[] 数组来访问锚，或者使用 document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆377■设置或返回访问一个链接的快捷键          简化命令：．快捷键■．快捷键■设置或返回访问一个链接的快捷键。



定义和用法
accessKey 属性可设置或返回访问一个链接的键盘按键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
anchorObject.accessKey=accessKey
实例
下面的例子将为链接设置快捷键：
<html>
<head>
<script type="text/javascript">
function accesskey()
  {
  document.getElementById('w3').accessKey="w"
  }
</script>
</head>

<body onload="accesskey()">

<a id="w3" href="http://www.w3school.com.cn/">W3School.com.cn</a>

</body>
</html>
TIY
向超链接添加快捷键■◆377■设置或返回被链接资源的字符集            简化命令：．字符集■．字符集■设置或返回被链接资源的字符集。


定义和用法
charset 属性可设置或返回被链接资源的字符集。
语法
anchorObject.charset=charset
实例
下面的例子可设置被链资源的字符串：
<html>
<body>

<p>
<a id="myAnchor" 
href="http://www.w3school.com.cn">W3School.com.cn</a>
</p>

<script type="text/javascript">
x=document.getElementById("myAnchor");
x.charset="ISO-8859-1";
</script>

</body>
</html>
TIY
设置被链资源的字符串■◆377■设或取逗号列表含图像映射链接的坐标      简化命令：．坐标■．坐标■设置或返回逗号分隔列表，包含了图像映射中链接的坐标。



定义和用法
coords 属性设置或返回一个逗号分隔列表，其中包含了图像映射中一个链接的坐标。
语法
anchorObject.coords=coordinates
实例
下面的例子可返回图像映射中一个链接的坐标：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>Venus coordinates:
<script type="text/javascript">
x=document.getElementById("venus");
document.write(x.coords);
</script>
</p>

</body>
</html>■◆377■设置或返回被链接资源的URL               简化命令：．完整URL■．完整URL■设置或返回被链接资源的 URL。




定义和用法
href 属性可设置或返回被链资源的 URL。
语法
anchorObject.href=URL
实例
下面的例子将更改一个链接的文本、URL 以及 target：
<html>
<head>
<script type="text/javascript">
function changeLink()
{
document.getElementById('myAnchor').innerHTML="W3School";
document.getElementById('myAnchor').href="http://www.w3school.com.cn";
document.getElementById('myAnchor').target="_blank";
}
</script>
</head>

<body>
<a id="myAnchor" href="http://www.microsoft.com">Microsoft</a>
<input type="button" onclick="changeLink()" value="Change link">
</body>

</html>
TIY
更改一个链接的文本、URL 以及 target■◆377■设置或返回被链接资源的语言代码          简化命令：．语言码■．语言码■设置或返回被链接资源的语言代码。



定义和用法
hreflang 属性可设置或返回被链资源的语言代码。
语法
anchorObject.hreflang=languagecode
实例
下面的例子将返回被链资源的语言代码：
<html>
<body>

<p><a id="myAnchor" hreflang="zh-cn" 
href="http://www.w3school.com.cn">W3School.com.cn</a></p>

<script type="text/javascript">
x=document.getElementById("myAnchor");
document.write(x.hreflang);
</script>

</body>
</html>
TIY
取得被链资源的语言代码■◆377■设置或返回一个链接的 id                 简化命令：．id■．id■设置或返回一个链接的 id。



定义和用法
id 属性可返回一个链接的 id。
语法
anchorObject.id=ide
实例
下面的例子可输出一个链接的 id：
<html>
<body>

<p><a id="myAnchor"
href="http://www.w3school.com.cn">Visit W3School.com.cn</a></p>

<script type="text/javascript">
x=document.getElementById("myAnchor");
document.write(x.id);
</script>

</body>
</html>
TIY
取得链接的 id■◆377■设置或返回一个链接的内容                简化命令：．内容■．内容■设置或返回一个链接的内容。


定义和用法
innerHTML 属性设置或返回一个链接的内容。
语法
anchorObject.innerHTML=text
实例
下面的例子将更改一个链接的文本、URL 以及 target：
<html>
<head>
<script type="text/javascript">
function changeLink()
{
document.getElementById('myAnchor').innerHTML="W3School";
document.getElementById('myAnchor').href="http://www.w3school.com.cn";
document.getElementById('myAnchor').target="_blank";
}
</script>
</head>

<body>
<a id="myAnchor" href="http://www.microsoft.com">Microsoft</a>
<input type="button" onclick="changeLink()" value="Change link">
</body>

</html>
TIY
更改一个链接的文本、URL 以及 target■◆377■设置或返回一个链接的名称                简化命令：．名称■．名称■设置或返回一个链接的名称。



定义和用法
name 属性可设置或返回链接的名称。
语法
anchorObject.name=name
实例
下面的例子可返回链接的名称：
<html>
<body>

<p><a id="myAnchor" name="myAnchor"
href="http://www.w3school.com.cn">Visit W3School.com.cn</a></p>

<script type="text/javascript">
x=document.getElementById("myAnchor");
document.write(x.name);
</script>

</body>
</html>
TIY
取得链接的名称■◆377■设置或返回当前文档与目标 URL之间关系    简化命令：．关系■．关系■设置或返回当前文档与目标 URL 之间的关系。



定义和用法
rel 属性可设置或返回到目标文档的关系。
rel 和 rev 属性可以同时在 <a> 标签中使用。
rel (relationship) 属性规定了从源文档到目标文档的关系。rev (reverse) 属性规定了从目标文档到当前文档的反向关系。
浏览器可以使用它们改变锚内容的外观，或者自动构建文档浏览菜单。其他工具也可以使用这些属性构建特殊的链接集合、目录和索引等。
语法
anchorObject.rel=relationship
两个属性均可采用下面的值：
值	描述
appendix	链接到文档的附录页。
alternate	链接到一个备选的源。
bookmark	链接到一个书签。在 web blogs 中常用于 "permalink"。
chapter	从当前文档链接到一个章节。
contents	链接到当前文档的内容目录。
copyright	链接到当前文档的版权或隐私页面。
glossary	链接到当前文档术语表。
index	链接到当前文档的索引。
next	链接到集合中的下一个文档。
prev	链接到集合中的前一个文档。
section	链接到文档列表中的一个小节。
start	链接到当前文档的第一页。
subsection	链接到当前文档列表中的子小节。（一个小节可拥有多个子小节。）
head	链接到集合中的顶级文档。
toc	链接到集合的目录。
parent	链接到源上面的文档。
child	链接到源下面的文档。
实例
下面的例子可返回链接的关系：
<html>
<body>

<p><a id="myAnchor" rel="index"
href="http://www.w3school.com.cn">Visit W3School.com.cn</a></p>

<script type="text/javascript">
x=document.getElementById("myAnchor");
document.write(x.rel);
</script>

</body>
</html>
TIY
取得链接的关系■◆377■rev属性规定了目标文档到当前文档反向关系 简化命令：．反向关系■．反向关系■设置或返回目标 URL 与之间当前文档的关系。



定义和用法
rev 属性可设置或返回一个链接的反向关系。
rel 和 rev 属性可以同时在 <a> 标签中使用。
rel (relationship) 属性规定了从源文档到目标文档的关系。rev (reverse) 属性规定了从目标文档到当前文档的反向关系。
浏览器可以使用它们改变锚内容的外观，或者自动构建文档浏览菜单。其他工具也可以使用这些属性构建特殊的链接集合、目录和索引等。
语法
anchorObject.rev=relationship
两个属性均可采用下面的值：
值	描述
appendix	链接到文档的附录页。
alternate	链接到一个备选的源。
bookmark	链接到一个书签。在 web blogs 中常用于 "permalink"。
chapter	从当前文档链接到一个章节。
contents	链接到当前文档的内容目录。
copyright	链接到当前文档的版权或隐私页面。
glossary	链接到当前文档术语表。
index	链接到当前文档的索引。
next	链接到集合中的下一个文档。
prev	链接到集合中的前一个文档。
section	链接到文档列表中的一个小节。
start	链接到当前文档的第一页。
subsection	链接到当前文档列表中的子小节。（一个小节可拥有多个子小节。）
head	链接到集合中的顶级文档。
toc	链接到集合的目录。
parent	链接到源上面的文档。
child	链接到源下面的文档。
实例
下面的例子可返回链接的反向关系：
<html>
<body>

<p><a id="myAnchor" rev="subsection"
href="/htmldom/prop_anchor_rev.asp">
HTML DOM rev Property</a></p>

<script type="text/javascript">
x=document.getElementById("myAnchor");
document.write(x.rev);
</script>

</body>
</html>
TIY
取得链接的反向关系■◆377■设置或返回图像映射中某个链接的形状      简化命令：．形状■．形状■设置或返回图像映射中某个链接的形状。



定义和用法
shape 属性可设置或返回图像映射中链接的形状。
语法
anchorObject.shape=RECT|CIRCLE|POLY|DEFAULT
实例
下面的例子可返回图像映射中链接的形状：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>Shape of Venus-link:
<script type="text/javascript">
x=document.getElementById("venus");
document.write(x.shape);
</script>
</p>

</body>
</html>
TIY
取得图像映射中链接的形状■◆377■设置或返回某个链接的Tab键控制次序       简化命令：．tab次序■．tab次序■设置或返回某个链接的 Tab 键控制次序。



定义和用法
tabIndex 属性可为链接设置或返回 tab 键控制次序。
语法
anchorObject.tabIndex=tabIndex
实例
下面的例子可更改三个链接的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function changeTabIndex()
  {
  document.getElementById('1').tabIndex="3"
  document.getElementById('2').tabIndex="2"
  document.getElementById('3').tabIndex="1"
  }
</script>
</head>

<body>
<p><a id="1" href="http://www.w3school.com.cn">1</a></p>
<p><a id="2" href="http://www.w3school.com.cn">2</a></p>
<p><a id="3" href="http://www.w3school.com.cn">3</a></p>

<input type="button" onclick="changeTabIndex()"
value="Change TabIndex" />

</body>
</html>
TIY
为链接设置 tab 键控制次序■◆377■设置或返回在何处打开链接                简化命令：．何处■．何处■设置或返回在何处打开链接。


定义和用法
target 属性可设置或返回在何处打开链接。
语法
anchorObject.target=_blank|_parent|_self|_top 
四个保留的目标名称：
_blank - 在一个新的未命名的窗口载入文档
_self - 在相同的框架或窗口中载入目标文档
_parent - 把文档载入父窗口或包含了超链接引用的框架的框架集
_top - 把文档载入包含该超链接的窗口,取代任何当前正在窗口中显示的框架
实例
下面的例子将更改一个链接的文本、URL 以及 target：
<html>
<head>
<script type="text/javascript">
function changeLink()
{
document.getElementById('myAnchor').innerHTML="W3School";
document.getElementById('myAnchor').href="http://www.w3school.com.cn";
document.getElementById('myAnchor').target="_blank";
}
</script>
</head>

<body>
<a id="myAnchor" href="http://www.microsoft.com">Microsoft</a>
<input type="button" onclick="changeLink()" value="Change link">
</body>

</html>
TIY
更改一个链接的文本、URL 以及 target■◆377■设置或返回被链接资源的 MIME 类型        简化命令：．类型■．类型■设置或返回被链接资源的 MIME 类型。



定义和用法
type 属性可设置或返回被链资源的 MIME 类型。
语法
anchorObject.type=type
实例
下面的例子可返回被链资源的 MIME 类型：
<html>
<body>

<p><a id="myAnchor" type="text/html" 
href="http://www.w3school.com.cn">W3School.com.cn</a></p>

<script type="text/javascript">
x=document.getElementById("myAnchor");
document.write(x.type);
</script>

</body>
</html>
TIY
取得链接的 MIME 类型■◆377■设置或返回元素的class属性 此为共有属性！简化命令：．类名■．类名■设置或返回元素的 class 属性。



定义和用法
className 属性设置或返回元素的 class 属性。
语法
object.className=classname
实例
本例展示了两种获得 <body> 元素的 class 属性的方法：
<html>
<body id="myid" class="mystyle">

<script type="text/javascript">
x=document.getElementsByTagName('body')[0];
document.write("Body CSS class: " + x.className);
document.write("<br />");
document.write("An alternate way: ");
document.write(document.getElementById('myid').className);
</script>

</body>
</html>
输出：
Body CSS class: mystyle
An alternate way: mystyle
TIY
返回 <body> 元素的 class 属性■◆377■设置或返回文本的方向      此为共有属性！简化命令：．文本方向■．文本方向■设置或返回文本的方向。


定义和用法
dir 属性设置或返回元素的文字方向。
语法：
object.dir=text-direction
实例
本例展示了两种获取 <body> 元素的文本方向的方法：
<html>
<body id="myid" dir="rtl">

<script type="text/javascript">
x=document.getElementsByTagName('body')[0];
document.write("Text direction: " + x.dir);
document.write("<br />");
document.write("An alternate way: ");
document.write(document.getElementById('myid').dir);
</script>

</body>
</html>
TIY
<body> 元素的文本方向■◆377■设置或返回元素的语言代码  此为共有属性！简化命令：．语言代码■．语言代码■设置或返回元素的语言代码。




定义和用法
lang 属性设置或返回元素的语言。
语法：
object.lang=language-code
实例
本例展示了两种获取 <body> 元素的语言的方法：
<html>
<body id="myid" lang="en-us">

<script type="text/javascript">
x=document.getElementsByTagName('body')[0];
document.write("Body language: " + x.lang);
document.write("<br />");
document.write("An alternate way: ");
document.write(document.getElementById('myid').lang);
</script>

</body>
</html>
TIY
<body> 元素的语言代码■◆377■设置或返回元素的title属性 此为共有属性！简化命令：．标题■．标题■设置或返回元素的 title 属性。



定义和用法
title 属性设置或返回元素的（咨询性质的）标题。
语法：
object.title=title
实例 1
本例展示了两种获取 <body> 元素的 title 属性的方法：
<html>
<body id="myid" title="mytitle">

<script type="text/javascript">
x=document.getElementsByTagName('body')[0];
document.write("Body title: " + x.title);
document.write("<br />");
document.write("An alternate way: ");
document.write(document.getElementById('myid').title);
</script>

</body>
</html>
实例 2
本例返回图像映射中某个区域的 title：
<html>
<body>

<img src ="planets.gif"
width="145" height="126"
alt="Planets"
usemap ="#planetmap" />

<map name ="planetmap">
<area id="venus" shape="circle"
coords ="124,58,8"
title="Venus"
href ="venus.htm"  />
</map>

<p>Venus' advisory title (mouse over the Venus planet): 
<script type="text/javascript">
x=document.getElementById('venus')
document.write(x.title)
</script>
</p>

</body>
</html>
TIY
返回 <body> 元素的 title 属性
返回图像映射中某个区域的 title■◆377■把焦点从链接上移开()                    简化命令：．移焦■．移焦■把焦点从链接上移开。



定义和用法
blur() 方法用于从链接上移开焦点。
语法
anchorObject.blur()
实例
<html>
<head>
<style type="text/css">
a:active {color:green}
</style>

<script type="text/javascript">
function getfocus()
{document.getElementById('myAnchor').focus()}

function losefocus()
{document.getElementById('myAnchor').blur()}
</script>
</head>

<body>
<a id="myAnchor"
href="http://www.w3school.com.cn">Visit W3School.com.cn</a>
<br /><br/>
<input type="button" onclick="getfocus()" value="Get focus">
<input type="button" onclick="losefocus()" value="Lose focus">
</body>

</html>
TIY
使用 focus() 和 blur()■◆377■给链接应用焦点()                        简化命令：．给焦■．给焦■给链接应用焦点。



定义和用法
focus() 方法用于给予链接焦点。
语法
anchorObject.focus()
说明
该方法可滚动文档以使 Anchor 对象的位置变为可见。
实例
<html>
<head>
<style type="text/css">
a:active {color:green}
</style>

<script type="text/javascript">
function getfocus()
{document.getElementById('myAnchor').focus()}

function losefocus()
{document.getElementById('myAnchor').blur()}
</script>
</head>

<body>
<a id="myAnchor"
href="http://www.w3school.com.cn">Visit W3School.com.cn</a>
<br /><br/>
<input type="button" onclick="getfocus()" value="Get focus">
<input type="button" onclick="losefocus()" value="Lose focus">
</body>

</html>
TIY
使用 focus() 和 blur()■◆345■图区■图区■Area 对象
Area 对象代表图像映射的一个区域（图像映射指的是带有可点击区域的图像）
在 HTML 文档中 <area> 标签每出现一次，就会创建一个 Area 对象。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆398■设置或返回访问某个区域的快捷键          简化命令：．快捷键■．快捷键■设置或返回访问某个区域的快捷键。



定义和用法
accessKey 属性可设置或返回访问某个区域的快捷键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
areaObject.accessKey=accessKey
实例
下面的例子可返回图像映射中 "Venus" 区域的快捷键：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" accessKey="v" />
</map>

<p>Access key for "Venus" is:
<script type="text/javascript">
x=document.getElementById('venus');
document.write(x.accessKey);
</script>
</p>

</body>
</html>
TIY
返回图像映射中某个区域的快捷键■◆398■设置或返回当无法显示的替换文字          简化命令：．备文■．备文■设置或返回当浏览器无法显示某个区域时的替换文字。



定义和用法
alt 属性可设置或返回当浏览器无法显示某个区域时所显示的替换文本。
语法
areaObject.alt=alternate_text
实例
下面的例子可返回图像映射中 "Venus" 区域的替换文本：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="The planet Venus"
href="venus.htm" />
</map>

<p>Alternate text for "Venus" is:
<script type="text/javascript">
x=document.getElementById('venus');
document.write(x.alt);
</script>
</p>

</body>
</html>
TIY
返回图像映射中某个区域的替换文本■◆398■设置或返回图像映射中可点击区域的坐标    简化命令：．坐标■．坐标■设置或返回图像映射中可点击区域的坐标。



定义和用法
coords 属性可设置或返回图像映射中某个可点击区域的坐标。
语法
areaObject.coords=coordinates
实例
下面的例子可返回图像映射中某个可点击区域的坐标：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>Venus coordinates:
<script type="text/javascript">
x=document.getElementById("venus");
document.write(x.coords);
</script>
</p>

</body>
</html>
TIY
返回图像映射中某个可点击区域的坐标■◆398■设置或返回某个区域中 URL 的锚部分       简化命令：．锚■．锚■设置或返回某个区域中 URL 的锚部分。



定义和用法
hash 属性可设置或返回一个区域中 URL 的锚部分。
语法
areaObject.hash=anchorname
实例
下面的例子可把 URL 的锚部分 #top 更改为 #bottom：
<html>
<head>
<script type="text/javascript">
function changeLink()
  {
  document.getElementById('venus').hash="bottom"
  }
</script>
</head>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus2.htm#top" />
</map>

<input type="button" onclick="changeLink()" value="Change link" />

</body>
</html>
TIY
更改一个区域中 URL 的锚部分■◆398■设置或返回某个区域中URL的主机名和端口   简化命令：．主机端口■．主机端口■设置或返回某个区域中 URL 的主机名和端口。



定义和用法
host 属性可设置或返回 URL 的主机名和端口。
语法
areaObject.host=host
实例
下面的例子可返回 "Venus" 区域的主机名和端口：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>The hostname and port for the "Venus" area are:
<script type="text/javascript">
x=document.getElementById('venus');
document.write(x.host);
</script>
</p>

</body>
</html>
TIY
返回图像映射中某个区域的链接的主机名和端口■◆398■设置或返回图像映射中链接的URL           简化命令：．完整URL■．完整URL■设置或返回图像映射中链接的 URL。


定义和用法
href 属性可设置或返回图像映射中链接的 URL。
语法
areaObject.href=URL
实例
下面的例子讲更改图像映射中某个区域的链接：
<html>
<head>
<script type="text/javascript">
function changeLink()
  {
  document.getElementById('venus').href="http://www.w3school.com.cn"
  }
</script>
</head>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<input type="button" onclick="changeLink()" value="Change link" />

</body>
</html>
TIY
图像映射中某个链接的 URL■◆398■设置或返回某个区域的id                  简化命令：．id■．id■设置或返回某个区域的 id。



定义和用法
id 属性可设置或返回图像映射中某个区域的 id。
语法
areaObject.id=id
实例
下面的例子可返回图像映射中 "Venus" 区域的 id：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>"Venus" area id = 
<script type="text/javascript">
x=document.getElementById('venus');
document.write(x.id);
</script>
</p>

</body>
</html>
TIY
返回图像映射中某个区域的 id■◆398■设置或返回某个区域是否活动              简化命令：．非活动■．非活动■设置或返回某个区域是否应是活动的还是非活动的。



定义和用法
noHref 属性可设置或返回某个区域是活动的还是非活动的。
语法
areaObject.noHref=true|false
说明
<area> 标签的 nohref 属性在客户端图像映射中定义了一个对鼠标敏感的区域，而该区域不会在用户选取它时采取任何操作。你必须为每个 <area> 标签都包含一个 href 或 nohref 属性。
实例
下面的例子可返回图像映射中 "Venus" 区域的 "noHref" 状态：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>noHref status:
<script type="text/javascript">
x=document.getElementById('venus');
document.write(x.noHref);
</script>
</p>

</script>
</body>
</html>
TIY
返回图像映射中某个区域的 noHref 状态■◆398■设置或返回某个区域中URL路径名           简化命令：．URL路径■．URL路径■设置或返回某个区域中的 URL 的路径名。



定义和用法
pathname 属性可设置或返回某个区域中 link-URL 的路径名。
语法
areaObject.pathname=pathnamee
实例
下面的例子可返回 "Venus" 区域中 link-URL 的路径名：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>Venus' pathname: 
<script type="text/javascript">
x=document.getElementById('venus');
document.write(x.pathname);
</script>
</p>

</body>
</html>
TIY
取得图像映射中某个区域的 link-URL 的路径名■◆398■设置或返回某个区域中的 URL 的协议       简化命令：．协议■．协议■设置或返回某个区域中的 URL 的协议。




定义和用法
protocol 属性可设置或返回某个区域中 link-URL 的协议。
语法
areaObject.protocol=protocol
实例
下面的例子可返回 "Venus" 区域中 link-URL 的协议：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>Venus' protocol:
<script type="text/javascript">
x=document.getElementById('venus');
document.write(x.protocol);
</script>
</p>

</body>
</html>
TIY
取得图像地图中某个区域的 link-URL 所用的协议■◆398■设置或返回某个区域URL查询字符串部分     简化命令：．查询■．查询■设置或返回某个区域中 URL 的查询字符串部分。



定义和用法
search 属性可设置或返回某个区域中 link-URL 的查询字符串部分。
语法
areaObject.search=querystring
实例
下面的例子可返回 "Venus" 中的 link-URL 的查询字符串部分：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm?id=venus" />
</map>

<p>Query string part of Venus' link-URL: 
<script type="text/javascript">
x=document.getElementById('venus')
document.write(x.search)
</script>
</p>

</body>
</html>
TIY
返回图像映射中某个区域的链接的查询字符串部分■◆398■设置或返回图像映射中某个区域的形状      简化命令：．形状■．形状■设置或返回图像映射中某个区域的形状。



定义和用法
shape 属性可设置或返回图像映射中某个区域的形状。
语法
areaObject.shape=RECT|CIRCLE|POLY|DEFAULT
实例
下面的例子可返回图像映射中 "Venus" 区域的形状：
<html>
<body>

<img src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="Venus"
href="venus.htm" />
</map>

<p>Venus shape:
<script type="text/javascript">
x=document.getElementById("venus");
document.write(x.shape);
</script>
</p>

</body>
</html>
TIY
返回图像映射中某个区域的形状■◆398■设置或返回某个区域的tab键控制次序       简化命令：．tab次序■．tab次序■设置或返回某个区域的 tab 键控制次序。




定义和用法
tabIndex 属性可设置或返回某个区域的 tab 键控制次序。
语法
areaObject.tabIndex=tabIndex
实例
下面的例子可展示图像映射中区域的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function showTabIndex()
{
var sun=document.getElementById('sun').tabIndex;
var mercury=document.getElementById('mercury').tabIndex;
var venus=document.getElementById('venus').tabIndex;

document.write("Tab index of Sun: " + sun);
document.write("<br />");
document.write("Tab index of Mercury: " + mercury);
document.write("<br />");
document.write("Tab index of Venus: " + venus);
}
</script>
</head>
<body>

<img src ="planets.gif"
width="145" height="126"
alt="Planets"
usemap ="#planetmap" />

<map name="planetmap">
<area shape ="rect" coords ="0,0,82,126"
href ="sun.htm" id="sun" tabIndex="1" />
<area shape ="circle" coords ="90,58,3"
href ="mercur.htm" id="mercury" tabIndex="2" />
<area shape ="circle" coords ="124,58,8"
href ="venus.htm" id="venus" tabIndex="3" />
</map>

<input type="button" onclick="showTabIndex()"
value="Show tabIndex" />

</body>
</html>
TIY
返回图像映射中区域的 tab 键控制次序■◆398■设置或返回在何处打开区域中的link-URL    简化命令：．何处■．何处■设置或返回在何处打开区域中的 link-URL。



定义和用法
target 属性可设置或返回在何处打开区域中的 link-URL。
语法
areaObject.target=_blank|_parent|_self|_top
四个保留的目标名称：
_blank - 在一个新的未命名的窗口载入文档
_self - 在相同的框架或窗口中载入目标文档
_parent - 把文档载入父窗口或包含了超链接引用的框架的框架集
_top - 把文档载入包含该超链接的窗口,取代任何当前正在窗口中显示的框架
实例
The following example changes the target of the link in the image-map:
<html>
<head>
<script type="text/javascript">
function changeTarget()
  {
  document.getElementById('venus').target="_blank"
  }
</script>
</head>
<body>

<img src ="planets.gif"
width="145" height="126"
alt="Planets"
usemap ="#planetmap" />

<map name ="planetmap">
<area shape ="circle" coords ="124,58,8"
href ="venus.htm" id="venus" />
</map>
<br />
<input type="button" onclick="changeTarget()" 
value="Change target" />

</body>
</html>
TIY
更改图像映射中某个链接的 target■◆345■链接默认■链接默认■Base 对象
Base 对象代表 HTML 的 base 元素。
在 HTML 文档中 <base> 每出现一次，Base 对象就会被创建。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆413■设置或返回针对页面中所有链接的基准URL   简化命令：．完整URL■．完整URL■设置或返回针对页面中所有链接的基准 URL。


定义和用法
href 属性可设置或返回页面中所有链接的基准 URL。
语法
baseObject.href=URL
实例
下面的例子可返回基准 URL：
<html>
<head>
<base id="myBaseId" href="http://www.w3school.com.cn/htmldom/" />
</head>

<body>
<p>Base URL:
<script type="text/javascript">
x=document.getElementById('myBaseId');
document.write(x.href);
</script>
</p>

</body>
</html>
输出：
Base URL: http://www.w3school.com.cn/htmldom/ 
TIY
取得 HTML 文档的基准 URL■◆413■设置或返回<base>元素的id                简化命令：．id■．id■设置或返回 <base> 元素的 id。



定义和用法
id 属性可设置或返回 <base> 元素的 id。
语法
baseObject.id=id
实例
下面的例子可返回 <base> 元素的 id：
<html>
<head>
<base id="myBaseId" href="http://www.w3school.com.cn/htmldom/" />
</head>

<body>
<p>Base id: 
<script type="text/javascript">
x=document.getElementsByTagName('base')[0];
document.write(x.id);
</script>
</body>

</html>
输出：
Base id: myBaseId
TIY
取得 HTML 文档的 base id■◆413■设置或返回针对页面链接的默认目标框架    简化命令：．何处■．何处■设置或返回针对页面中所有链接的默认目标框架。



定义和用法
target 属性可设置或返回页面中所有链接的默认 target。
语法
baseObject.target=target
实例
下面的例子可返回默认的链接 target：
<html>
<head>
<base id="myBaseId" target="_blank"
href="http://www.w3school.com.cn/htmldom/" />
</head>

<body>

<p>Base target: 
<script type="text/javascript">
x=document.getElementById('myBaseId');
document.write(x.target);
</script>

</body>
</html>
输出：
Base target: _blank
TIY
取得 HTML 文档的基本 target■◆345■主体■主体■Body 对象
Body 对象代表文档的主体 (HTML body) 。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆417■设置或返回 body 的 id                   简化命令：．id■．id■设置或返回 body 的 id。


定义和用法
id 属性设置或返回 body 元素的 id。
语法
bodyObject.id=id
实例
下面的例子将展示设置 <body> 元素的 id 的两种方法：
<html>
<body id="myid">

<script type="text/javascript">
x=document.getElementsByTagName('body')[0];
document.write("Body id: " + x.id);
document.write("<br />");
document.write("An alternate way: ");
document.write(document.getElementById('myid').id);
</script>

</body>
</html>
输出：
Body id: myid
An alternate way: myid
TIY
返回 <body> 元素的 id■◆345■按钮■按钮■Button 对象
Button 对象代表一个按钮。
在 HTML 文档中 <button> 标签每出现一次，Button 对象就会被创建。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆419■设置或返回访问某个按钮的快捷键          简化命令：．快捷键■．快捷键■设置或返回访问某个按钮的快捷键。



定义和用法
accessKey 属性可设置或返回访问一个按钮的键盘按键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
buttonObject.accessKey=accessKey
实例
下面的例子可返回一个按钮的快捷键：
<html>
<body>

<button id="button1" accessKey="a">
Click Me!</button>

<p>AccessKey for button is: 
<script type="text/javascript">
x=document.getElementById('button1');
document.write(x.accessKey);
</script></p>

</body>
</html>
TIY
返回一个按钮的快捷键■◆419■设置或返回是否禁用按钮                  简化命令：．禁用■．禁用■设置或返回是否禁用按钮。



定义和用法
disabled 属性可设置或返回是否禁用按钮。
语法
buttonObject.disabled=true|false
实例
下面的例子将禁用按钮：
<html>
<head>
<script type="text/javascript">
function disableButton()
{
document.getElementById("myButton").disabled=true
}
</script>
</head>

<body>
<form>
<button id="myButton" onClick="disableButton()">
Click Me!</button>
</form>
</body>

</html>
TIY
提示按钮的 id 和 类型 + 禁用按钮■◆419■返回对包含按钮的表单的引用              简化命令：．表单■．表单■返回对包含按钮的表单的引用。



定义和用法
form 属性可返回对包含该按钮的表单的引用。
如果包含该按钮，则返回一个 form 对象，如果未包含该按钮，则返回 null。
语法
buttonObject.form
实例
下面的例子可返回该按钮所属的表单的 id：
<html>
<body>

<form id="form1">
<button id="button1">Click me!</button>
</form>

<p>The form containing the button is: 
<script type="text/javascript">
x=document.getElementById('button1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
返回按钮所属的表单的 id■◆419■设置或返回按钮的id                      简化命令：．id■．id■设置或返回按钮的 id。



定义和用法
id 属性可设置或返回按钮的 id。
语法
buttonObject.id=id
实例
下面的例子可设置按钮的 id：
<html>
<head>
<script type="text/javascript">
function alertId()
{
alert(document.getElementById("myButton").id)
}
</script>
</head>
<body>

<form>
<button id="myButton" onClick="alertId()">
Click me!</button>
</form>

</body>
</html>
TIY
提示按钮的 id 和 类型 + 禁用按钮■◆419■设置或返回按钮的名称                    简化命令：．名称■．名称■设置或返回按钮的名称。


定义和用法
name 属性可设置或返回按钮的名称。
语法
buttonObject.name=name
实例
下面的例子可返回按钮的名称：
<html>
<body>

<button id="button1" name="button1">
Click Me!</button>

<p>The name of the button is: 
<script type="text/javascript">
x=document.getElementById('button1');
document.write(x.name);
</script></p>

</body>
</html>
TIY
获取按钮的名称■◆419■设置或返回按钮的 Tab 键控制次序         简化命令：．tab次序■．tab次序■设置或返回按钮的 Tab 键控制次序。



定义和用法
tabIndex 属性可设置或返回按钮的 tab 键控制次序。
语法
buttonObject.tabIndex=tabIndex
实例
下面的例子可返回按钮的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function showTabIndex()
  {
  var b1=document.getElementById('b1').tabIndex;
  var b2=document.getElementById('b2').tabIndex;
  var b3=document.getElementById('b3').tabIndex;
  document.write("Tab index of Button 1: " + b1);
  document.write("<br />");
  document.write("Tab index of Button 2: " + b2);
  document.write("<br />");
  document.write("Tab index of Button 3: " + b3);
  }
</script>
</head>
<body>

<button id="b1" tabIndex="1">Button 1</button><br />
<button id="b2" tabIndex="2">Button 2</button><br />
<button id="b3" tabIndex="3">Button 3</button><br />
<br />
<input type="button" onclick="showTabIndex()"
value="Show tabIndex" />

</body>
</html>
TIY
返回按钮的 tab 键控制次序
■◆419■返回按钮的表单类型                      简化命令：．类型■．类型■返回按钮的表单类型。



定义和用法
type 属性设置或返回按钮的类型。
提示：请始终为按钮规定 type 属性。IE 浏览器的默认类型是 "button"，而在其他浏览器中（以及在 W3C 规范中）是 "submit"。
语法
buttonObject.type=value
属性值
值	描述
submit	button 是提交按钮（是 IE 之外的所有浏览器的默认值）
button	button 是可点击的按钮（IE 的默认值）
reset	button 是重置按钮（清除表单数据）
浏览器支持
所有浏览器都支持 type 属性。
实例
返回按钮的类型：
<html>
<head>
<script type="text/javascript">
function alertType()
{
alert(document.getElementById("myButton").type)
}
</script>
</head>

<body>
<form>
<button id="myButton" onClick="alertType()">点击这里</button>
</form>
</body>

</html>
亲自试一试■◆419■设置或返回显示在按钮上的文本            简化命令：．值■．值■设置或返回显示在按钮上的文本。


定义和用法
value 属性设置或返回显示在按钮上的文本。
语法
buttonObject.value=value
实例
下面的例子可返回显示在按钮上的文本：
<html>
<body>

<input type="button" id="button1" name="button1" value="Click Me!" />

<p>The text on the button is: 
<script type="text/javascript">
x=document.getElementById('button1');
document.write(x.value);
</script></p>

</body>
</html>
TIY
获取按钮上的文本■◆345■画布■画布■Canvas 对象
Canvas 对象表示一个 HTML 画布元素 - <canvas>。它没有自己的行为，但是定义了一个 API 支持脚本化客户端绘图操作。
你可以直接在该对象上指定宽度和高度，但是，其大多数功能都可以通过 CanvasRenderingContext2D 对象获得。 这是通过 Canvas 对象的 getContext() 方法并且把直接量字符串 "2d" 作为唯一的参数传递给它而获得的。
<canvas> 标记在 Safari 1.3 中引入，在制作此参考页时，它在 Firefox 1.5 和 Opera 9 中也得到了支持。在 IE 中，<canvas> 标记及其 API 可以使用位于 excanvas.sourceforge.net 的 ExplorerCanvas 开源项目来模拟。
提示：如果希望学习如何使用 <canvas> 来绘制图形，可以访问 Mozilla 提供的 Canvas 教程（英文）以及相应的 中文 Canvas 教程。
Canvas 对象的属性
height 属性
画布的高度。和一幅图像一样，这个属性可以指定为一个整数像素值或者是窗口高度的百分比。当这个值改变的时候，在该画布上已经完成的任何绘图都会擦除掉。默认值是 300。
width 属性
画布的宽度。和一幅图像一样，这个属性可以指定为一个整数像素值或者是窗口宽度的百分比。当这个值改变的时候，在该画布上已经完成的任何绘图都会擦除掉。默认值是 300。■◆345■事件■事件■实例
哪个鼠标按钮被点击？
光标的坐标是？
被按的按键的 unicode 是？
相对于屏幕，光标的坐标是？
shift 键被按了吗？
哪个元素被点击了？
哪个事件类型发生了？
Event 对象
Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件通常与函数结合使用，函数不会在事件发生前被执行！
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.
事件句柄　(Event Handlers)
HTML 4.0 的新特性之一是能够使 HTML 事件触发浏览器中的行为，比如当用户点击某个 HTML 元素时启动一段 JavaScript。下面是一个属性列表，可将之插入 HTML 标签以定义事件的行为。■◆429■图像的加载被中断                        简化命令：．载断■．载断■图像的加载被中断。


定义和用法
onabort 事件会在图像加载被中断时发生。
当用户在图像完成载入之前放弃图像的装载（如单击了 stop 按钮）时，就会调用该句柄。
语法
onabort="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<img>
支持该事件的 JavaScript 对象：
image
实例 1
在本例中，如果图像的加载被中断，则会显示一个对话框：
<img src="image_w3default.gif"
onabort="alert('Error: Loading of the image was aborted')" />
实例 2
在本例中，如果图像的加载中断，我们将调用一个函数：
<html>
<head>
<script type="text/javascript">
function abortImage()
{
alert('Error: Loading of the image was aborted')
}
</script>
</head>

<body>
<img src="image_w3default.gif" onabort="abortImage()" />
</body>

</html>■◆429■元素失去焦点                            简化命令：．失焦■．失焦■元素失去焦点。


定义和用法
onblur 事件会在对象失去焦点时发生。
语法
onblur="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, 
<button>, <caption>, <cite>, <dd>, <del>, <dfn>, <div>, <dl>, <dt>, 
<em>, <fieldset>, <form>, <frame>, <frameset>, <h1> to <h6>, <hr>, <i>, 
<iframe>, <img>, <input>, <ins>, <kbd>, <label>, <legend>, <li>, 
<object>, <ol>, <p>, <pre>, <q>, <samp>, <select>, <small>, <span>, 
<strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, 
<th>, <thead>, <tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
button, checkbox, fileUpload, layer, frame, password, 
radio, reset, submit, text, textarea, window
实例 1
在本例中，我们将在用户离开输入框时执行 JavaScript 代码：
<html>
<head>
<script type="text/javascript">
function upperCase()
{
var x=document.getElementById("fname").value
document.getElementById("fname").value=x.toUpperCase()
}
</script>
</head>

<body>

输入您的姓名：
<input type="text" id="fname" onblur="upperCase()" />

</body>
</html>
输出：
输入您的姓名： 
TIY
onblur
如何使用 onblur 事件在用户离开输入框时执行 JavaScript 代码■◆429■域的内容被改变                          简化命令：．被改■．被改■域的内容被改变。



定义和用法
onchange 事件会在域的内容改变时发生。
语法
onchange="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<input type="text">, <select>, <textarea>
支持该事件的 JavaScript 对象：
fileUpload, select, text, textarea
实例 1
在本例中，我们将在用户改变输入域内容时执行 JavaScript 代码：
<html>
<head>
<script type="text/javascript">
function upperCase(x)
{
var y=document.getElementById(x).value
document.getElementById(x).value=y.toUpperCase()
}
</script>
</head>

<body>

输入您的姓名：
<input type="text" id="fname" onchange="upperCase(this.id)" />

</body>
</html>
输出：
输入您的姓名： 
TIY
onchange
如何使用 onchange 事件在用户改变输入域的内容时执行 JavaScript 代码■◆429■当用户点击某个对象时调用的事件句柄      简化命令：．点击■．点击■当用户点击某个对象时调用的事件句柄。


定义和用法
onclick 事件会在对象被点击时发生。
请注意， onclick 与 onmousedown 不同。单击事件是在同一元素上发生了鼠标按下事件之后又发生了鼠标放开事件时才发生的。
语法
onclick="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, 
<caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, 
<form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <object>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, 
<strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, <th>, 
<thead>, <tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
button, document, checkbox, link, radio, reset, submit
实例 1
在本例中，当按钮被单击时，第一个输入框中的文本会被拷贝到第二个输入框中：
<html>
<body>

Field1: <input type="text" id="field1" value="Hello World!">
<br />
Field2: <input type="text" id="field2">
<br /><br />
点击下面的按钮，把 Field1 的内容拷贝到 Field2 中：
<br />
<button onclick="document.getElementById('field2').value=
document.getElementById('field1').value">Copy Text</button>

</body>
</html>
输出：
Field1: 
Field2: 
点击下面的按钮，把 Field1 的内容拷贝到 Field2 中：
Copy Text
TIY
onclick
如何使用 onclick■◆429■当用户双击某个对象时调用的事件句柄      简化命令：．双击■．双击■当用户双击某个对象时调用的事件句柄。



定义和用法
ondblclick 事件会在对象被双击时发生。
语法
ondblclick="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, 
<button>, <caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, 
<em>, <fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, 
<kbd>, <label>, <legend>, <li>, <map>, <object>, <ol>, <p>, <pre>, 
<samp>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <table>, 
<tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, <tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
document, link
实例 1
在本例中，当您双击按钮时，第二个域中内容会根据第一个域的内容而改变：
<html>
<body>

Field1: <input type="text" id="field1" value="Hello World!">
<br />
Field2: <input type="text" id="field2">
<br /><br />
双击下面的按钮，把 Field1 的内容拷贝到 Field2 中：
<br />
<button ondblclick="document.getElementById('field2').value=
document.getElementById('field1').value">Copy Text</button>

</body>
</html>
输出：
Field1: 
Field2: 
双击下面的按钮，把 Field1 的内容拷贝到 Field2 中：
Copy Text
TIY
ondblclick
如何使用 ondblclick。

■◆429■在加载文档或图像时发生错误              简化命令：．出错■．出错■在加载文档或图像时发生错误。



定义和用法
onerror 事件会在文档或图像加载过程中发生错误时被触发。
在装载文档或图像的过程中如果发生了错误，就会调用该事件句柄。
语法
onerror="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<img>, <object>, <style>
支持该事件的 JavaScript 对象：
window, image
实例 1
在本例中，如果装载图像时发生了错误，则显示一个对话框：
<img src="image.gif" onerror="alert('The image could not be loaded.')" />
TIY
onerror
如何使用 onerror。■◆429■元素获得焦点                            简化命令：．得焦■．得焦■元素获得焦点。


定义和用法
onfocus 事件在对象获得焦点时发生。
语法
onfocus="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <button>, 
<caption>, <cite>, <dd>, <del>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, 
<form>, <frame>, <frameset>, <h1> to <h6>, <hr>, <i>, <iframe>, <img>, <input>, 
<ins>, <kbd>, <label>, <legend>, <li>, <object>, <ol>, <p>, <pre>, <q>, 
<samp>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <table>, <tbody>, 
<td>, <textarea>, <tfoot>, <th>, <thead>, <tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
button, checkbox, fileUpload, layer, frame, password, radio, reset, select, submit, 
text, textarea, window
实例
在本例中，当输入框获得焦点时，其背景颜色将改变：
<html>
<head>
<script type="text/javascript">
function setStyle(x)
{
document.getElementById(x).style.background="yellow"
}
</script>
</head>

<body>

First name: <input type="text"
onfocus="setStyle(this.id)" id="fname" />
<br />
Last name: <input type="text"
onfocus="setStyle(this.id)" id="lname" />

</body>
</html>
输出：
First name: 
Last name: 
TIY
onfocus
如何使用 onfocus。■◆429■某个键盘按键被按下                      简化命令：．按键■．按键■某个键盘按键被按下。


定义和用法
onkeydown 事件会在用户按下一个键盘按键时发生。
语法
onkeydown="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, 
<button>, <caption>, <cite>, <code>, <dd>, <del>, <dfn>, <div>, <dt>, <em>, 
<fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <object>, <ol>, <p>, <pre>, <q>, <samp>, <select>, <small>, 
<span>, <strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, 
<th>, <thead>, <tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
document, image, link, textarea
提示和注释
浏览器差异：Internet Explorer 使用 event.keyCode 取回被按下的字符，而 Netscape/Firefox/Opera 使用 event.which。
实例
在本例中，用户无法在输入框中键入数字：
<html>
<body>
<script type="text/javascript">
function noNumbers(e)
{
var keynum
var keychar
var numcheck

if(window.event) // IE
  {
  keynum = e.keyCode
  }
else if(e.which) // Netscape/Firefox/Opera
  {
  keynum = e.which
  }

keychar = String.fromCharCode(keynum)
numcheck = /\d/
return !numcheck.test(keychar)
}
</script>

<form>
<input type="text" onkeydown="return noNumbers(event)" />
</form>

</html>
输出：

TIY
onkeydown
如何使用 onkeydown。■◆429■某个键盘按键被按下并松开                简化命令：．点键■．点键■某个键盘按键被按下并松开。


定义和用法
onkeypress 事件会在键盘按键被按下并释放一个键时发生。
语法
onkeypress="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, 
<button>, <caption>, <cite>, <code>, <dd>, <del>, <dfn>, <div>, <dt>, <em>, 
<fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <object>, <ol>, <p>, <pre>, <q>, <samp>, <select>, <small>, 
<span>, <strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, 
<th>, <thead>, <tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
document, image, link, textarea
提示和注释
浏览器差异：Internet Explorer 使用 event.keyCode 取回被按下的字符，而 Netscape/Firefox/Opera 使用 event.which。
实例
在本例中，用户无法在输入框中键入数字：
<html>
<body>
<script type="text/javascript">
function noNumbers(e)
{
var keynum
var keychar
var numcheck

if(window.event) // IE
  {
  keynum = e.keyCode
  }
else if(e.which) // Netscape/Firefox/Opera
  {
  keynum = e.which
  }
keychar = String.fromCharCode(keynum)
numcheck = /\d/
return !numcheck.test(keychar)
}
</script>

<form>
<input type="text" onkeypress="return noNumbers(event)" />
</form>

</html>
输出：

TIY
onkeypress
如何使用 onkeypress
■◆429■某个键盘按键被松开                      简化命令：．松键■．松键■某个键盘按键被松开。



定义和用法
onkeyup 事件会在键盘按键被松开时发生。
语法
onkeyup="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, 
<button>, <caption>, <cite>, <code>, <dd>, <del>, <dfn>, <div>, <dt>, <em>, 
<fieldset>, <form>, <h1> to <h6>, <hr>, <i>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <object>, <ol>, <p>, <pre>, <q>, <samp>, <select>, <small>, 
<span>, <strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, 
<th>, <thead>, <tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
document, image, link, textarea
实例
当您在例子中的输入域中键入字符时，字符会被更改为大写（逐一地）：
<html>

<head>
<script type="text/javascript">
function upperCase(x)
{
var y=document.getElementById(x).value
document.getElementById(x).value=y.toUpperCase()
}
</script>
</head>

<body>
	
输入您的姓名： <input type="text" id="fname" onkeyup="upperCase(this.id)" />

</body>
</html>
输出：
输入您的姓名： 
TIY
onkeyup
如何使用 onkeyup。■◆429■一张页面或一幅图像完成加载              简化命令：．载入■．载入■一张页面或一幅图像完成加载。


定义和用法
onload 事件会在页面或图像加载完成后立即发生。
语法
onload="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<body>, <frame>, <frameset>, <iframe>, <img>, <link>, <script>
支持该事件的 JavaScript 对象：
image, layer, window
实例
在本例中，文本 "Page is loaded" 会被显示在状态栏中：
<html>
<head>
<script type="text/javascript">
function load()
{
window.status="Page is loaded"
}
</script>
</head>

<body onload="load()">
</body>

</html>
TIY
onload
如何使用 onload 在页面完成加载时在状态栏显示一段文本。
■◆429■鼠标按钮被按下                          简化命令：．按鼠■．按鼠■鼠标按钮被按下。



定义和用法
onmousedown 事件会在鼠标按键被按下时发生。
语法
onmousedown="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, 
<caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, 
<form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, 
<sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, 
<tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
button, document, link
实例
在本例中，当您点击下面的图片时会弹出一个对话框：
<img src="/i/example_mouse2.jpg" 
onmousedown="alert('You clicked the picture!')" />
输出：（请点击图片）

实例 2
在本例中，对话框将显示出您所点击的元素的标签名：
<html>
<head>
<script type="text/javascript">
function whichElement(e)
{
var targ
if (!e) var e = window.event
if (e.target) targ = e.target
else if (e.srcElement) targ = e.srcElement
if (targ.nodeType == 3) // defeat Safari bug
targ = targ.parentNode
var tname
tname=targ.tagName
alert("You clicked on a " + tname + " element.")
}
</script>
</head>

<body onmousedown="whichElement(event)">

<h2>This is a header</h2>
<p>This is a paragraph</p>
<img border="0" src="ball16.gif" alt="Ball">

</body>
</html>
TIY
onmousedown
如何使用 onmousedown 在图像被点击时显示一个对话框。
onmousedown 2
如何使用 onmousedown 来显示您所点击的元素的标签名。■◆429■鼠标被移动                              简化命令：．鼠移■．鼠移■鼠标被移动。


定义和用法
onmousemove 事件会在鼠标指针移动时发生。
语法
onmousemove="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, 
<caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, 
<form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, 
<sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, 
<tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
onmousemove is, by default, not an event of any object, 
because mouse movement happens very frequently.
提示和注释
注释：每当用户把鼠标移动一个像素，就会发生一个 mousemove 事件。这会耗费系统资源去处理所有这些 mousemove 事件。因此请审慎地使用该事件。
实例
下面的例子中，当用户把鼠标移动到图像上时，将显示一个对话框：
<img src="/i/eg_mouse2.jpg" alt="mouse"
onmousemove="alert('您的鼠标刚才经过了图片！')" />
输出(请把鼠标放到图片上)：

TIY
onmousemove
如何使用 onmousemove。
■◆429■鼠标从某元素离开                        简化命令：．鼠离■．鼠离■鼠标从某元素移开。



定义和用法
onmouseout 事件会在鼠标指针移出指定的对象时发生。
语法
onmouseout="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, 
<caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, 
<form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, 
<sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, 
<tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
layer, link
实例 1
在下面的例子中，我们将在鼠标指针移出图像时显示一个对话框：
<img src="/i/example_mouse2.jpg" alt="mouse"
onmousemove="alert('您的鼠标刚才离开了图片！')" />
输出：(请把鼠标从图片上移开):
Visit W3School!
实例 2
下面的例子中，我们将在网页上添加一个用作连接按钮的图像，然后我们会添加 onMouseOver 和 onMouseOut 事件，这样就可以在运行两个 JavaScript 函数来切换两幅图像：
<html>
<head>
<script type="text/javascript">
function mouseOver()
{
document.getElementById('b1').src ="/i/eg_mouse.jpg"
}
function mouseOut()
{
document.getElementById('b1').src ="/i/eg_mouse2.jpg"
}
</script>
</head>

<body>
<a href="http://www.w3school.com.cn" 
onmouseover="mouseOver()" onmouseout="mouseOut()">
<img alt="Visit W3School!" src="/i/example_mouse2.jpg" id="b1" />
</a>
</body>
</html>
输出：
 Visit W3School!
TIY
onmouseout
如何使用 onmouseout。■◆429■鼠标移到某元素之上                      简化命令：．鼠到■．鼠到■鼠标移到某元素之上。



定义和用法
onmouseover 事件会在鼠标指针移动到指定的对象上时发生。
语法
onmouseover="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, 
<caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, 
<form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, 
<sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, 
<tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
layer, link
实例 1
在下面的例子中，我们将在用户把鼠标指针移动到图像上时显示一个对话框：
<img src="/i/eg_mouse2.jpg" alt="mouse"
onmouseover="alert('您的鼠标在图片上！')" />
输出：(请把鼠标移动图片上):
Visit W3School!
实例 2
下面的例子中，我们将在网页上添加一个用作连接按钮的图像，然后我们会添加 onMouseOver 和 onMouseOut 事件，这样就可以在运行两个 JavaScript 函数来切换两幅图像：
<html>
<head>
<script type="text/javascript">
function mouseOver()
{
document.getElementById('b1').src ="/i/eg_mouse.jpg"
}
function mouseOut()
{
document.getElementById('b1').src ="/i/eg_mouse2.jpg"
}
</script>
</head>

<body>
<a href="http://www.w3school.com.cn" 
onmouseover="mouseOver()" onmouseout="mouseOut()">
<img alt="Visit W3School!" src="/i/eg_mouse2.jpg" id="b1" />
</a>
</body>
</html>
输出：
 Visit W3School!
TIY
onmouseover
如何使用 onmouseover。■◆429■鼠标按键被松开                          简化命令：．鼠松■．鼠松■鼠标按键被松开。



定义和用法
onmouseup 事件会在鼠标按键被松开时发生。
语法
onmouseup="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>, <body>, <button>, 
<caption>, <cite>, <code>, <dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, 
<form>, <h1> to <h6>, <hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, 
<li>, <map>, <ol>, <p>, <pre>, <samp>, <select>, <small>, <span>, <strong>, 
<sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>, <th>, <thead>, 
<tr>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
button, document, link
实例 1
在本例中，在点击图片并松开鼠标按键后，将显示一个对话框：
<img src="/i/eg_mouse2.jpg" alt="mouse"
onmouseup="alert('您点击了图片！')" />
输出：(请点击图片)：
Visit W3School!
实例 2
在本例中，对话框中会显示出您所点击的元素的标签名：
<html>
<head>
<script type="text/javascript">
function whichElement(e)
{
var targ
if (!e) var e = window.event
if (e.target) targ = e.target
else if (e.srcElement) targ = e.srcElement
if (targ.nodeType == 3) // defeat Safari bug
targ = targ.parentNode
var tname
tname=targ.tagName
alert("You clicked on a " + tname + " element.")
}
</script>
</head>

<body onmouseup="whichElement(event)">

<h2>This is a header</h2>
<p>This is a paragraph</p>
<img border="0" src="ball16.gif" alt="Ball">

</body>
</html>
TIY
onmouseup
如何使用 onmouseup 在图像被点击时显示一个对话框。
onmouseup 2
如何使用 onmouseup 来显示您所点击的元素的标签名。■◆429■重置按钮被点击                          简化命令：．重置■．重置■重置按钮被点击。



定义和用法
onreset 事件会在表单中的重置按钮被点击时发生。
语法
onreset="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<form>
支持该事件的 JavaScript 对象：
form
实例
在本例中，当重置按钮被点击时，表单会改为默认值，并显示一个对话框：
<form onreset="alert('The form will be reset')">

Firstname: <input type="text" name="fname" value="John" />
<br />
Lastname: <input type="text" name="lname" />
<br /><br />
<input type="reset" value="Reset">

</form>
输出：
Firstname: 
Lastname: 

TIY
onreset
如何使用 onreset 在 reset 事件发生时显示一个对话框。■◆429■窗口或框架被重新调整大小                简化命令：．尺寸改变■．尺寸改变■窗口或框架被重新调整大小。


定义和用法
onresize 事件会在窗口或框架被调整大小时发生。
语法
onresize="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<a>, <address>, <b>, <big>, <blockquote>, <body>, <button>, <cite>, <code>, 
<dd>, <dfn>, <div>, <dl>, <dt>, <em>, <fieldset>, <form>, <frame>, <h1> to <h6>,
<hr>, <i>, <img>, <input>, <kbd>, <label>, <legend>, <li>, <object>, <ol>, <p>, 
<pre>, <samp>, <select>, <small>, <span>, <strong>, <sub>, <sup>, <table>, 
<textarea>, <tt>, <ul>, <var>
支持该事件的 JavaScript 对象：
window
实例
在本例中，当用户试图调整窗口的大小时，将显示一个对话框：
<body onresize="alert('You have changed the size of the window')">
</body>
TIY
onresize
如何使用 onresize 在窗口被调整大小时显示一个对话框。■◆429■文本被选中                              简化命令：．选中■．选中■文本被选中。


定义和用法
onselect 事件会在文本框中的文本被选中时发生。
语法
onselect="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<input type="text">, <textarea>
支持该事件的 JavaScript 对象：
window
实例
在本例中，当用户试图选择文本框中的文本时，会显示一个对话框：
<form>

Select text: <input type="text" value="Hello world!"
onselect="alert('You have selected some of the text.')" />
<br /><br />
Select text: <textarea cols="20" rows="5"
onselect="alert('You have selected some of the text.')">
Hello world!</textarea>

</form>
输出：
Select text: 
Select text: 
TIY
onselect
如何使用 onselect。■◆429■确认按钮被点击                          简化命令：．确认■．确认■确认按钮被点击。


定义和用法
onsubmit 事件会在表单中的确认按钮被点击时发生。
语法
onsubmit="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<form>
支持该事件的 JavaScript 对象：
form
实例
在本例中，当用户点击提交按钮时，会显示一个对话框：
<form name="testform" action="jsref_onsubmit.asp"
onsubmit="alert('Hello ' + testform.fname.value +'!')">

What is your name?<br />
<input type="text" name="fname" />
<input type="submit" value="Submit" />

</form>
输出：
What is your name?


TIY
onsubmit
如何使用 onsubmit。■◆429■用户退出页面                            简化命令：．退出■．退出■用户退出页面。


定义和用法
onunload 事件在用户退出页面时发生。
语法
onunload="SomeJavaScriptCode"
参数	描述
SomeJavaScriptCode	必需。规定该事件发生时执行的 JavaScript。
支持该事件的 HTML 标签：
<body>, <frameset>
支持该事件的 JavaScript 对象：
window
实例
在本例中，在页面关闭时会显示一个对话框：
<body onunload="alert('The onunload event was triggered')">
</body>
TIY
onunload
如何使用 onunload。■◆429■返回当事件被触发时ALT是否被按下         简化命令：．ALT键■．ALT键■返回当事件被触发时，&quot;ALT&quot; 是否被按下。



定义和用法
altKey 事件属性返回一个布尔值。指示在指定的事件发生时，Alt 键是否被按下并保持住了。
语法
event.altKey=true|false|1|0
实例
下面的例子可提示当鼠标按键被点击时 "ALT" 键是否已被按住：
<html>
<head>
<script type="text/javascript">
function isKeyPressed(event)
{
  if (event.altKey==1)
    {
    alert("The ALT key was pressed!")
    }
  else
    {
    alert("The ALT key was NOT pressed!")
    }
  }
</script>
</head>

<body onmousedown="isKeyPressed(event)">

<p>Click somewhere in the document.
An alert box will tell you if you 
pressed the ALT key or not.</p>

</body>
</html>
TIY
altKey
检测 ALT 键是否已被按住。■◆429■返回当事件被触发时哪个鼠标按钮被点击    简化命令：．鼠键■．鼠键■返回当事件被触发时，哪个鼠标按钮被点击。



定义和用法
button 事件属性可返回一个整数，指示当事件被触发时哪个鼠标按键被点击。
语法
event.button=0|1|2
参数	描述
0	规定鼠标左键。
1	规定鼠标中键。
2	规定鼠标右键。
Internet Explorer 拥有不同的参数：
参数	描述
1	规定鼠标左键。
4	规定鼠标中键。
2	规定鼠标右键。
提示和注释
注释：对于惯用左手的鼠标配置，上面的参数是颠倒的。
提示：Mozilla 的 Ctrl–Click 参数是 2 （等价于右击）。
实例
The following example alerts which mouse button was clicked:
<html>
<head>
<script type="text/javascript">
function whichButton(event)
  {
    if (event.button==2)
      {
      alert("You clicked the right mouse button!")
      }
    else
      {
      alert("You clicked the left mouse button!")
      }
  }
</script>
</head>

<body onmousedown="whichButton(event)">
	
<p>Click in the document. An alert box will 
alert which mouse button you clicked.</p>

</body>
</html>
TIY
button
检测哪个鼠标键被点击了。■◆429■返回当事件被触发时鼠标指针的水平坐标    简化命令：．鼠X■．鼠X■返回当事件被触发时，鼠标指针的水平坐标。



定义和用法
clientX 事件属性返回当事件被触发时鼠标指针向对于浏览器页面（或客户区）的水平坐标。
客户区指的是当前窗口。
语法
event.clientX
提示和注释
注释：2 级 DOM 没有提供把窗口坐标转换为文档坐标的标准方法。在 IE 以外的浏览器，使用 window.pageXOffset 和 window.pageYOffset 即可。
实例
下面的例子可显示出事件发生时鼠标指针的坐标：
<html>
<head>
<script type="text/javascript">
function show_coords(event)
  {
  x=event.clientX
  y=event.clientY
  alert("X coords: " + x + ", Y coords: " + y)
  }
</script>
</head>

<body onmousedown="show_coords(event)">
	
	<p>Click in the document. An alert box will alert 
the x and y coordinates of the mouse pointer.</p>

</body>
</html>
TIY
clientX
显示鼠标指针的坐标。

■◆429■返回当事件被触发时鼠标指针的垂直坐标    简化命令：．鼠Y■．鼠Y■返回当事件被触发时，鼠标指针的垂直坐标。



定义和用法
clientY 事件属性返回当事件被触发时鼠标指针向对于浏览器页面（客户区）的垂直坐标。
客户区指的是当前窗口。
语法
event.clientY
提示和注释
注释：注意，该坐标不考虑文档的滚动。如果事件发生在窗口的顶部，无论文档滚了多远，clientY 的值都是 0。但是，2 级 DOM 没有提供把窗口坐标转换为文档坐标的标准方法。在 IE 以外的浏览器，使用 window.pageXOffset 和 window.pageYOffset 即可。
实例
下面的例子可显示出事件发生时鼠标指针的坐标：
<html>
<head>
<script type="text/javascript">
function show_coords(event)
  {
  x=event.clientX
  y=event.clientY
  alert("X coords: " + x + ", Y coords: " + y)
  }
</script>
</head>

<body onmousedown="show_coords(event)">
	
<p>Click in the document. An alert box will alert 
the x and y coordinates of the mouse pointer.</p>

</body>
</html>
TIY
clientY
显示鼠标指针的坐标。■◆429■返回当事件被触发时CTRL键是否被按下      简化命令：．CTRL键■．CTRL键■返回当事件被触发时，CTRL键是否被按下。



定义和用法
ctrlKey 事件属性可返回一个布尔值，指示当事件发生时，Ctrl 键是否被按下并保持住。
语法
event.ctrlKey=true|false|1|0
实例
下面的例子可提示当鼠标按键被点击时 "CTRL" 键是否被按住：
<html>
<head>
<script type="text/javascript">
function isKeyPressed(event)
{
  if (event.ctrlKey==1)
    {
    alert("The CTRL key was pressed!")
    }
  else
    {
    alert("The CTRL key was NOT pressed!")
    }
  }
</script>
</head>

<body onmousedown="isKeyPressed(event)">
	
	<p>Click somewhere in the document.
An alert box will tell you if you 
pressed the CTRL key or not.</p>

</body>
</html>
TIY
ctrlKey
检测 CTRL 键是否被按下了。


■◆429■返回当事件被触发时meta键是否被按下      简化命令：．meta键■．meta键■返回当事件被触发时meta键是否被按下。



定义和用法
metaKey 事件属性可返回一个布尔值，指示当事件发生时，"meta" 键是否被按下并保持住。
语法
event.metaKey
实例
下面的例子可提示当鼠标按键被点击时 "meta" 键是否被按住：
<html>
<head>
<script type="text/javascript">
function isKeyPressed(event)
{
  if (event.metaKey==1)
    {
    alert("The meta key was pressed!")
    }
  else
    {
    alert("The meta key was NOT pressed!")
    }
  }
</script>
</head>

<body onmousedown="isKeyPressed(event)">
	
<p>Click somewhere in the document.
An alert box will tell you if you 
pressed the meta key or not.</p>

</body>
</html>
TIY
metakey
检测 meta 键是否被按住（不支持 IE）。■◆429■返回与事件的目标节点相关的节点          简化命令：．相关节■．相关节■返回与事件的目标节点相关的节点。


定义和用法
relatedTarget 事件属性返回与事件的目标节点相关的节点。
对于 mouseover 事件来说，该属性是鼠标指针移到目标节点上时所离开的那个节点。
对于 mouseout 事件来说，该属性是离开目标时，鼠标指针进入的节点。
对于其他类型的事件来说，这个属性没有用。
语法
event.relatedTarget
实例
下面例子可返回指针刚刚离开的元素：
<html>
<head>
<script type="text/javascript">
function getRelElement(event)
  {
  var txt="The cursor just exited the ";
  txt=txt + event.relatedTarget.tagName + " element.";
  alert(txt);
  }
</script>
</head>
<body>

<p onmouseover="getRelElement(event)">
Mouse over this paragraph.</p>

</body>
</html>
TIY
relatedtarget
返回指针刚刚离开的元素（不支持 IE）。■◆429■返回当某个事件被触发时鼠标水平坐标      简化命令：．坐标X■．坐标X■返回当某个事件被触发时，鼠标指针的水平坐标。


定义和用法
screenX 事件属性可返回事件发生时鼠标指针相对于屏幕的水平坐标。
语法
event.screenX
实例
下面的例子可显示出事件发生时鼠标指针的坐标：
<html>
<head>
<script type="text/javascript">
function show_coords(event)
  {
  x=event.screenX
  y=event.screenY
  alert("X coords: " + x + ", Y coords: " + y)
  }
</script>
</head>
<body onmousedown="show_coords(event)">

<p>Click in the document. An alert box will alert 
the x and y coordinates of the cursor.</p>

</body>
</html>
TIY
screenX
提示鼠标指针的坐标。■◆429■返回当某个事件被触发时鼠标垂直坐标      简化命令：．坐标Y■．坐标Y■返回当某个事件被触发时，鼠标指针的垂直坐标。



定义和用法
screenY 事件属性可返回事件发生时鼠标指针相对于屏幕的垂直坐标。
语法
event.screenY
实例
下面的例子可显示出事件发生时鼠标指针的坐标：
<html>
<head>
<script type="text/javascript">
function show_coords(event)
  {
  x=event.screenX
  y=event.screenY
  alert("X coords: " + x + ", Y coords: " + y)
  }
</script>
</head>
<body onmousedown="show_coords(event)">

<p>Click in the document. An alert box will alert 
the x and y coordinates of the cursor.</p>

</body>
</html>
TIY
screenY
提示鼠标指针的坐标。■◆429■返回当事件被触发时SHIFT键是否被按下     简化命令：．SHIFT键■．SHIFT键■返回当事件被触发时SHIFT键是否被按下。



定义和用法
shiftKey 事件属性可返回一个布尔值，指示当事件发生时，"SHIFT" 键是否被按下并保持住。
语法
event.shiftKey=true|false|1|0
实例
下面的例子可提示当鼠标按键被点击时 "SHIFT" 键是否被按住：
<html>
<head>
<script type="text/javascript">
function isKeyPressed(event)
{
  if (event.shiftKey==1)
    {
    alert("The shift key was pressed!")
    }
  else
    {
    alert("The shift key was NOT pressed!")
    }
  }
</script>
</head>

<body onmousedown="isKeyPressed(event)">
	
<p>Click somewhere in the document.
An alert box will tell you if you 
pressed the shift key or not.</p>

</body>
</html>
TIY
shiftKey
检测 SHIFT 键是否被按住。■◆429■返回布尔值指示事件是否是起泡事件类型    简化命令：．起泡■．起泡■返回布尔值，指示事件是否是起泡事件类型。



定义和用法
bubbles 事件属性返回一个布尔值，如果事件是起泡类型，则返回 true，否则返回 fasle。
语法
event.bubbles
事件传播
在 2 级 DOM 中，事件传播分为三个阶段：
第一，捕获阶段。事件从 Document 对象沿着文档树向下传递给目标节点。如果目标的任何一个先辈专门注册了捕获事件句柄，那么在事件传播过程中运行这些句柄。
第二个阶段发生在目标节点自身。直接注册砸目标上的适合的事件句柄将运行。这与 0 级事件模型提供的事件处理方法相似。
第三，起泡阶段。在此阶段，事件将从目标元素向上传播回或起泡回 Document 对象的文档层次。
实例
下面的例子可检测发生的事件是否是一个起泡事件：
<html>
<head>

<script type="text/javascript">
function getEventType(event)
  { 
  alert(event.bubbles);
  }
</script>
</head>

<body onmousedown="getEventType(event)">

<p>Click somewhere in the document. 
An alert box will tell if the event is a bubbling event.</p>

</body>
</html>
TIY
bubbling event
检测事件是否是起泡事件（IE 浏览器不支持）。■◆429■返回布尔值指示事件是否可取消默认动作    简化命令：．可取消■．可取消■返回布尔值，指示事件是否可拥可取消的默认动作。


定义和用法
cancelable 事件返回一个布尔值。如果用 preventDefault() 方法可以取消与事件关联的默认动作，则为 true，否则为 fasle。
语法
event.cancelable
实例
下面的例子讲检测发生的事件是否是一个 cancelable 事件：
<html>
<head>

<script type="text/javascript">
function isEventCancelable(event)
  { 
  alert(event.cancelable);
  }
</script>
</head>

<body onmousedown="isEventCancelable(event)">
	
<p>Click somewhere in the document. 
An alert box will tell if the 
event is a cancelable event.</p>

</body>
</html>
TIY
cancelable event
检测事件是否是 cancelable 事件（IE 浏览器不支持）。■◆429■返回其事件监听器触发该事件的元素        简化命令：．当事元素■．当事元素■返回其事件监听器触发该事件的元素。



定义和用法
currentTarget 事件属性返回其监听器触发事件的节点，即当前处理该事件的元素、文档或窗口。
在捕获和起泡阶段，该属性是非常有用的，因为在这两个节点，它不同于 target 属性。
语法
event.currentTarget
实例
下面的例子可获得哪个元素的监听器触发了事件：
<html>
<head>

<script type="text/javascript">
function getEventTrigger(event)
  { 
  x=event.currentTarget; 
  alert("The id of the triggered element: "
  + x.id);
  }
</script>
</head>

<body >

<p id="p1" onmousedown="getEventTrigger(event)">
Click on this paragraph. An alert box will
show which element triggered the event.</p>

</body>
</html>
TIY
currenttarget event
获得其监听器触发了事件的那个元素。■◆429■返回事件传播的当前阶段                  简化命令：．当前阶段■．当前阶段■返回事件传播的当前阶段。



义和用法
eventPhase 属性返回事件传播的当前阶段。它的值是下面的三个常量之一，它们分别表示捕获阶段、正常事件派发和起泡阶段。
eventPhase 常量
常量	值
Event.CAPTURING_PHASE	1
Event.AT_TARGET 	2
Event.BUBBLING_PHASE	3
■◆429■返回触发此事件的元素，事件的目标节点    简化命令：．何处■．何处■返回触发此事件的元素（事件的目标节点）。




定义和用法
target 事件属性可返回事件的目标节点（触发该事件的节点），如生成事件的元素、文档或窗口。
语法
event.target
实例
下面的例子可获得触发事件的元素：
<html>
<head>

<script type="text/javascript">
function getEventTrigger(event)
  { 
  x=event.target; 
  alert("The id of the triggered element: "
  + x.id);
  }
</script>

</head>
<body >

<p id="p1" onmousedown="getEventTrigger(event)">
Click on this paragraph. An alert box will
show which element triggered the event.</p>

</body>
</html>
TIY
target event
获得触发事件的元素（IE 浏览器不支持）。■◆429■返回事件生成的日期和时间                简化命令：．事件时间■．事件时间■返回事件生成的日期和时间。



定义和用法
timeStamp 事件属性可返回一个时间戳。指示发生事件的日期和时间（从 epoch 开始的毫秒数）。
epoch 是一个事件参考点。在这里，它是客户机启动的时间。
并非所有系统都提供该信息，因此，timeStamp 属性并非对所有系统/事件都是可用的。
语法
event.timeStamp
实例
下面的例子可获得系统启动开始的事件戳：
<html>
<head>
<script type="text/javascript">
function showTimestamp(event)
  {
  var minutes = 1000*60
  x=event.timeStamp;
  alert(x/minutes)
  }
</script>
</head>

<body onmousedown="showTimestamp(event)">

<p>Click in the document. An alert 
box will alert the timestamp.</p>

</body>
</html>
TIY
timestamp event
返回系统启动至今的分钟数（IE 浏览器不支持）。■◆429■返回当前Event对象表示的事件的名称       简化命令：．类型■．类型■返回当前 Event 对象表示的事件的名称。



定义和用法
type 事件属性返回发生的事件的类型，即当前 Event 对象表示的事件的名称。
它与注册的事件句柄同名，或者是事件句柄属性删除前缀 "on" 比如 "submit"、"load" 或 "click"。
语法
event.type
实例
下面的例子可返回被触发的事件的类型：
<html>
<head>
<script type="text/javascript">
function getEventType(event)
  { 
  alert(event.type);
  }
</script>
</head>

<body onmousedown="getEventType(event)">

<p>Click somewhere in the document.
An alert box will tell what event 
type you triggered.</p>

</body>
</html>
TIY
type event
返回被触发的事件的类型（IE 浏览器不支持）。■◆429■初始化新创建的Event对象的属性()         简化命令：．初始化■．初始化■初始化新创建的 Event 对象的属性。


定义和用法
初始化新事件对象的属性
语法
event.initEvent(eventType,canBubble,cancelable)
参数	描述
eventType	字符串值。事件的类型。
canBubble	事件是否起泡。
cancelable	是否可以用 preventDefault() 方法取消事件。
说明
该方法将初始化 Document.createEvent() 方法创建的合成 Event 对象的 type 属性、bubbles 属性和 cancelable 属性。只有在新创建的 Event 对象被 Document 对象或 Element 对象的 dispatchEvent() 方法分派之前，才能调用 Event.initEvent() 方法。■◆429■通知浏览器不要执行与事件关联默认动作()  简化命令：．取消■．取消■通知浏览器不要执行与事件关联的默认动作。


定义和用法
取消事件的默认动作。
语法
event.preventDefault()
说明
该方法将通知 Web 浏览器不要执行与事件关联的默认动作（如果存在这样的动作）。例如，如果 type 属性是 "submit"，在事件传播的任意阶段可以调用任意的事件句柄，通过调用该方法，可以阻止提交表单。注意，如果 Event 对象的可取消属性是 fasle，那么就没有默认动作，或者不能阻止默认动作。无论哪种情况，调用该方法都没有作用。■◆429■不再派发事件()                          简化命令：．阻止分派■．阻止分派■不再派发事件。


定义和用法
不再派发事件。
终止事件在传播过程的捕获、目标处理或起泡阶段进一步传播。调用该方法后，该节点上处理该事件的处理程序将被调用，事件不再被分派到其他节点。
语法
event.stopPropagation()
说明
该方法将停止事件的传播，阻止它被分派到其他 Document 节点。在事件传播的任何阶段都可以调用它。注意，虽然该方法不能阻止同一个 Document 节点上的其他事件句柄被调用，但是它可以阻止把事件分派到其他节点。■◆345■表单■表单■Form 对象
Form 对象代表一个 HTML 表单。
在 HTML 文档中 <form> 每出现一次，Form 对象就会被创建。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆471■包含表单中所有元素的数组［集合］        简化命令：．元素■．元素■包含表单中所有元素的数组。



定义和用法
elements 集合可返回包含表单中所有元素的数组。
元素在数组中出现的顺序和它们在表单的HTML 源代码中出现的顺序相同。
每个元素都有一个 type 属性，其字符串值说明了元素的类型。
语法
formObject.elements[].property
提示和注释
提示：如果 elements[] 数组具有名称（input 标签的 id 或 name 属性），那么该元素的名称就是 formObject 的一个属性，因此可以使用名称而不是数字来引用 input 对象。
举例，假设 x 是一个 form 对象，其中的一个 input 对象的名称是 fname，则可以使用 x.fname 来引用该对象。
实例
下面的例子输出了所有表单元素的值和类型：
<html>
<body>

<form id="myForm">
Firstname: <input id="fname" type="text" value="Mickey" />
Lastname: <input id="lname" type="text" value="Mouse" />
<input id="sub" type="button" value="Submit" />
</form>

<p>Get the value of all the elements in the form:<br />
<script type="text/javascript">
var x=document.getElementById("myForm");
for (var i=0;i<x.length;i++)
  {
  document.write(x.elements[i].value);
  document.write("<br />");
  document.write(x.elements[i].type);
  document.write("<br />");
  }
</script>
</p>

</body>
</html>
TIY
取得所有表单元素的值和类型■◆471■服务器可接受的字符集                    简化命令：．服务器可接受字符集■．服务器可接受字符集■服务器可接受的字符集。


定义和用法
acceptCharset 属性可设置或返回一个逗号分隔的列表，内容是服务器可接受的字符集。
语法
formObject.acceptCharset=charset
实例
下面的例子提示出表单数据可能的字符集：
<html>
<head>
<script type="text/javascript">
function showCharset()
  {
  var x=document.getElementById("myForm")
  alert(x.acceptCharset)
  }
</script>
</head>
<body>

<form id="myForm" acceptCharset="ISO-8859-1">
Text: <input type="text" value="Hello World!">
<input type="button" onclick="showCharset()"
value="Show charset">
</form>

</body>
</html>
TIY
取得表单数据可能的字符集■◆471■设置或返回表单的action属性              简化命令：．目标地址■．目标地址■设置或返回表单的 action 属性。



定义和用法
action 属性可设置或返回表单的 action 属性。
action 属性定义了当表单被提交时数据被送往何处。
语法
formObject.action=URL
实例
下面的例子可更改表单的 action URL：
<html>
<head>
<script type="text/javascript">
function changeAction()
  {
  var x=document.getElementById("myForm")
  alert("Original action: " + x.action)
  x.action="index.asp"
  alert("New action: " + x.action)
  x.submit()
  }
</script>
</head>
<body>

<form id="myForm" action="js_examples.asp">
Name: <input type="text" value="Mickey Mouse" />
<input type="button" onclick="changeAction()"
value="Change action attribute and submit form" />
</form>

</body>
</html>
TIY
更改表单的 action 属性■◆471■设置或返回表单用来编码内容的MIME类型    简化命令：．表单数据编码■．表单数据编码■设置或返回表单用来编码内容的 MIME 类型。



义和用法
enctype 属性可设置或返回用于编码表单内容的 MIME 类型。
如果表单没有 enctype 属性，那么当提交文本时的默认值是 "application/x-www-form-urlencoded"。
当 input type 是 "file" 时，值是 "multipart/form-data"。
语法
formObject.encoding=encoding
实例
下面的例子可返回表单的编码类型：
<html>
<head>
<script type="text/javascript">
function showEnctype()
  {
  var x=document.getElementById("myForm")
  alert(x.enctype)
  }
</script>
</head>
<body>

<form id="myForm" enctype="application/x-www-form-urlencoded">
Name: <input type="text" value="Mickey Mouse" />
<input type="button" onclick="showEnctype()"
value="Show enctype" />
</form>

</body>
</html>
TIY
取得表单的编码类型。■◆471■设置或返回表单的id                      简化命令：．id■．id■设置或返回表单的 id。


定义和用法
id 属性可设置或返回表单的 id。
语法
formObject.id=id
实例
下面的例子展示了两种返回 <form> 元素的 id 的方法：
<html>
<body>

<form id="myForm">
Text: <input type="text" size="20" value="Hello World" />
</form>

<script type="text/javascript">
x=document.getElementsByTagName('form')[0];
document.write("Form id: " + x.id);
document.write("<br />");
document.write("An alternate way: ");
document.write(document.getElementById('myForm').id);
</script>

</body>
</html>
TIY
从 <form> 元素取得 id■◆471■返回表单中的元素数目                    简化命令：．元素数目■．元素数目■返回表单中的元素数目。


定义和用法
length 属性可返回表单中元素的数目。
语法
formObject.length
实例
下面的例子可返回表单中元素的数目：
<html>
<body>

<form id="myForm" method="get">
Name: <input type="text" size="20" value="Peter Griffin" /><br />
Text: <input type="text" size="20" value="Hello World" />
</form>

<script type="text/javascript">
document.write("Number of elements in myForm: ");
document.write(document.getElementById('myForm').length);
</script>

</body>
</html>
TIY
取得表单中元素的数目■◆471■设置或返回将数据发送到服务器的HTTP方法  简化命令：．如何发送■．如何发送■设置或返回将数据发送到服务器的 HTTP 方法。


定义和用法
method 属性可设置或返回用于表单提交的 HTTP 方法。
语法
formObject.method=get|post
实例
下面的例子弹出的对话框中显示了发送表单数据所使用的 HTTP 方法：
<html>
<head>
<script type="text/javascript">
function showMethod()
  {
  var x=document.getElementById("myForm")
  alert(x.method)
  }
</script>
</head>
<body>

<form id="myForm" method="post">
Name: <input type="text" size="20" value="Mickey Mouse" />
<input type="button" onclick="showMethod()" value="Show method" />
</form>

</body>
</html>
TIY
返回向服务器发送数据的 HTTP 方法■◆471■设置或返回表单的名称                    简化命令：．名称■．名称■设置或返回表单的名称。



定义和用法
name 属性可设置或返回表单的名称。
语法
formObject.name=formname
实例
下面的例子可返回表单的名称：
<html>
<body>
<form id="myForm" method="get" name="myForm">
Name: <input type="text" size="20" value="Peter Griffin" />
</form>

<script type="text/javascript">
document.write("Form name: ");
document.write(document.getElementById('myForm').name);
</script>

</body>
</html>
TIY
取得 <form> 元素的名称■◆471■设置或返回表单提交结果的Frame或Window名 简化命令：．何处■．何处■设置或返回表单提交结果的 Frame 或 Window 名。



定义和用法
target 属性可设置或返回在何处打开表单中的 action-URL。
语法
formObject.target=_blank|_parent|_self|_top 
四个保留的目标名称：
_blank - 在一个新的未命名的窗口载入文档
_self - 在相同的框架或窗口中载入目标文档
_parent - 把文档载入父窗口或包含了超链接引用的框架的框架集
_top - 把文档载入包含该超链接的窗口,取代任何当前正在窗口中显示的框架
实例
下面的例子可设置在一个新窗口打开 action-URL：
<html>
<head>
<script type="text/javascript">
function submitForm()
  {
  var x=document.getElementById("myForm");
  x.target="_blank";
  x.submit();
  }
</script>
</head>
<body>

<form id="myForm" action="default.asp">
Name: <input type="text" value="Mickey Mouse" />
<input type="button" onclick="submitForm()"
value="Submit" />
</form>

</body>
</html>
TIY
设置表单的 property 属性■◆471■把表单的所有输入元素重置为它们的默认值()简化命令：．值重置■．值重置■把表单的所有输入元素重置为它们的默认值。



定义和用法
reset() 方法可把表单中的元素重置为它们的默认值。
语法
formObject.reset()
说明
调用该方法的结果类似用户单击了 Reset 按钮的结果，只是表单的事件句柄 onreset 不会被调用。
实例
<html>
<head>
<script type="text/javascript">
function formReset()
  {
  document.getElementById("myForm").reset()
  }
</script>
</head>

<form id="myForm">
Name: <input type="text" size="20"><br />
Age: <input type="text" size="20"><br />
<br />
<input type="button" onclick="formReset()" value="Reset">
</form>
</body>

</html>
TIY
重置表单■◆471■提交表单()                              简化命令：．提交■．提交■提交表单。



定义和用法
submit() 方法把表单数据提交到 Web 服务器。
语法
formObject.submit()
说明
该方法提交表单的方式与用户单击 Submit 按钮一样，但是表单的 onsubmit 事件句柄不会被调用。
实例
<html>
<head>
<script type="text/javascript">
function formSubmit()
  {
  document.getElementById("myForm").submit()
  }
</script>
</head>

<body>

<form id="myForm" action="js_form_action.asp" method="get">
Firstname: <input type="text" name="firstname" size="20"><br />
Lastname: <input type="text" name="lastname" size="20"><br />
<br />
<input type="button" onclick="formSubmit()" value="Submit">
</form>
</body>

</html>
TIY
提交表单■◆471■在重置表单元素之前调用        事件句柄！简化命令：．重置■．重置■在重置表单元素之前调用。




定义和用法
在重置表单时调用的处理器。
语法
form.onreset
说明
Form 对象的 onreset 属性指定了一个事件句柄函数。当用户单击了表单中的 Reset 按钮而提交一个重置时，就会调用这个事件句柄函数。注意，这个句柄不会作为 Form.reset() 方法响应而被调用。如果 onreset 句柄返回 fasle，表单的元素就不会重置。■◆471■在提交表单之前调用            事件句柄！简化命令：．确认■．确认■在提交表单之前调用。



定义和用法
在提交表单时调用的事件句柄。
语法
form.onsubmit
说明
Form 对象的 onsubmit 属性指定了一个事件句柄函数。当用户单击了表单中的 Submit 按钮而提交一个表单时，就会调用这个事件句柄函数。注意，当调用方法Form.submit() 时，该处理器函数不会被调用。
如果 onsubmit 句柄返回 fasle，表单的元素就不会提交。如果该函数返回其他值或什么都没有返回，则表单会被提交。
提示和注释
提示：由于 onsubmit 句柄可以取消表单的提交，所以它对于进行表单验证是十分理想的。■◆345■框架■框架■Frame 对象
Frame 对象代表一个 HTML 框架。
在 HTML 文档中 <frame> 每出现一次，就会创建一个 Frame对象。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆485■容纳框架的内容的文档                    简化命令：．父文档■．父文档■容纳框架的内容的文档。



定义和用法
contentDocument 属性以 HTML 对象返回框架容纳的文档。
可以通过所有标准的 DOM 方法来处理被返回的对象。
语法
frameObject.contentDocument
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
  <frameset cols="50%,50%">
    <frame id="leftFrame" src="frame_cdoc.htm">
    <frame id="rightFrame" src="frame_a.htm">
  </frameset>
</html>
HTML 文档 "frame_cdoc.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_cdoc.htm" 的源代码：
<html>
<head>
<script type="text/javascript">
function showCDoc()
  {
  var x=parent.document.getElementById("leftFrame")
  alert(x.contentDocument.documentElement.tagName)
  }
</script>
</head>
<body>

<input type="button" onclick="showCDoc()"
value="Show content-document's first tag" />

</body>
</html>
TIY
返回作为 HTML 对象的框架文档。■◆485■设置或返回是否显示框架周围的边框        简化命令：．框显示■．框显示■设置或返回是否显示框架周围的边框。



定义和用法
frameBorder 属性设置或返回是否显示框架周围的边框。
如果不希望出现框架的边框，请把该属性设置为 0。
语法
frameObject.frameBorder=1|0
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
<frameset cols="50%,50%">
  <frame id="leftFrame" frameBorder="1"
  src="frame_frameborder.htm">
  <frame id="rightFrame" frameBorder="0" src="frame_a.htm" >
</frameset>
</html>
HTML 文档 "frame_frameborder.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_frameborder.htm" 的源代码：
<html>
<body>

<script type="text/javascript">
x=parent.document.getElementById("leftFrame");
y=parent.document.getElementById("rightFrame");

document.write("Frame border for leftFrame is: ");
document.write(x.frameBorder);

document.write("<br />Frame border for rightFrame is: ");
document.write(y.frameBorder);
</script>

</body>
</html>
TIY
返回框架的 frameBorder 属性■◆485■设置或返回框架的id                      简化命令：．id■．id■设置或返回框架的 id。


定义和用法
id 属性可返回框架的 id。
语法
frameObject.id=id
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
<frameset cols="50%,50%">
  <frame id="leftFrame" src="frame_id.htm">
  <frame id="rightFrame" src="frame_a.htm" >
</frameset>
</html>
HTML 文档 "frame_id.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_id.htm" 的源代码：
<html>
<body>

<script type="text/javascript">
x=parent.document.getElementsByTagName("frame")[0];
y=parent.document.getElementsByTagName("frame")[1];


document.write("The id for the left frame is: ");
document.write(x.id);

document.write("<br />The id for the right frame is: ");
document.write(y.id);
</script>

</body>
</html>
TIY
返回框架的 id■◆485■设置或返回指向包含框架内容描述文档的URL 简化命令：．框URL说明■．框URL说明■设置或返回指向包含框架内容描述文档的 URL。



义和用法
longDesc 属性可设置或返回一个框架内容描述的 URL。
提示：对那么不支持框架的浏览器使用该属性。
语法
frameObject.longDesc=URL
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
  <frameset cols="50%,50%">
    <frame id="leftFrame" src="frame_longdesc.htm"
    longdesc="frame_description.htm">
    <frame id="rightFrame" src="frame_a.htm">
  </frameset>
</html>
HTML 文档 "frame_longdesc.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_longdesc.htm" 的源代码：
<html>
<body>

<script type="text/javascript">
x=parent.document.getElementById("leftFrame");

document.write("Description for this frame: ");
document.write('<a href="' + x.longDesc
+ '">Description</a>');
</script>

</body>
</html>
TIY
使用 <frame> 元素中的 longdesc 属性

■◆485■设置或返回框架的顶部和底部页空白        简化命令：．竖空白■．竖空白■设置或返回框架的顶部和底部页空白。



定义和用法
marginHeight 属性可设置或返回框架的顶部和底部页空白（以像素为单位）。
语法
frameObject.marginHeight=pixels
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
  <frameset cols="50%,50%">
    <frame id="leftFrame" marginheight="50"
    src="frame_marginheight.htm">
    <frame id="rightFrame" marginheight="100"
    src="frame_a.htm">
  </frameset>
</html>
HTML 文档 "frame_marginheight.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_marginheight.htm" 的源代码：
<html>
<body>

script type="text/javascript">
x=parent.document.getElementById("leftFrame");
y=parent.document.getElementById("rightFrame");

document.write("Top/Bottom margins for leftFrame: ");
document.write(x.marginHeight);
document.write("<br />Top/Bottom margins for rightFrame: ");
document.write(y.marginHeight);
</script>

</body>
</html>
TIY
返回框架的顶部和底部页空白■◆485■设置或返回框架的左边缘和右边缘的空白    简化命令：．横空白■．横空白■设置或返回框架的左边缘和右边缘的空白。



定义和用法
marginWidth 属性可设置或返回框架的左边缘和右边缘的页空白（以像素为单位）。
语法
frameObject.marginWidth=pixels
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
  <frameset cols="50%,50%">
    <frame id="leftFrame" marginwidth="50"
    src="frame_marginwidth.htm">
    <frame id="rightFrame" marginwidth="20"
    src="frame_a.htm">
  </frameset>
</html>
HTML 文档 "frame_marginwidth.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_marginwidth.htm" 的源代码：
<html>
<body>

script type="text/javascript">
x=parent.document.getElementById("leftFrame");
y=parent.document.getElementById("rightFrame");

document.write("Left/Right margins for leftFrame: ");
document.write(x.marginWidth);
document.write("<br />Left/Right margins for rightFrame: ");
document.write(y.marginWidth);
</script>

</body>
</html>
TIY
返回框架的左侧和右侧的空白■◆485■设置或返回框架的名称                    简化命令：．名称■．名称■设置或返回框架的名称。


定义和用法
name 属性可设置或返回框架的名称。
语法
frameObject.name=name
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
  <frameset cols="50%,50%">
    <frame id="leftFrame" name="toc" src="frame_name.htm">
    <frame id="rightFrame" name="main" src="frame_a.htm">
  </frameset>
</html>
HTML 文档 "frame_name.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_name.htm" 的源代码：
<html>
<body>

<script type="text/javascript">
x=parent.document.getElementById("leftFrame");
y=parent.document.getElementById("rightFrame");

document.write("The name of leftFrame is: ");
document.write(x.name);

document.write("<br />The name of rightFrame is: ");
document.write(y.name);
</script>

</body>
</html>
TIY
返回框架的名称■◆485■设置或返回框架是否可调整大小            简化命令：．不可调■．不可调■设置或返回框架是否可调整大小。



定义和用法
noResize 属性可设置或返回是否可调整框架的大小。
语法
frameObject.noResize=true|false
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
  <frameset cols="50%,50%">
    <frame id="leftFrame" src="frame_noresize.htm">
    <frame id="rightFrame" src="frame_a.htm">
  </frameset>
</html>
HTML 文档 "frame_noresize.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_noresize.htm" 的源代码：
<html>
<head>
<script type="text/javascript">
function disableResize()
  {
  parent.document.getElementById("leftFrame").noResize=true
  parent.document.getElementById("rightFrame").noResize=true
  }
function enableResize()
  {
  parent.document.getElementById("leftFrame").noResize=false
  parent.document.getElementById("rightFrame").noResize=false
  }
</script>
</head>

<body>
<input type="button" onclick="disableResize()" value="No resize" />
<input type="button" onclick="enableResize()" value="Resize" />
</body>

</html>
TIY
可调整大小和不可调整大小的框架■◆485■设置或返回框架是否可拥有滚动条          简化命令：．有滚条■．有滚条■设置或返回框架是否可拥有滚动条。



定义和用法
scrolling 属性可设置或返回框架是否拥有滚动条。
语法
frameObject.scrolling=yes|no
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
  <frameset cols="50%,50%">
    <frame id="leftFrame" src="frame_scroll.htm">
    <frame id="rightFrame" src="frame_a.htm">
  </frameset>
</html>
HTML 文档 "frame_scroll.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_scroll.htm" 的源代码：
<html>
<head>
<script type="text/javascript">
function enableScrolling()
  {
  parent.document.getElementById("leftFrame").scrolling="yes"
  parent.document.getElementById("rightFrame").scrolling="yes"
  }
function disableScrolling()
  {
  parent.document.getElementById("leftFrame").scrolling="no"
  parent.document.getElementById("rightFrame").scrolling="no"
  }
</script>
</head>

<body>
<input type="button" onclick="enableScrolling()"
value="Scroll bars" />
<input type="button" onclick="disableScrolling()"
value="No scroll bars" />
</body>

</html>
TIY■◆485■设置或返回应被加载到框架中的文档的URL   简化命令：．框URL■．框URL■设置或返回应被加载到框架中的文档的 URL



定义和用法
src 属性可设置或返回应当被载入框架中的文档的 URL。
该属性只是 HTML 的 <frame> 标记的一个对应，并不是 Window.location 这样的 Location 对象。
语法
frameObject.src=URL
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
  <frameset cols="50%,50%">
    <frame id="lFrame" src="frame_src.htm">
    <frame id="rFrame" src="frame_a.htm">
  </frameset>
</html>
HTML 文档 "frame_src.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_src.htm" 的源代码：
<html>
<head>
<script type="text/javascript">
function newSrc()
{
parent.document.getElementById("lFrame").src="http://w3school.com.cn"
parent.document.getElementById("rFrame").src="http://google.com"
}
</script>
</head>

<body>
<form>
<input type="button" onclick="newSrc()"
value="Change frame source" />
</form>
</body>

</html>
TIY
更改两个框架的源■◆345■框架集■框架集■Frameset 对象
Frameset 对象代表 HTML 框架集。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆496■设置或返回框架集中列的数目              简化命令：．列数■．列数■设置或返回框架集中列的数目。


定义和用法
cols 属性可设置或返回框架集中列的数目和尺寸。
由逗号分割的像素或百分比列表定义了列的数目和宽度：
语法
framesetObject.cols=col1,col2,col3....
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
<frameset cols="50%,50%">
  <frame src="frame_cols.htm">
  <frame src="frame_a.htm">
</frameset>
</html>
HTML 文档 "frame_cols.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_cols.htm" 的源代码：
<html>
<head>
<script type="text/javascript">
function changeCols()
  {
  parent.document.getElementById("main").cols="30%,70%"
  }
  
function restoreCols()
  {
  parent.document.getElementById("main").cols="50%,50%"
  }
</script>
</head>
<body>

<input type="button" onclick="changeCols()"
value="Change column size" />
<input type="button" onclick="restoreCols()"
value="Restore column size" />

</body>
</html>
TIY
更改框架集的列尺寸
■◆496■设置或返回框架集的id                    简化命令：．id■．id■设置或返回框架集的 id。



定义和用法
id 属性可设置或返回框架集的 id。
语法
framesetObject.id=id
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
<frameset id="main" cols="50%,50%">
  <frame id="leftFrame" src="frame_frameset_id.htm">
  <frame id="rightFrame" src="frame_a.htm" >
</frameset>
</html>
HTML 文档 "frame_frameset_id.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_frameset_id.htm" 的源代码：
<html>
<head>
<script type="text/javascript">
function showFrameId()
  {
  var txt="Frameset Id: "
  txt=txt + parent.document.getElementById("main").id
  alert(txt)
  }
</script>
</head>
<body>

<input type="button" onclick="showFrameId()"
value="Show Frameset Id" />

</body>
</html>
TIY
取得 <frameset> 元素的 id■◆496■设置或返回框架集中行的数目              简化命令：．行数■．行数■设置或返回框架集中行的数目。



定义和用法
rows 属性可设置或返回框架中行的数目和尺寸。
由逗号分割的像素或百分比列表定义了列的数目和高度：
语法
framesetObject.rows=row1,row2,row3....
实例
在我们的例子中，首先将创建包含带有两个列的框架集的 HTML 文档。每列设置为浏览器窗口的 50%：
<html>
<frameset rows="50%,50%">
  <frame src="frame_rows.htm">
  <frame src="frame_a.htm">
</frameset>
</html>
HTML 文档 "frame_rows.htm" 被放入第一列，而 HTML 文档 "frame_a.htm" 被放入第二列。
下面是 "frame_rows.htm" 的源代码：
<html>
<head>
<script type="text/javascript">
function changeRows()
  {
  parent.document.getElementById("main").rows="30%,70%"
  }

function restoreRows()
  {
  parent.document.getElementById("main").rows="50%,50%"
  }
</script>
</head>
<body>

<form>
<input type="button" onclick="changeRows()"
value="Change row size" />
<input type="button" onclick="restoreRows()"
value="Restore row size" />
</form>

</body>
</html>
TIY
更改框架集的行尺寸■◆345■内联框架■内联框架■IFrame 对象
IFrame 对象代表一个 HTML 的内联框架。
在 HTML 文档中 <iframe> 每出现一次，一个 IFrame 对象就会被创建。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆500■根据周围的文字排列 iframe               简化命令：．对齐■．对齐■根据周围的文字排列 iframe。



定义和用法
align 属性可设置或返回如何根据周围的文本来排列 iframe。
语法
iframeObject.align=left|right|top|middle|bottom
实例
下面的例子将把 iframe 根据环绕文本排列到右侧：
<html>
<body>

<iframe src="frame_a.htm" id="frame1"></iframe>

<p>Some text. Some text. Some text. Some text.</p>

<script type="text/javascript">
document.getElementById("frame1").align="right";
</script>

</body>
</html>
TIY
设置 <iframe> 的排列方式■◆500■容纳框架内容的文档                      简化命令：．父文档■．父文档■容纳框架的内容的文档。



定义和用法
contentDocument 属性能够以 HTML 对象来返回 iframe 中的文档。
可以通过所有标准的 DOM 方法来处理被返回的对象。
语法
iframeObject.contentDocument
实例
下面的例子可从载入 iframe 的文档的第一个 <h2> 元素中提取文本：
<html>
<head>
<script type="text/javascript">
function getTextNode()
{
var x=document.getElementById("frame1").contentDocument;
alert(x.getElementsByTagName("h2")[0].childNodes[0].nodeValue);
}
</script>
</head>

<body>
<iframe src="frame_a.htm" id="frame1"></iframe>
<br /><br />
<input type="button" onclick="getTextNode()" value="Get text" />

</body>
</html>
TIY
从 iframe 文档中提取文本节点■◆500■设置或返回是否显示iframe周围边框        简化命令：．框显示■．框显示■设置或返回是否显示 iframe 周围的边框。



定义和用法
frameBorder 属性可设置或返回是否显示 iframe 周围的边框。
把该属性设置为 0，可以获得无边框的框架。
语法
iframeObject.frameBorder=1|0
实例
本例可设置 iframe 是否拥有边框：
<html>
<head>
<script type="text/javascript">
function removeBorder()
  {
  document.getElementById("frame1").frameBorder="0";
  }
function restoreBorder()
  {
  document.getElementById("frame1").frameBorder="1";
  }
</script>
</head>
<body>

<iframe src="frame_a.htm" id="frame1"></iframe>
<br /><br />
<input type="button" onclick="removeBorder()"
value="Remove border" />
<input type="button" onclick="restoreBorder()"
value="Restore border" />

</body>
</html>
TIY
更改 iframe 的边框■◆500■设置或返回 iframe 的高度                简化命令：．全高■．全高■设置或返回 iframe 的高度。



定义和用法
height 属性可设置或返回 iframe 的高度（以像素或百分比为单位）。
语法
iframeObject.height=pixels
实例
下面的例子可更改 iframe 的高度：
<html>
<head>
<script type="text/javascript">
function changeHeight()
  {
  document.getElementById("frame1").height="200";
  }
</script>
</head>
<body>

<iframe src="frame_a.htm" id="frame1" height="100"></iframe>
<br /><br />

<input type="button" onclick="changeHeight()"
value="Change height" />

</body>
</html>
TIY
更改 iframe 的高度和宽度■◆500■设置或返回 iframe 的 id                 简化命令：．id■．id■设置或返回 iframe 的 id。



定义和用法
id 属性可设置或返回 iframe 的 id。
语法
iframeObject.id=id
实例
本例展示了两种返回 iframe 的 id 的方法：
<html>
<body>

<iframe src="frame_a.htm" id="frame1"></iframe>
<br /><br />

<script type="text/javascript">
document.write("The iframe's id: ");
document.write(document.getElementsByTagName("iframe")[0].id);
document.write("<br /><br />");

document.write("An alternate way: ");
document.write("<br />");
document.write("The iframe's id: ");
document.write(document.getElementById("frame1").id);
</script>

</body>
</html>
TIY
返回 <iframe> 元素的 id■◆500■设置或返回描述iframe内容的文档的 URL    简化命令：．框URL说明■．框URL说明■设置或返回描述  iframe 内容的文档的 URL。



定义和用法
longDesc 属性可设置或返回包含 iframe 内容描述的文档的 URL。
提示：请把该属性用于不支持框架的浏览器。
语法
iframeObject.longDesc=URL
实例
下面的例子创建了一个指向一个描述页面的链接：
<html>
<body>
<iframe src="frame_a.htm" id="frame1"
longdesc="frame_description.htm"></iframe>
<br />

<script type="text/javascript">
x=document.getElementById("frame1");
document.write("Description for frame contents: ");
document.write('<a href="' + x.longDesc + '">Description</a>');
</script>

</body>
</html>
TIY
使用 <iframe> 元素中的 longdesc 属性

■◆500■设置或返回iframe顶部和底部的页空白      简化命令：．竖空白■．竖空白■设置或返回 iframe 的顶部和底部的页空白。



定义和用法
marginHeight 属性可设置或返回框架顶部和底部的页面空白（以像素计）。
语法
iframeObject.marginHeight=pixels
实例
下面的例子可返回 iframe 顶部和底部的页面空白：
<html>
<body>
<iframe src="frame_a.htm" id="frame1" marginheight="50"></iframe>
<br />

<script type="text/javascript">
x=document.getElementById("frame1");
document.write("Top and bottom margins of the iframe are: ");
document.write(x.marginHeight);
</script>

</body>
</html>
TIY
返回 iframe 的顶部和底部页空白■◆500■设置或返回iframe左侧和右侧的页空白      简化命令：．横空白■．横空白■设置或返回 iframe 的左侧和右侧的页空白。


定义和用法
marginWidth 属性可设置或返回框架的左侧和右侧边缘的页面空白（以像素为单位）。
语法
iframeObject.marginWidth=pixels
实例
下面的例子将返回 iframe 的左边缘和右边缘的页空白：
<html>
<body>
<iframe src="frame_a.htm" id="frame1" marginwidth="50"></iframe>
<br /><br />

<script type="text/javascript">
x=document.getElementById("frame1");
document.write("Left and right margins of the iframe are: ");
document.write(x.marginWidth);
</script>

</body>
</html>
TIY
返回 iframe 的左边缘和右边缘的页空白■◆500■设置或返回 iframe 的名称                简化命令：．名称■．名称■设置或返回 iframe 的名称。



定义和用法
name 属性可设置或返回 iframe 的名称。
语法
iframeObject.name=name
实例
下面的例子可返回 iframe 的名称：
<html>
<body>
<iframe src="frame_a.htm" id="frame1" name="iframe">
</iframe><br />

<script type="text/javascript">
x=document.getElementById("frame1");
document.write("The iframe's name is: ");
document.write(x.name);
</script>

</body>
</html>
TIY
返回 <iframe> 的名称■◆500■设置或返回 iframe 是否可拥有滚动条      简化命令：．有滚条■．有滚条■设置或返回 iframe 是否可拥有滚动条。



定义和用法
scrolling 属性可设置或返回 iframe 是否拥有滚动条（滚动策略）。
语法
iframeObject.scrolling=auto|yes|no
实例
下面的例子可添加和删除 iframe 的滚动条：
<html>
<head>
<script type="text/javascript">
function addScrollbars()
  {
  document.getElementById("frame1").scrolling="yes";
  }
  function removeScrollbars()
  {
  document.getElementById("frame1").scrolling="no";
  }
</script>
</head>

<body>
<iframe src="frame_a.htm" id="frame1" ></iframe><br />

<input type="button" onclick="addScrollbars()"
value="Add Scrollbars" />
<input type="button" onclick="removeScrollbars()"
value="Remove Scrollbars" />

</body>
</html>
TIY
添加和删除 <iframe> 元素的滚动条■◆500■设置或返回应载入iframe中的文档的URL     简化命令：．框URL■．框URL■设置或返回应载入 iframe 中的文档的 URL。



定义和用法
src 属性可设置或返回被载入 iframe 中的文档的 URL。
语法
iframeObject.src=URL
实例
下面的例子可更改两个框架的源：
<html>
<head>
<script type="text/javascript">
function changeSource()
  {
  document.getElementById("frame1").src="frame_c.htm"
  document.getElementById("frame2").src="frame_d.htm"
  }
</script>
</head>
<body>

<iframe src="frame_a.htm" id="frame1"></iframe>
<iframe src="frame_b.htm" id="frame2"></iframe>
<br /><br />
<input type="button" onclick="changeSource()"
value="Change source of the two iframes" />

</body>
</html>
TIY
更改两个框架的源■◆500■设置或返回 iframe 的宽度                简化命令：．全宽■．全宽■设置或返回 iframe 的宽度。



定义和用法
width 属性可设置或返回 iframe 的宽度（以像素或百分比为单位）。
语法
iframeObject.width=pixels
实例
下面的例子可更改 iframe 的宽度：
<html>
<head>
<script type="text/javascript">
function changeWidth()
{
document.getElementById("frame1").width="100";
}
</script>
</head>
<body>

<iframe src="frame_a.htm" id="frame1" width="200"></iframe>
<br /><br />

<input type="button" onclick="changeWidth()"
value="Change size" />

</body>
</html>
TIY
更改 iframe 的高度和宽度■◆345■图像■图像■Image 对象
Image 对象代表嵌入的图像。
<img> 标签每出现一次，一个 Image 对象就会被创建。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆513■设置或返回与内联内容的对齐方式          简化命令：．对齐■．对齐■设置或返回与内联内容的对齐方式。



定义和用法
align 属性可设置返回与内联内容的对齐方式。
语法
imageObject.align=left|right|top|middle|bottom
实例
下面的例子把图像根据周围的文本进行右对齐：
<html>
<body>

<img id="compman" src="compman.gif" alt="Computerman" />
	
<p>Some text. Some text. Some text. Some text.</p>
	
<script type="text/javascript">
document.getElementById("compman").align="right";
</script>

</body>
</html>
TIY
设置 <image> 元素的对齐方式■◆513■设置或返回无法显示图像时的替代文本      简化命令：．备文■．备文■设置或返回无法显示图像时的替代文本。


定义和用法
alt 属性可设置或返回图像无法显示时的替代文本。
语法
imageObject.alt=alternate_text
实例
下面的例子将更改图像的替代文本：
<html>
<head>
<script type="text/javascript">
function changeAlt()
  {
  document.getElementById("compman").alt="Man using computer"
  }
function alertAlt()
  {
  alert(document.getElementById("compman").alt)
  }
</script>
</head>
<body>

<img id="compman" src="compman.gif" alt="Computerman" />
<br />
<input type="button" onclick="changeAlt()"
value="Change alt text">
<br /><br />
<input type="button" onclick="alertAlt()" 
value="Alert alt text">

</body>
</html>
TIY
更改图像的替代文本■◆513■设置或返回图像周围的边框                简化命令：．框宽■．框宽■设置或返回图像周围的边框。


定义和用法
border 属性可设置或返回图像周围的边框宽度。
语法
imageObject.border=pixels
实例
下面的例子可更改图像的边框宽度：
<<html>
<head>
<script type="text/javascript">
function changeBorder()
  {
  document.getElementById("compman").border="3"
  }
</script>
</head>
<body>

<img id="compman" src="compman.gif" alt="Computerman" />
<br /><br />
<input type="button" onclick="changeBorder()"
value="Change border" />

</body>
</html>
TIY
更改图像周围的边框■◆513■返回浏览器是否已完成对图像的加载        简化命令：．完成■．完成■返回浏览器是否已完成对图像的加载。



定义和用法
complete 属性可返回浏览器是否已完成对图像的加载。
如果加载完成，则返回 true，否则返回 fasle。
语法
imageObject.complete
实例
下面的例子可检测图形是否已完成加载：
<html>
<head>
<script type="text/javascript">
function alertComplete()
{
alert(document.getElementById("compman").complete)
}
</script>
</head>
<body onload="alertComplete()">

<img id="compman" src="compman.gif" alt="Computerman"
width="107" height="98" />

</body>
</html>
TIY
检测图形是否已完成加载■◆513■设置或返回图像的高度                    简化命令：．全高■．全高■设置或返回图像的高度。




定义和用法
height 属性可设置或返回图像的高度。
语法
imageObject.height=pixels
实例
下面的例子可设置图像的高度和宽度：
<html>
<head>
<script type="text/javascript">
function changeSize()
{
document.getElementById("compman").height="250"
document.getElementById("compman").width="300"
}
</script>
</head>

<body>
<img id="compman" src="compman.gif" width="107" height="98" />
<br /><br />
<input type="button" onclick="changeSize()"
value="Change size of image">
</body>

</html>
TIY
更改图像的高度和宽度■◆513■设置或返回图像左侧和右侧的空白          简化命令：．图横空■．图横空■设置或返回图像左侧和右侧的空白。



定义和用法
hspace 属性可设置或返回图像的左边缘和右边缘的空白。
hspace 和 vspace 属性可与 align 一同使用，来设置图像与周围文本的距离。
语法
imageObject.hspace=pixels
实例
下面的例子将设置图像的 hspace 和 vspace 属性：
<html>
<head>
<script type="text/javascript">
function setSpace()
{
document.getElementById("compman").hspace="50"
document.getElementById("compman").vspace="50"
}
</script>
</head>
<body>

<img id="compman" src="compman.gif" alt="Computerman" align="right" />

<p>Some text. Some text. Some text. Some text.</p>

<input type="button" onclick="setSpace()"
value="Set hspace and vspace">

</body>
</html>
TIY
设置图像的水平和垂直定位■◆513■设置或返回图像的 id                     简化命令：．id■．id■设置或返回图像的 id。


定义和用法
id 属性可设置或返回图像的 id。
语法
imageObject.id=id
实例
下面的例子将通过两种方法来返回图像的 id：
<html>
<body>
<img id="compman" src="compman.gif" alt="Computerman" />
<br />

<script type="text/javascript">
x=document.getElementsByTagName('img')[0];
document.write("Image id: " + x.id);
document.write("<br />");
document.write("An alternate way: ");
document.write(document.getElementById('compman').id);
</script>

</body>
</html>
TIY
取得图像的 id■◆513■返回图像是否是服务器端的图像映射        简化命令：．映射■．映射■返回图像是否是服务器端的图像映射。



定义和用法
isMap 属性返回图像是否是服务器端图像映射。
语法
imageObject.isMap
实例
下面的例子可检测图像是否是服务器端图像映射：
<html>
<body>

<img id="planets" src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="The planet Venus"
href="venus.htm" />
</map>

<p>Is the image a server-side image map?
<script type="text/javascript">
x=document.getElementById('planets');
document.write(x.isMap);
</script>
</p>

</body>
</html>
TIY
检测图像是否是服务器端图像映射
■◆513■设置或返回指向包含图像描述的文档的URL   简化命令：．框URL说明■．框URL说明■设置或返回指向包含图像描述的文档的 URL。



定义和用法
longDesc　属性可设置或返回包含图像描述的文档的 URL。
该描述是对 "alt" 属性的补充，可对非可视的用户代理很有用。
语法
imageObject.longDesc=URL
实例
下面的例子将创建一个指向图像描述的链接：
<html>
<body>
<img id="compman" src="compman.gif"
longdesc="compman_description.htm" alt="Computerman" />
<br />

<script type="text/javascript">
var x=document.getElementById("compman");
document.write("Description for image: ");
document.write('<a href="' + x.longDesc + '">Description</a>');
</script>

</body>
</html>
TIY
创建一个较长的图像描述的链接■◆513■设置或返回指向图像的低分辨率版本的URL   简化命令：．低URL■．低URL■设置或返回指向图像的低分辨率版本的 URL。



定义和用法
lowsrc 属性可设置或返回图像的低分辨率版本的 URL。
语法
imageObject.lowsrc=URL
实例
下面的例子可创建一个指向图像的低分辨率版本的链接：
<html>
<body>
<img id="compman" src="compman.gif"
lowsrc="compman_lowres.gif" alt="Computerman" />
<br />

<script type="text/javascript">
var x=document.getElementById("compman");
document.write('<a href="' + x.lowsrc + '">Low resolution</a>');
</script>

</body>
</html>
TIY
创建一个指向图像的低分辨率版本的链接■◆513■设置或返回图像的名称                    简化命令：．名称■．名称■设置或返回图像的名称。



定义和用法
name 属性可设置或返回图像的名称。
如果一个 <img> 有一个 name 属性，就可以把相应的 Image 对象作为 Document 对象的命名属性来访问。
语法
imageObject.name=name
实例
下面的例子可返回图像的名称：
<html>
<body>
<img id="compman" name="compman" 
src="compman.gif" alt="Computerman" width="107" height="98" />
<br />

<script type="text/javascript">
document.write("Image name: ");
document.write(document.getElementById('compman').name);
</script>

</body>
</html>
TIY
取得图像的名称■◆513■设置或返回客户端图像映射的usemap属性的值简化命令：．用图■．用图■设置或返回客户端图像映射的 usemap 属性的值。



定义和用法
useMap 属性可设置或返回图像的 usemap 属性的值。
语法
imageObject.useMap=URL
实例
下面的例子可输出客户端图像映射的 usemap 属性的值：
<html>
<body>

<img id="planets" src="planets.gif" 
width="145" height="126" 
usemap="#planetmap" />

<map name="planetmap">
<area id="venus" shape="circle" 
coords="124,58,8" 
alt="The planet Venus"
href="venus.htm" />
</map>

<p>The value of the usemap attribute=
<script type="text/javascript">
x=document.getElementById('planets');
document.write(x.useMap);
</script>
</p>

</body>
</html>
TIY
返回客户端图像映射的 usemap 属性的值■◆513■设置或返回图像的顶部和底部的空白        简化命令：．图竖空■．图竖空■设置或返回图像的顶部和底部的空白。



定义和用法
vspace 属性设置或返回图像的顶部和底部的空白。
Thspace 和 vspace 属性可与 align 一同使用，来设置图像与周围文本的距离。
语法
imageObject.vspace=pixels
实例
下面的例子将设置图像的 hspace 和 vspace 属性：
<html>
<head>
<script type="text/javascript">
function setSpace()
{
document.getElementById("compman").hspace="50"
document.getElementById("compman").vspace="50"
}
</script>
</head>
<body>

<img id="compman" src="compman.gif" alt="Computerman" align="right" />

<p>Some text. Some text. Some text. Some text.</p>

<input type="button" onclick="setSpace()"
value="Set hspace and vspace">

</body>
</html>
TIY
设置图像的水平和垂直定位■◆513■设置或返回图像的宽度                    简化命令：．全宽■．全宽■设置或返回图像的宽度。



定义和用法
width 属性可设置或返回图像的宽度。
语法
imageObject.width=pixels
实例
下面的例子可设置图像的高度和宽度：
<html>
<head>
<script type="text/javascript">
function changeSize()
{
document.getElementById("compman").height="250"
document.getElementById("compman").width="300"
}
</script>
</head>

<body>
<img id="compman" src="compman.gif" width="107" height="98" />
<br /><br />
<input type="button" onclick="changeSize()"
value="Change size of image">
</body>

</html>
TIY
更改图像的高度和宽度■◆513■设置或返回图像的 URL                    简化命令：．框URL■．框URL■设置或返回图像的 URL。



定义和用法
src 属性可设置或返回图像的 URL。
注释：该属性可在任意时间被更改。不过新图像会继承原始图像的 height 和 width 属性。
该属性的初始值由标记 <img> 的 src 属性来设置。当把该属性设置为新图像的 URL 时，浏览器就会把那幅新图像装载并显示出来。这对于更新网页的图像外观以响应用户的动作非常有用。
语法
imageObject.src=URL
实例
<html>
<head>
<script type="text/javascript">
function changeSrc()
  {
  document.getElementById("myImage").src="hackanm.gif"
  }
</script>
</head>
<body>

<img id="myImage" src="compman.gif" width="107" height="98" />
<br /><br />
<input type="button" onclick="changeSrc()" value="Change image">

</body>
</html>
TIY
更改图像的 src■◆513■当用户放弃图像的装载时调用的  事件句柄！简化命令：．载断■．载断■当用户放弃图像的装载时调用的事件句柄。


定义和用法
当用户放弃图像的装载时调用的事件句柄。
语法
imageObject.onabort
说明
Image 对象的属性 onabort 声明了一个事件句柄函数，当用户在图像完成载入之前放弃图像的装载（如单击了 Stop 按钮）时，就会调用这个句柄。■◆513■在装载图像中发生错误时调用    事件句柄！简化命令：．出错■．出错■在装载图像的过程中发生错误时调用的事件句柄。


定义和用法
在装载图像的过程中发生错误时调用的事件句柄。
语法
imageObject.onerror
说明
Image 对象的属性 onerror 声明了一个事件句柄函数，当装载图像的过程中发生了错误时就会调用这个句柄。■◆513■当图像装载完毕时调用的        事件句柄！简化命令：．载入■．载入■当图像装载完毕时调用的事件句柄。



定义和用法
当图像装载完毕时调用的事件句柄。
语法
imageObject.onload
说明
Image 对象的属性 onload 声明了一个事件句柄函数，当图像装载完毕的时候就会调用这个句柄。■◆345■表单按钮■表单按钮■Button 对象
Button 对象代表 HTML 文档中的一个按钮。
该元素没有默认的行为，但是必须有一个 onclick 事件句柄以便使用。
在 HTML 文档中 <input type="button"> 标签每出现一次，一个 Button 对象 就会被创建。
您可以通过遍历表单的 elements[] 数组来访问某个按钮，或者通过使用 document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆532■设置或返回访问按钮的快捷键              简化命令：．快捷键■．快捷键■设置或返回访问按钮的快捷键。



定义和用法
accessKey 属性可设置或返回访问一个按钮的键盘按键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
buttonObject.accessKey=accessKey
实例
下面的例子可返回一个按钮的快捷键：
<html>
<body>

<form>
<input type="button" value="Click me!" 
accesskey="b" id="button1" />
</form>

<p>AccessKey for button is: 
<script type="text/javascript">
x=document.getElementById('button1');
document.write(x.accessKey);
</script></p>

</body>
</html>
TIY
返回一个按钮的快捷键

■◆532■设置或返回浏览器无法显示按钮时替代文本  简化命令：．备文■．备文■设置或返回当浏览器无法显示按钮时供显示的替代文本。


定义和用法
alt 属性可设置或返回当浏览器不支持按钮时要显示的替换文本。
语法
buttonObject.alt=alternate_text
实例
下面的例子可返回按钮的 alt 文本：
<html>
<body>

<form>
<input type="button" alt="Button" id="button1"
value="Click me" />
</form>

<p>The alt text for the button is:
<script type="text/javascript">
x=document.getElementById('button1');
document.write(x.alt);
</script></p>

</body>
</html>
TIY
返回按钮的替换文本■◆532■设置或返回是否按钮禁用                  简化命令：．禁用■．禁用■设置或返回是否禁用按钮。



定义和用法
disabled 属性可设置或返回是否禁用按钮。
语法
buttonObject.disabled=true|false
实例
下面的例子将禁用按钮：
<html>
<head>
<script type="text/javascript">
function disableButton()
{
document.getElementById("myButton").disabled=true
}
</script>
</head>

<body>
<form>
<button id="myButton" onClick="disableButton()">
Click Me!</button>
</form>
</body>

</html>
TIY
提示按钮的 id 和 类型 + 禁用按钮■◆532■返回对包含该按钮的表单对象的引用        简化命令：．表单■．表单■返回对包含该按钮的表单对象的引用。



定义和用法
form 属性可返回对包含该按钮的表单的引用。
如果包含该按钮，则返回一个 form 对象，如果未包含该按钮，则返回 null。
语法
buttonObject.form
实例
下面的例子可返回包含按钮的表单的 id：
<html>
<body>

<form id="form1">
<input type="button" value="Click me!" id="button1" />
</form>

<p>The id of the form containing the button is: 
<script type="text/javascript">
x=document.getElementById('button1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
返回包含按钮的表单的 id■◆532■设置或返回按钮的 id                     简化命令：．id■．id■设置或返回按钮的 id。




定义和用法
id 属性可设置或返回按钮的 id。
语法
buttonObject.id=id
实例
下面的例子可获取按钮的 id：
<html>
<head>
<script type="text/javascript">
function alertId()
{
alert(document.getElementById("myButton").id)
}
</script>
</head>

<body>
<form>
<input type="button" value="Click me!" id="myButton"
onclick="alertId()" />
</form>
</body>

</html>
TIY
提示按钮的 id、类型和值 + 禁用按钮■◆532■设置或返回按钮的名称                    简化命令：．名称★■．名称■设置或返回按钮的名称。



定义和用法
name 属性可设置或返回按钮的名称。
语法
buttonObject.name=name
实例
下面的例子可返回按钮的名称：
<html>
<body>

<form>
<input type="button" id="button1"
name="button1" value="Click Me!" />
</form>

<p>The name of the button is: 
<script type="text/javascript">
x=document.getElementById('button1');
document.write(x.name);
</script></p>

</body>
</html>
TIY
返回按钮的名称■◆532■设置或返回按钮的 tab 键控制次序         简化命令：．tab次序■．tab次序■设置或返回按钮的 tab 键控制次序。



定义和用法
tabIndex 属性可设置或返回按钮的 tab 键控制次序。
语法
buttonObject.tabIndex=tabIndex
实例
下面的例子将返回按钮的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function showTabIndex()
  {
  var b1=document.getElementById('b1').tabIndex;
  var b2=document.getElementById('b2').tabIndex;
  var b3=document.getElementById('b3').tabIndex;
  document.write("Tab index of Button 1: " + b1);
  document.write("<br />");
  document.write("Tab index of Button 2: " + b2);
  document.write("<br />");
  document.write("Tab index of Button 3: " + b3);
  }
</script>
</head>
<body>

<form>
<input type="button" id="b1" tabIndex="1" value="Button 1" />
<br />
<input type="button" id="b2" tabIndex="2" value="Button 2" />
<br />
<input type="button" id="b3" tabIndex="3" value="Button 3" />
<br />
<input type="button" onclick="showTabIndex()"
value="Show tabIndex" />
</form>

</body>
</html>
TIY
显示按钮的 tab 控制次序■◆532■返回按钮的表单元素类型                  简化命令：．类型■．类型■返回按钮的表单元素类型。



定义和用法
type 属性可返回表单元素的类型。Button 对象的类型始终是 "button"。
语法
buttonObject.type
实例
下面的例子将返回按钮的表单元素类型：
<html>
<head>
<script type="text/javascript">
function alertType()
{
alert(document.getElementById("myButton").type)
}
</script>
</head>

<body>
<form>
<input type="button" value="Click me!" id="myButton"
onclick="alertType()" />
</form>
</body>

</html>
TIY
提示按钮的 id、类型和值 + 禁用按钮■◆532■设置或返回在按钮上显示的文本            简化命令：．值■．值■设置或返回在按钮上显示的文本。



定义和用法
value 属性可设置或返回显示在按钮上的文本。
语法
buttonObject.value=sometext
实例
<html>
<head>
<script type="text/javascript">
function alertValue()
{
alert(document.getElementById("myButton").value)
}
</script>
</head>

<body>
<form>
<input type="button" value="Click me!" id="myButton"
onclick="alertValue()" />
</form>
</body>

</html>
TIY
提示按钮的 id、类型和值 + 禁用按钮■◆532■把焦点从元素上移开()                    简化命令：．移焦■．移焦■把焦点从元素上移开。



定义和用法
blur() 方法用于把焦点从按钮上移开。
语法
buttonObject.blur()
实例
下面的例子讲吧焦点从按钮上移开：
<html>
<head>
<script type="text/javascript">
function removeFocus()
  {
  document.getElementById('button1').blur()
  }
</script>
</head>
<body>

<form>
<input type="button" id="button1" value="Button1" />
<br />
<input type="button" onclick="removeFocus()"
value="Remove focus from Button 1" />
</form>

</body>
</html>
TIY
设置并从按钮上移开焦点■◆532■在某个按钮上模拟一次鼠标单击()          简化命令：．单击■．单击■在某个按钮上模拟一次鼠标单击。



定义和用法
click() 方法可模拟在按钮上的一次鼠标单击。
语法
buttonObject.click()
实例
下面的例子将在 body onload 上模拟在按钮上的一次鼠标单击：
<html>
<head>
<script type="text/javascript">
function clickButton()
  {
  document.getElementById('button1').click()
  }
function alertMsg()
  {
  alert("Button 1 was clicked!")
  }
</script>
</head>
<body onload="clickButton()">

<form>
<input type="button" id="button1" onclick="alertMsg()"
value="Button 1" />
</form>

</body>
</html>
TIY
模拟在按钮上的一次鼠标单击■◆532■为某个按钮赋予焦点()                    简化命令：．给焦■．给焦■为某个按钮赋予焦点。




定义和用法
focus() 方法用于向按钮赋予焦点。
语法
buttonObject.focus()
实例
下面的例子将在按钮上设置焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('button1').focus()
  }
</script>
</head>
<body>

<form>
<input type="button" id="button1" value="Button1" />
<br />
<input type="button" onclick="setFocus()"
value="Set focus to Button 1" />
</form>

</body>
</html>
TIY
设置并从按钮上移开焦点■◆345■选择框■选择框■Checkbox 对象
Checkbox 对象代表一个 HTML 表单中的 一个选择框。
在 HTML 文档中 <input type="checkbox"> 每出现一次，Checkbox 对象就会被创建。
您可以通过遍历表单的 elements[] 数组来访问某个选择框，或者通过使用 document.getElementById() 。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆545■设置或返回访问 checkbox 的快捷键        简化命令：．快捷键■．快捷键■设置或返回访问 checkbox 的快捷键。



定义和用法
accessKey 属性设置或返回 checkbox 的快捷键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
checkboxObject.accessKey=accessKey
实例
下面的例子返回了 checkbox 的快捷键：
<html>
<body>

<form>
<input type="checkbox" accesskey="c" id="check1" />
</from>

<p>AccessKey for checkbox is: 
<script type="text/javascript">
x=document.getElementById('check1');
document.write(x.accessKey);
</script></p>

</body>
</html>
TIY
返回 checkbox 的快捷键■◆545■设置或返回不支持checkbox时替代文本      简化命令：．备文■．备文■设置或返回不支持 checkbox 时显示的替代文本。



定义和用法
alt 属性可设置或返回浏览器不支持 checkbox 时显示的替代文本。
语法
checkboxObject.alt=alternate_text
实例
下面的例子返回了 checkbox 的替代文本：
<html>
<body>

<form>
I have a bike: <input id="bike" alt="bike" type="checkbox" name="Bike" />
<br />
I have a car: <input id="car" alt="car" type="checkbox" name="Car" />
</form>

<p>The alt text for the checkboxes are:
<script type="text/javascript">
document.write(document.getElementById('bike').alt);
document.write(" and ");
document.write(document.getElementById('car').alt);
</script></p>

</body>
</html>
TIY
返回 checkbox 的 alt 文本■◆545■设置或返回 checkbox 是否应被选中        简化命令：．被选中■．被选中■设置或返回 checkbox 是否应被选中。



定义和用法
checked 属性设置或返回 checkbox 是否应被选中。
语法
checkboxObject.checked=true|false
说明
该属性保存了 checkbox 的当前状态，不管何时，这个值发生变化的时候，onclick 事件句柄就会触发（也可能触发 onchange 事件句柄）。
实例
下面的例子可设置该 checkbox 的状态：
<html>
<head>
<script type="text/javascript">
function check()
  {
  document.getElementById("check1").checked=true
  }
function uncheck()
  {
  document.getElementById("check1").checked=false
  }
</script>
</head>
<body>

<form>
<input type="checkbox" id="check1" />
<input type="button" onclick="check()" value="Check Checkbox" />
<input type="button" onclick="uncheck()" value="Uncheck Checkbox" />
</form>

</body>
</html>
TIY
选定以及不选定 checkbox
一个表单中的若干个 checkbox
Checkbox - 把文本转换为大写■◆545■返回 checked 属性的默认值               简化命令：．默认被选中■．默认被选中■返回 checked 属性的默认值。



定义和用法
defaultChecked 属性可返回 checked 属性的默认值。
该属性在 checkbox 默认被选定时返回 true，否则返回 false。
语法
checkboxObject.defaultChecked
实例
下面的例子可返回 checked 属性的值：
<html>
<body>

<form>
<input type="checkbox" id="myCheck" checked="checked" />
</form>

<script type="text/javascript">
alert(document.getElementById("myCheck").defaultChecked)
</script>

</body>
</html>
TIY
返回 checkbox 是否默认被选中
选定以及不选定 checkbox■◆545■设置或返回 checkbox 是否应被禁用        简化命令：．禁用■．禁用■设置或返回 checkbox 是否应被禁用。



定义和用法
disabled 属性可设置或返回是否禁用 checkbox。
语法
checkboxObject.disabled=true|false
实例
下面的例子禁用了该 checkbox：
<html>
<head>
<script type="text/javascript">
function disable()
  {
  document.getElementById("check1").disabled=true
  }
</script>
</head>
<body>

<form>
<input type="checkbox" id="check1" />
<input type="button" onclick="disable()" value="Disable Checkbox" />
</form>

</body>
</html>
TIY
禁用 checkbox■◆545■返回对包含 checkbox 的表单的引用        简化命令：．表单■．表单■返回对包含 checkbox 的表单的引用。



定义和用法
form 属性返回对包含该元素的表单对象的引用。
语法
checkboxObject.form
实例
下面的例子返回了该 checkbox 所属的表单的 id：
<html>
<body>

<form id="form1">
<input type="checkbox" id="check1" />
</form>

<p>The form containing the checkbox is: 
<script type="text/javascript">
x=document.getElementById('check1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
取得 checkbox 所属的表单的 id■◆545■设置或返回 checkbox 的 id               简化命令：．id■．id■设置或返回 checkbox 的 id。



定义和用法
id 属性可设置或返回 checkbox 的 id。
语法
checkboxObject.id=id
实例
下面的例子可输出 checkbox 的 id：
<html>
<body>

<form>
<input type="checkbox" id="check1" />
</form>

<p>The id of the checkbox is:
<script type="text/javascript">
document.write(document.getElementById("check1").id)
</script>
</p>

</body>
</html>
TIY
取得 checkbox 的 id■◆545■设置或返回 checkbox 的名称              简化命令：．名称■．名称■设置或返回 checkbox 的名称。



定义和用法
name 属性可设置或返回 checkbox 的名称。
语法
checkboxObject.name=name
实例
下面的例子可输出 checkbox 的名称：
<html>
<body>

<form>
<input type="checkbox" id="check1" name="check1" />
</form>

<p>The name of the checkbox is:
<script type="text/javascript">
document.write(document.getElementById("check1").name)
</script>
</p>

</body>
</html>
TIY
取得 checkbox 的名称■◆545■设置或返回checkbox 的tab键控制次序      简化命令：．tab次序■．tab次序■设置或返回 checkbox 的 tab 键控制次序。



定义和用法
tabIndex 属性可设置或返回 checkbox 的 tab 键控制次序。
语法
checkboxObject.tabIndex=number
实例
下面的例子可更改 checkbox 的 tab index：
<html>
<head>
<script type="text/javascript">
function changeTabIndex()
{
document.getElementById('check3').tabIndex="1"
document.getElementById('check1').tabIndex="3"
}
</script>
</head>
<body>

<form>
<input type="checkbox" id="check1" tabIndex="1" /><br />
<input type="checkbox" id="check2" tabIndex="2" /><br />
<input type="checkbox" id="check3" tabIndex="3" /><br />

<input type="button" onclick="changeTabIndex()" value="Change tabIndex" />
</form>

</body>
</html>
TIY
更改 checkbox 的 tab 键次序■◆545■返回 checkbox 的表单元素类型            简化命令：．类型■．类型■返回 checkbox 的表单元素类型。



定义和用法
type 属性可返回元素的表单类型。对于一个 checkbox 对象，该属性总是返回 "checkbox"。
语法
checkboxObject.type
实例
下面的例子返回了 checkbox 的表单元素类型：
<html>
<body>

<form>
<input type="checkbox" id="check1" />
</form>

<script type="text/javascript">
x=document.getElementById("check1");
document.write("Form element type is: ");
document.write(x.type);
</script>

</body>
</html>
TIY
获得 checkbox 的表单元素类型■◆545■设置或返回 checkbox 的 value 属性的值   简化命令：．值■．值■设置或返回 checkbox 的 value 属性的值



■◆545■从 checkbox 上移开焦点()                简化命令：．移焦■．移焦■从 checkbox 上移开焦点。



定义和用法
blur() 方法用于从 checkbox 上移开焦点。
语法
checkboxObject.blur()
实例
下面的例子可设置并移开 checkbox 上的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('check1').focus()
  }
function loseFocus()
  {
  document.getElementById('check1').blur()
  }
</script>
</head>
<body>

<form>
<input type="checkbox" id="check1" />
<br />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />
</form>

</body>
</html>
TIY
设置并移开 checkbox 上的焦点■◆545■模拟在 checkbox 中的一次鼠标点击()      简化命令：．单击■．单击■模拟在 checkbox 中的一次鼠标点击。



定义和用法
click() 方法用于在 checkbox 上模拟一次鼠标单击。
语法
checkboxObject.click()
实例
下面的例子可在 checkbox 上模拟一次鼠标点击：
<html>
<head>
<script type="text/javascript">
function clickCheckbox()
  {
  document.getElementById('check1').click()
  }
</script>
</head>
<body>

<form>
<input type="checkbox" id="check1" />
<br />
<input type="button" onclick="clickCheckbox()" value="Click checkbox" />
</form>

</body>
</html>
TIY
在 checkbox 上模拟一次鼠标点击■◆545■为 checkbox 赋予焦点()                  简化命令：．给焦■．给焦■为 checkbox 赋予焦点。



定义和用法
focus() 方法用于为 checkbox 赋予焦点。
语法
checkboxObject.focus()
实例
下面的例子设置或移开 checkbox 上的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('check1').focus()
  }
function loseFocus()
  {
  document.getElementById('check1').blur()
  }
</script>
</head>
<body>

<form>
<input type="checkbox" id="check1" />
<br />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />
</form>

</body>
</html>
TIY
设置并移开 checkbox 上的焦点■◆345■文件操作■文件操作■FileUpload 对象
在 HTML 文档中 <input type="file"> 标签每出现一次，一个 FileUpload 对象就会被创建。
该元素包含一个文本输入字段，用来输入文件名，还有一个按钮，用来打开文件选择对话框以便图形化选择文件。
该元素的 value 属性保存了用户指定的文件的名称，但是当包含一个 file-upload 元素的表单被提交的时候，浏览器会向服务器发送选中的文件的内容而不仅仅是发送文件名。
为安全起见，file-upload 元素不允许 HTML 作者或 JavaScript 程序员指定一个默认的文件名。HTML value 属性被忽略，并且对于此类元素来说，value 属性是只读的，这意味着只有用户可以输入一个文件名。当用户选择或编辑一个文件名，file-upload 元素触发 onchange 事件句柄。
您可以通过遍历表单的 elements[] 数组，或者通过使用 document.getElementById()来访问 FileUpload 对象。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆560■设置或返回文件传输MIME类型的列表        简化命令：．类型列表■．类型列表■设置或返回指示文件传输的 MIME 类型的列表（逗号分隔）。■◆560■设置或返回访问FileUpload对象快捷键      简化命令：．快捷键■．快捷键■设置或返回访问 FileUpload 对象的快捷键。■◆560■设置或返回不支持时替代文字              简化命令：．备文■．备文■设置或返回不支持 <input type="file"> 时显示的替代文字。■◆560■设置或返回FileUpload对象的初始值        简化命令：．初始值■．初始值■设置或返回 FileUpload 对象的初始值。■◆560■设置或返回是否禁用FileUpload对象        简化命令：．禁用■．禁用■设置或返回是否禁用 FileUpload 对象。■◆560■返回对包含FileUpload对象表单引用        简化命令：．表单■．表单■返回对包含 FileUpload 对象的表单的引用。■◆560■设置或返回 FileUpload 对象的 id         简化命令：．id■．id■设置或返回 FileUpload 对象的 id。■◆560■设置或返回 FileUpload 对象的名称        简化命令：．名称■．名称■设置或返回 FileUpload 对象的名称。■◆560■设置或返回对象tab键控制次序的索引号     简化命令：．tab次序■．tab次序■设置或返回定义 FileUpload 对象的 tab 键控制次序的索引号。■◆560■返回表单元素的类型                      简化命令：．类型■．类型■返回表单元素的类型。对于 FileUpload ，则是"file" 。■◆560■返回由用户输入设置的文本后文件名        简化命令：．值■．值■返回由用户输入设置的文本后，FileUpload 对象的文件名。■◆560■从FileUpload对象上移开焦点()            简化命令：．移焦■．移焦■从 FileUpload 对象上移开焦点。■◆560■为 FileUpload 对象赋予焦点()            简化命令：．给焦■．给焦■为 FileUpload 对象赋予焦点。■◆560■选取 FileUpload 对象()                  简化命令：．选取■．选取■选取 FileUpload 对象。■◆345■隐藏输入域■隐藏输入域■Hidden 对象
Hidden 对象代表一个 HTML 表单中的某个隐藏输入域。
这种类型的输入元素实际上是隐藏的。这个不可见的表单元素的 value 属性保存了一个要提交给 Web 服务器的任意字符串。如果想要提交并非用户直接输入的数据的话，就是用这种类型的元素。
在 HTML 表单中 <input type="hidden"> 标签每出现一次，一个 Hidden 对象就会被创建。
您可通过遍历表单的 elements[] 数组来访问某个隐藏输入域，或者通过使用document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆575■设置或返回不支持隐藏输入域时显示文本    简化命令：．备文■．备文■设置或返回当不支持隐藏输入域时显示的替代文本。



定义和用法
alt 属性可设置或返回浏览器不支持隐藏域时显示的文本。
语法
hiddenObject.alt=alternate_text
实例
下面的例子返回了隐藏输入域的 alt 文本：
<html>
<body>

<form>
<input type="hidden" alt="Hidden field" id="hidden1" />
</form>

<p>The alt text for the hidden field is:
<script type="text/javascript">
x=document.getElementById('hidden1');
document.write(x.alt);
</script></p>

</body>
</html>
TIY
返回隐藏域的 alt 文本■◆575■返回一个对包含隐藏域的表单的引用        简化命令：．表单■．表单■返回一个对包含隐藏域的表单的引用。



定义和用法
form 属性可返回对包含隐藏输入域的表单对象的引用。
语法
hiddenObject.form
实例
下面的例子返回了该隐藏输入域所属的表单的 id：
<html>
<body>

<form id="form1">
<input type="hidden" id="hidden1" />
</form>

<p>The id of the form containing the hidden element is: 
<script type="text/javascript">
x=document.getElementById('hidden1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
取得隐藏输入域所属的表单的 id■◆575■设置或返回隐藏域的 id                   简化命令：．id■．id■设置或返回隐藏域的 id。



定义和用法
id 属性可设置或返回隐藏输入域的 id。
语法
hiddenObject.id=id
实例
下面的例子可取得隐藏输入域的 id：
<html>
<body>

<form>
<input type="hidden" id="hidden1" />
</form>

<p>The id of the hidden field is: 
<script type="text/javascript">
x=document.getElementById('hidden1');
document.write(x.id);
</script></p>

</body>
</html>
TIY
取得隐藏输入域的 id■◆575■设置或返回隐藏域的名称                  简化命令：．名称■．名称■设置或返回隐藏域的名称。



定义和用法
name 属性可设置或返回隐藏输入域的名称。
语法
hiddenObject.name=name
实例
下面的例子可返回隐藏输入域的名称：
<html>
<body>

<form>
<input type="hidden" id="hidden1" name="hidden1" />
</form>

<p>The name of the hidden field is:
<script type="text/javascript">
alert(document.getElementById("hidden1").name)
</script></p>

</body>
</html>
TIY
取得隐藏输入域的名称■◆575■返回隐藏输入域的表单类型                简化命令：．类型■．类型■返回隐藏输入域的表单类型。




定义和用法
type 属性可返回表单元素的类型。对于 hidden 对象，该属性总是 "hidden"。
语法
hiddenObject.type
实例
下面的例子返回了该隐藏域的表单元素类型：
<html>
<body>

<form>
<input type="hidden" id="hidden1" />
</form>

<script type="text/javascript">
x=document.getElementById("hidden1");
document.write("Form element type is: ");
document.write(x.type);
</script>

</body>
</html>
TIY
取得隐藏域的表单元素类型■◆575■设置或返回隐藏域的value属性的值         简化命令：．值■．值■设置或返回隐藏域的 value 属性的值。



定义和用法
value 属性可设置或返回隐藏输入域的 value 属性的值。
value 属性定义了该隐藏域的默认值。
语法
hiddenObject.value
实例
下面的例子可取得该隐藏域的值：
<html>
<head>
<script type="text/javascript">
function alertValue()
  {
  alert(document.getElementById("hidden1").value)
  }
</script>
</head>
<body>

<form>
<input type="hidden" id="hidden1" value="W3School" />
<input type="button" id="button1" onclick="alertValue()" 
value="Show value of the hidden field" />
</form>

</body>
</html>
TIY
取得隐藏域的值■◆345■密码■密码■Password 对象
Password 对象代表 HTML 表单中的密码字段。
HTML 的 <input type="password"> 标签在表单上每出现一次，一个 Password 对象就会被创建。
该文本输入字段供用户输入某些敏感的数据，比如密码等。当用户输入的时候，他的输入是被掩盖的（例如使用星号*），以防止旁边的人从他背后看到输入的内容。不过需要注意的是，当表单提交时，输入是用明文发送的。
与类型为 "text" 的元素类似，当用户改变显示值时，它会触发 onchange 事件句柄。
您可以通过遍历表单的 elements[] array 来访问密码字段，或者通过使用 document.getElementById() 。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆582■设置或返回访问密码字段的快捷键          简化命令：．快捷键■．快捷键■设置或返回访问密码字段的快捷键。



定义和用法
accessKey 属性可设置或返回访问密码域的快捷键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
passwordObject.accessKey=accessKey
实例
下面的例子返回密码域的快捷键：
<html>
<body>

<form>
<input type="password" accesskey="p" id="password1" />
</form>

<p>AccessKey for password field is: 
<script type="text/javascript">
x=document.getElementById('password1');
document.write(x.accessKey);
</script></p>

</body>
</html>
TIY
返回访问密码域的快捷键■◆582■设置或返回当不支持密码字段时显示的文字  简化命令：．备文■．备文■设置或返回当不支持密码字段时显示的替代文字。


定义和用法
alt 属性设置或返回在浏览器不支持密码域时显示的替代文本。
语法
passwordObject.alt=alternate_text
实例
下面的例子可返回密码域的替代文本：
<html>
<body>

<form>
<input type="password" alt="Password field" id="pwd1" />
</form>

<p>The alt text for the password field is:
<script type="text/javascript">
x=document.getElementById('pwd1');
document.write(x.alt);
</script></p>

</body>
</html>
TIY
返回密码域的 alt 文本■◆582■设置或返回密码字段的默认值              简化命令：．初始值■．初始值■设置或返回密码字段的默认值。




定义和用法
defaultValue 属性可设置或返回密码域的默认值。
注释：该默认值是在 HTML "value" 属性中规定的默认值。
语法
passwordObject.defaultValue=somevalue
实例
下面的例子可获得密码域的默认值：
<html>
<head>
<script type="text/javascript">
function alertValue()
  {
  alert(document.getElementById("password1").defaultValue)
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" value="thgrt456" />
<input type="button" id="button1" onclick="alertValue()" 
value="Show default value" />
</form>

</body>
</html>
TIY
获得密码域的默认值■◆582■设置或返回是否应被禁用密码字段          简化命令：．禁用■．禁用■设置或返回是否应被禁用密码字段。


定义和用法
disabled 属性可设置或返回是否禁用密码域。
语法
passwordObject.disabled=true|false
实例
下面的例子仅用了该密码域：
<html>
<head>
<script type="text/javascript">
function disablePassword()
  {
  document.getElementById("password1").disabled=true
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" />
<input type="button" id="button1" onClick="disablePassword()" 
value="Disable password field" />
</form>

</body>
</html>
TIY
禁用一个密码域■◆582■返回对包含此密码字段的表单的引用        简化命令：．表单■．表单■返回对包含此密码字段的表单的引用。




定义和用法
form 属性可返回对包含该密码域的表单的引用。
若成功，该属性将返回一个表单对象。
语法
passwordObject.form
实例
下面的例子取得了该密码域所属的表单的 id：
<html>
<body>

<form id="form1">
<input type="password" id="password1" />
</form>

<p>The id of the form containing the password field is:
<script type="text/javascript">
x=document.getElementById('password1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
取得密码域所属的表单的 id■◆582■设置或返回密码字段的 id                 简化命令：．id■．id■设置或返回密码字段的 id。



定义和用法
id 属性设置或返回密码域的 id。
语法
passwordObject.id=id
实例
下面的例子返回了该密码域的 id：
<html>
<body>

<form id="form1">
<input type="password" id="password1" />
</form>

<p>The id of the password field is:
<script type="text/javascript">
x=document.getElementById('password1');
document.write(x.id);
</script></p>

</body>
</html>
TIY
取得密码域的 id■◆582■设置或返回密码字段中字符的最大数目      简化命令：．最长■．最长■设置或返回密码字段中字符的最大数目。



定义和用法
maxLength 属性可设置或返回密码域中所允许的最大字符数。
语法
passwordObject.maxLength=number_of_chars
实例
下面的例子可显示指定的密码域中所允许的最大字符数：
<html>
<head>
<script type="text/javascript">
function alertLength()
  {
  alert(document.getElementById("password1").maxLength)
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" maxLength="8" />
<input type="button" id="button1" onclick="alertLength()"
value="Alert maxLength" />
</form>

</body>
</html>
TIY
获得密码域中所允许的最大字符数■◆582■设置或返回密码字段的名称                简化命令：．名称■．名称■设置或返回密码字段的名称。



定义和用法
name 属性可设置或返回密码域的名称。
语法
passwordObject.name=name
实例
下面的例子可获得密码域的名称：
<html>
<body>

<form id="form1">
<input type="password" id="password1" name="password1" />
</form>

<p>The name of the password field is:
<script type="text/javascript">
x=document.getElementById('password1');
document.write(x.name);
</script></p>

</body>
</html>
TIY
获得密码域的名称■◆582■设置或返回密码字段是否应当是只读的      简化命令：．只读■．只读■设置或返回密码字段是否应当是只读的。



定义和用法
readOnly 属性可设置或返回密码域是否为只读。
语法
passwordObject.readOnly=true|false
实例
下面的例子把密码域设置为只读：
<html>
<head>
<script type="text/javascript">
function makeReadOnly()
  {
  document.getElementById("password1").readOnly=true
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" value="thgrt456" />
<input type="button" onclick="makeReadOnly()" 
value="Make read-only" />
</form>

</body>
</html>
TIY
把密码域设置为只读■◆582■设置或返回密码字段的长度                简化命令：．尺寸■．尺寸■设置或返回密码字段的长度。


定义和用法
size 属性可设置或返回密码域的大小（以字符数计）。
语法
passwordObject.size=number_of_chars
实例
下面的例子更改了密码域的大小：
<html>
<head>
<script type="text/javascript">
function changeSize()
  {
  document.getElementById("password1").size=40
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" />
<input type="button" id="button1" onclick="changeSize()"
value="Change size of the password field" />
</form>

</body>
</html>
TIY
更改密码域的尺寸■◆582■设置或返回密码字段的tab键控制次序       简化命令：．tab次序■．tab次序■设置或返回密码字段的 tab 键控制次序。



定义和用法
tabIndex 属性设置或返回密码域的 tab 键控制次序。
语法
passwordObject.tabIndex=number
实例
下面的例子可显示表单元素的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function showTabIndex()
  {
  var email=document.getElementById('email').tabIndex;
  var pwd=document.getElementById('pwd').tabIndex;
  document.write("Tab index of email field: " + email);
  document.write("<br />");
  document.write("Tab index of password field: " + pwd);
  }
</script>
</head>
<body>

<form>
Email: <input type="text" id="email" tabindex="1" />
<br />
Password: <input type="password" id="pwd" tabindex="2" />
<br />
<input type="button" onclick="showTabIndex()" value="Show tabIndex" />
</form>

</body>
</html>
TIY
显示表单元素的 tab 键控制次序■◆582■返回密码字段的表单元素类型              简化命令：．类型■．类型■返回密码字段的表单元素类型。



定义和用法
type 属性可设置表单元素的类型。对于密码域，该属性总是 "password"。
语法
passwordObject.type
实例
下面的例子返回了该密码域的表单元素类型：
<html>
<body>

<form>
<input type="password" id="password1" />
</form>

<script type="text/javascript">
x=document.getElementById("password1");
document.write("Form element type is: ");
document.write(x.type);
</script>

</body>
</html>
TIY
取得密码域的表单元素类型■◆582■设置或返回密码字段的value属性的值       简化命令：．值■．值■设置或返回密码字段的 value 属性的值。


定义和用法
value 属性可设置或返回密码域的默认值。
出于安全考虑，一些浏览器可能阻止 JavaScript 代码读取 value 属性。
语法
passwordObject.value=text
实例
下面的例子可获得密码域的默认值：
<html>
<head>
<script type="text/javascript">
function alertValue()
  {
  alert(document.getElementById("password1").value)
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" value="thgrt456" />
<input type="button" id="button1" onclick="alertValue()" 
value="Show default value" />
</form>

</body>
</html>
TIY
获得密码域的默认值■◆582■从密码字段移开焦点()                    简化命令：．移焦■．移焦■从密码字段移开焦点。



定义和用法
blur() 方法用于从密码域移开焦点。
语法
passwordObject.blur()
实例
下面的例子可设置或返回密码域的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('password1').focus()
  }
function loseFocus()
  {
  document.getElementById('password1').blur()
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" value="thgrt456" />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />
</form>

</body>
</html>
TIY
设置或返回密码域的焦点■◆582■为密码字段赋予焦点()                    简化命令：．给焦■．给焦■为密码字段赋予焦点。



定义和用法
focus() 方法用于在密码域上设置焦点。
语法
passwordObject.focus()
实例
下面的例子可设置或移开密码域上的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('password1').focus()
  }
function loseFocus()
  {
  document.getElementById('password1').blur()
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" value="thgrt456" />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />
</form>

</body>
</html>
TIY
设置或移开密码域上的焦点■◆582■选取密码字段中的文本()                  简化命令：．选取■．选取■选取密码字段中的文本。


定义和用法
select() 方法用于选取密码域中的文本。
语法
passwordObject.select()
实例
下面的例子可选取密码域中的文本：
<html>
<head>
<script type="text/javascript">
function selText()
  {
  document.getElementById('password1').select()
  }
</script>
</head>
<body>

<form>
<input type="password" id="password1" value="thgrt456" />
<input type="button" onclick="selText()" value="Select text" />
</form>

</body>
</html>
TIY
选取密码域中的文本■◆345■单选框■单选框■Radio 对象
Radio 对象代表 HTML 表单中的单选按钮。
在 HTML 表单中 <input type="radio"> 每出现一次，一个 Radio 对象就会被创建。
单选按钮是表示一组互斥选项按钮中的一个。当一个按钮被选中，之前选中的按钮就变为非选中的。
当单选按钮被选中或不选中时，该按钮就会触发 onclick 事件句柄。
您可通过遍历表单的 elements[] 数组来访问 Radio 对象，或者通过使用 document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆599■设置或返回访问单选按钮的快捷键          简化命令：．快捷键■．快捷键■设置或返回访问单选按钮的快捷键。



定义和用法
accessKey 属性可设置或返回访问单选按钮的快捷键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
radioObject.accessKey=accesskey
实例
下面的例子可返回单选按钮的快捷键：
<html>
<body>

<form>
Male: <input id="male" accesskey="m" type="radio"
name="Sex" value="Male" />
<br />
Female: <input id="female" accesskey="f" type="radio"
name="Sex" value="Female" />
</form>

<p>The access key for the radio buttons are:
<script type="text/javascript">
document.write(document.getElementById('male').accessKey);
document.write(" and ");
document.write(document.getElementById('female').accessKey);
</script></p>

</body>
</html>
TIY
返回单选按钮的快捷键■◆599■设置或返回不支持单选按钮时的替代文本    简化命令：．备文■．备文■设置或返回在不支持单选按钮时显示的替代文本。



定义和用法
alt 属性可设置或返回在浏览器不支持单选按钮时显示的替代文本。
语法
radioObject.alt=alternate_text
实例
下面的例子可返回单选按钮的 alt 文本：
<html>
<body>

<form>
Male: <input id="male" alt="male" type="radio"
name="Sex" value="Male" />
<br />
Female: <input id="female" alt="female" type="radio"
name="Sex" value="Female" />
</form>

<p>The alt text for the radio buttons are:
<script type="text/javascript">
document.write(document.getElementById('male').alt);
document.write(" and ");
document.write(document.getElementById('female').alt);
</script></p>

</body>
</html>
TIY
返回单选按钮的 alt 文本■◆599■设置或返回单选按钮的状态                简化命令：．被选中■．被选中■设置或返回单选按钮的状态。



定义和用法
checked 属性可设置或返回某个单选按钮是否被选中。
语法
radioObject.checked=true|false
实例
下面的例子可对一个单选按钮进行选定和不选定：
<html>
<head>
<script type="text/javascript">
function check()
  {
  document.getElementById("radio1").checked=true
  }
function uncheck()
  {
  document.getElementById("radio1").checked=false
  }
</script>
</head>
<body>

<form>
<input type="radio" id="radio1" />
<input type="button" onclick="check()" value="Check" />
<input type="button" onclick="uncheck()" value="Uncheck" />
</form>

</body>
</html>
TIY
选定及不选定单选按钮■◆599■返回单选按钮的默认状态                  简化命令：．默认被选中■．默认被选中■返回单选按钮的默认状态。



定义和用法
defaultChecked 属性可返回 checked 属性的默认值。
如果单选按钮的默认状态是选中，则返回 true，否则返回 fasle。
语法
radioObject.defaultChecked
实例
下面的例子返回了 checked 属性的默认值：
<html>
<body>

<form>
<input type="radio" id="radio1" checked="checked" />
</form>

<script type="text/javascript">
alert(document.getElementById("radio1").defaultChecked);
</script>

</body>
</html>
TIY
返回单选按钮的默认状态■◆599■设置或返回是否禁用单选按钮              简化命令：．禁用■．禁用■设置或返回是否禁用单选按钮。



定义和用法
disabled 属性可设置或返回是否禁用单选按钮。
语法
radioObject.disabled=true|false
实例
下面的例子禁用了该单选按钮：
<html>
<head>
<script type="text/javascript">
function disable()
  {
  document.getElementById("gnome").disabled=true
  }
</script>
</head>
<body>

<form>
Human: <input id="human" type="radio" name="creature" value="Human" />
<br />
Animal: <input id="animal" type="radio" name="creature" value="Animal" />
<br />
Gnome: <input id="gnome" type="radio" name="creature" value="Gnome" />
<br /><br />
<input type="button" onclick="disable()" value="Disable choice" />
</form>

</body>
</html>
TIY
禁用某个单选按钮■◆599■返回一个对包含此单选按钮的表单的引用    简化命令：．表单■．表单■返回一个对包含此单选按钮的表单的引用。




定义和用法
form 属性可返回对包含该按钮的表单的引用。
若成功，该属性返回一个表单对象。
语法
radioObject.form
实例
下面的例子将返回该单选按钮所属的表单的 id：
<html>
<body>

<form id="form1">
<input type="radio" id="radio1" />
</form>

<p>The id of the form containing the radio button is: 
<script type="text/javascript">
x=document.getElementById('radio1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
取得单选按钮所属的表单的 id■◆599■设置或返回单选按钮的 id                 简化命令：．id■．id■设置或返回单选按钮的 id。



定义和用法
id 属性可设置或返回单选按钮的 id。
语法
radioObject.id=id
实例
下面的例子可提示出单选按钮的 id：
<html>
<body>

<form>
<input type="radio" id="radio1" />
</form>

<p>The id of the radio button is: 
<script type="text/javascript">
x=document.getElementById('radio1');
document.write(x.id);
</script>
</p>

</body>
</html>
TIY
显示出一个单选按钮的 id、类型和值■◆599■设置或返回单选按钮的名称                简化命令：．名称■．名称■设置或返回单选按钮的名称。



定义和用法
name 属性可设置或返回单选按钮的名称。
语法
radioObject.name=name
实例
下面的例子可显示出该单选按钮的名称：
<html>
<body>

<form>
<input type="radio" id="radio1" name="radio1" />
</form>

<p>The name of the radio button is: 
<script type="text/javascript">
x=document.getElementById('radio1');
document.write(x.name);
</script></p>

</body>
</html>
TIY
取得一个单选按钮的名称■◆599■设置或返回单选按钮的 tab 键控制次序     简化命令：．tab次序■．tab次序■设置或返回单选按钮的 tab 键控制次序。



定义和用法
tabIndex 属性可设置或返回单选按钮的 tab 键控制次序。
语法
radioObject.tabIndex=number
实例
下面的例子可显示出单选按钮的 tab index：
<html>
<head>
<script type="text/javascript">
function showTabIndex()
  {
  var r1=document.getElementById('radio1').tabIndex;
  var r2=document.getElementById('radio2').tabIndex;
  var r3=document.getElementById('radio3').tabIndex;
  document.write("Tab index of radio button 1: " + r1);
  document.write("<br />");
  document.write("Tab index of radio button 2: " + r2);
  document.write("<br />");
  document.write("Tab index of radio button 3: " + r3);
  }
</script>
</head>
<body>

<form>
<input type="radio" id="radio1" tabindex="1" /><br />
<input type="radio" id="radio2" tabindex="2" /><br />
<input type="radio" id="radio3" tabindex="3" /><br />
<input type="button" onclick="showTabIndex()" value="Show tabIndex" />
</form>

</body>
</html>
TIY
显示单选按钮的 tab 键控制次序■◆599■返回单选按钮的表单类型                  简化命令：．类型■．类型■返回单选按钮的表单类型。



定义和用法
type 属性可返回单选按钮的表单元素类型。对于单选按钮，该属性总是 "radio"。
语法
radioObject.type
实例
下面的例子可返回单选按钮的表单元素类型：
<html>
<body>

<form>
<input type="radio" id="radio1" />
</form>

<script type="text/javascript">
x=document.getElementById("radio1");
document.write("Form element type is: ");
document.write(x.type);
</script>

</body>
</html>
TIY
取得单选按钮的表单元素类型■◆599■设置或返回单选按钮的 value 属性的值     简化命令：．值■．值■设置或返回单选按钮的 value 属性的值。



定义和用法
value 属性可设置或返回单选按钮的 value 属性的值。
语法
radioObject.value=sometext
实例
<html>
<head>
<script type="text/javascript">
function check(browser)
  {
  document.getElementById("answer").value=browser
  }
</script>
</head>

<body>
<p>What's your favorite browser:</p>
<form>
<input type="radio" name="browser" onclick="check(this.value)"
value="Internet Explorer" />Internet Explorer<br />
<input type="radio" name="browser" onclick="check(this.value)"
value="Firefox" />Firefox<br />
<input type="radio" name="browser" onclick="check(this.value)"
value="Netscape" />Netscape<br />
<input type="radio" name="browser" onclick="check(this.value)"
value="Opera" />Opera<br />
<br />
Your favorite browser is: <input type="text" id="answer" size="20" />
</form>
</body>

</html>
TIY
使用单选按钮中的 value 属性■◆599■从单选按钮移开焦点()                    简化命令：．移焦■．移焦■从单选按钮移开焦点。



定义和用法
blur() 方法用于从单选按钮上移开焦点。
语法
radioObject.blur()
实例
下面的例子可设置或移开单选按钮上的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('male').focus()
  }
function loseFocus()
  {
  document.getElementById('male').blur()
  }
</script>
</head>
<body>

<form>
Male: <input id="male" type="radio" name="Sex" value="Male" />
<br />
Female: <input id="female" type="radio" name="Sex" value="Female" />
<br />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />
</form>

</body>
</html>
TIY
设置或移开单选按钮上的焦点■◆599■在单选按钮上模拟一次鼠标点击()          简化命令：．单击■．单击■在单选按钮上模拟一次鼠标点击。



定义和用法
click() 方法用于在单选按钮上模拟一次鼠标点击：
语法
radioObject.click()
实例
下面的例子可在单选按钮上模拟一次鼠标点击：
<html>
<head>
<script type="text/javascript">
function clickRadio()
  {
  document.getElementById('radio1').click()
  }
</script>
</head>
<body>

<form>
<input type="radio" id="radio1" />
<br />
<input type="button" onclick="clickRadio()"
value="Click radio button" />
</form>

</body>
</html>
TIY
在单选按钮上模拟一次鼠标点击■◆599■为单选按钮赋予焦点()                    简化命令：．给焦■．给焦■为单选按钮赋予焦点。



定义和用法
focus() 方法用于赋予单选按钮焦点。
语法
radioObject.focus()
实例
下面的例子可为 "Male" 单选按钮设置焦点：
<html>
<body>

<form>
Male: <input id="male" type="radio" name="Sex" value="Male" />
<br />
Female: <input id="female" type="radio" name="Sex" value="Female" />
</form>

<script type="text/javascript">
document.getElementById('male').focus();
</script>

</body>
</html>
TIY
向单选按钮设置焦点■◆345■表单重置■表单重置■Reset 对象
Reset 对象代表 HTML 表单中的一个重置按钮。
在 HTML 表单中 <input type="reset"> 标签每出现一次，一个 Reset 对象就会被创建。
当重置按钮被点击，包含它的表单中所有输入元素的值都重置为它们的默认值。默认值由 HTML value 属性或 JavaScript 的 defaultValue 属性指定。
重置按钮在重置表单之前触发 onclick 句柄，并且这个句柄可以通过返回 fasle 来取消。
参阅 Form.reset() 方法 和 Form.onreset 事件句柄。
您可以通过遍历表单的 elements[] 数组来访问某个重置按钮，或者通过使用document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆614■设置或返回访问重置按钮的快捷键          简化命令：．快捷键■．快捷键■设置或返回访问重置按钮的快捷键。



定义和用法
accessKey 属性可设置或返回访问重置按钮的快捷键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
resetObject.accessKey=accessKey
实例
下面的例子可返回重置按钮的快捷键：
<html>
<body>

<form>
<input type="reset" accesskey="r" id="reset1" />
</form>

<p>AccessKey for the reset button is: 
<script type="text/javascript">
x=document.getElementById('reset1');
document.write(x.accessKey);
</script></p>

</body>
</html>
TIY
返回重置按钮的快捷键■◆614■设置或返回不支持重置按钮时显示的文本    简化命令：．备文■．备文■设置或返回当浏览器不支持重置按钮时供显示的替代文本。



定义和用法
alt 属性可设置或返回在浏览器不支持重置按钮时显示的替代文本。
语法
resetObject.alt=alternate_text
实例
下面的例子可返回重置按钮的 alt 文本：
<html>
<body>

<form>
<input type="reset" alt="Reset button" id="reset1" />
</form>

<p>The alt text for the reset button is:
<script type="text/javascript">
x=document.getElementById('reset1');
document.write(x.alt);
</script></p>

</body>
</html>
TIY
返回重置按钮的 alt 文本■◆614■设置或返回重置按钮是否应被禁用          简化命令：．禁用■．禁用■设置或返回重置按钮是否应被禁用。



定义和用法
disabled 属性可设置或返回是否禁用重置按钮。
语法
resetObject.disabled=true|false
实例
下面的例子会在单击重置按钮时将其禁用：
<html>
<head>
<script type="text/javascript">
function disableButton()
  {
  document.getElementById("reset1").disabled=true
  }
</script>
</head>

<body>
<form>
<input type="reset" id="reset1" onclick="disableButton()" />
</form>
</body>

</html>
TIY
提示重置按钮的 id、类型和值 + 禁用按钮■◆614■返回一个对包含此重置按钮的表单对象的引用简化命令：．表单■．表单■返回一个对包含此重置按钮的表单对象的引用。



定义和用法
form 属性可返回对包含该重置按钮的表单的引用。
若成功，该属性返回一个表单对象。
语法
resetObject.form
实例
下面的例子将返回该重置按钮所属的表单的 id：
<html>
<body>

<form id="form1">
<input type="reset" id="reset1" />
</form>

<p>The id of the form containing the reset button is: 
<script type="text/javascript">
x=document.getElementById('reset1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
取得重置按钮所属的表单的 id■◆614■设置或返回重置按钮的 id                 简化命令：．id■．id■设置或返回重置按钮的 id。



定义和用法
id 属性可设置或返回重置按钮的 id。
语法
resetObject.id=id
实例
下面的例子可获得出重置按钮的 id：
<html>
<head>
<script type="text/javascript">
function alertId()
{
alert(document.getElementById("reset1").id)
}
</script>
</head>

<body>
<form>
<input type="reset" id="reset1" onclick="alertId()" />
</form>
</body>

</html>
TIY
提示重置按钮的 id、类型和值 + 禁用按钮■◆614■设置或返回重置按钮的名称                简化命令：．名称■．名称■设置或返回重置按钮的名称。



定义和用法
name 属性可设置或返回重置按钮的名称。
语法
resetObject.name=name
实例
下面的例子将返回重置按钮的名称：
<html>
<body>

<form>
<input type="reset" id="reset1" name="reset1" />
</form>

<p>The name of the reset button is:
<script type="text/javascript">
x=document.getElementById('reset1');
document.write(x.name);
</script></p>

</body>
</html>
TIY
返回重置按钮的名称■◆614■设置或返回重置按钮的 tab 键控制次序     简化命令：．tab次序■．tab次序■设置或返回重置按钮的 tab 键控制次序。



定义和用法
tabIndex 属性可设置或返回重置按钮的 tab 键控制次序。
语法
resetObject.tabIndex=tabIndex
实例
下面的例子可显示表单元素的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function showTabIndex()
  {
  var email=document.getElementById('email').tabIndex;
  var r1=document.getElementById('reset1').tabIndex;
  document.write("Tab index of email: " + email);
  document.write("<br />");
  document.write("Tab index of reset button: " + r1);
  }
</script>
</head>
<body>

<form>
Email: <input type="text" id="email" tabindex="1"
size="25" value="someone@example.com" />
<br />
<input type="reset" id="reset1" tabindex="2" />
<br /><br />
<input type="button" onclick="showTabIndex()"
value="Show tabIndex" />
</form>

</body>
</html>
TIY
显示表单元素的 tab 键控制次序■◆614■返回重置按钮的表单元素类型              简化命令：．类型■．类型■返回重置按钮的表单元素类型。



定义和用法
type 属性可返回重置按钮的表单元素类型。对于确认按钮，该属性总是 "reset"。
语法
resetObject.type
实例
下面的例子可返回重置按钮的表单元素类型：
<html>
<head>
<script type="text/javascript">
function alertType()
{
alert(document.getElementById("reset1").type)
}
</script>
</head>

<body>
<form>
<input type="reset" id="reset1" onclick="alertType()" />
</form>
</body>

</html>
TIY
提示重置按钮的 id、类型和值 + 禁用按钮■◆614■设置或返回重置按钮上显示的文本          简化命令：．值■．值■设置或返回重置按钮上显示的文本。



定义和用法
value 属性可设置或返回显示在重置按钮上的文本。
语法
resetObject.value=sometext
实例
下面的例子可提示出显示在重置按钮上的文本：
<html>
<head>
<script type="text/javascript">
function alertValue()
{
alert(document.getElementById("reset1").value)
}
</script>
</head>

<body>
<form>
<input type="reset" value="Reset values" id="reset1"
onclick="alertValue()" />
</form>
</body>

</html>
TIY
提示重置按钮的 id、类型和值 + 禁用按钮■◆614■从重置按钮上移开焦点()                  简化命令：．移焦■．移焦■从重置按钮上移开焦点。■◆614■在重置按钮上模拟一次鼠标点击()          简化命令：．单击■．单击■在重置按钮上模拟一次鼠标点击。■◆614■为重置按钮赋予焦点()                    简化命令：．给焦■．给焦■为重置按钮赋予焦点。■◆345■表单提交■表单提交■Submit 对象
Submit 对象代表 HTML 表单中的一个提交按钮 (submit button)。
在 HTML 表单中 <input type="submit"> 标签每出现一次，一个 Submit 对象就会被创建。
在表单提交之前，触发 onclick 事件句柄，并且一个句柄可以通过返回 fasle 来取消表单提交。
参阅 Form.submit() 方法 和 Form.onsubmit 事件句柄。
实例：表单验证
您可以通过遍历表单的 elements[] 数组来访问某个提交按钮，或者通过使用document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆627■设置或返回访问提交按钮的快捷键          简化命令：．快捷键■．快捷键■设置或返回访问提交按钮的快捷键。


定义和用法
accessKey 属性可设置或返回访问确认按钮的快捷键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
submitObject.accessKey=accessKey
实例
下面的例子可返回确认按钮的快捷键：
<html>
<body>

<form>
<input type="submit" accesskey="s" id="submit1" />
</form>

<p>AccessKey for the submit button is: 
<script type="text/javascript">
x=document.getElementById('submit1');
document.write(x.accessKey);
</script></p>

</body>
</html>
TIY
返回确认按钮的快捷键■◆627■设置或返回不支持提交按钮时替代文本      简化命令：．备文■．备文■设置或返回当浏览器不支持提交按钮时供显示的替代文本。



定义和用法
alt 属性可设置或返回在浏览器不支持确认按钮时显示的替代文本。
语法
submitObject.alt=alternate_text
实例
下面的例子可返回确认按钮的 alt 文本：
<html>
<body>

<form>
<input type="submit" alt="submit button" id="submit1" />
</form>

<p>The alt text for the submit button is:
<script type="text/javascript">
x=document.getElementById('submit1');
document.write(x.alt);
</script></p>

</body>
</html>
TIY
返回确认按钮的 alt 文本■◆627■设置或返回提交按钮是否应被禁用          简化命令：．禁用■．禁用■设置或返回提交按钮是否应被禁用。



定义和用法
disabled 属性可设置或返回是否禁用确认按钮
语法
submitObject.disabled=true|false
实例
下面的例子会在单击确认按钮时将其禁用：
<html>
<head>
<script type="text/javascript">
function disableButton()
  {
  document.getElementById("submit1").disabled=true
  }
</script>
</head>

<body>
<form>
<input type="submit" id="submit1" onclick="disableButton()" />
</form>
</body>

</html>
TIY
提示确认按钮的 id、类型和值 + 禁用按钮■◆627■返回一个对包含此提交按钮的表单的引用    简化命令：．表单■．表单■返回一个对包含此提交按钮的表单的引用。


定义和用法
form 属性可返回对包含该确认按钮的表单的引用。
若成功，该属性返回一个表单对象。
语法
submitObject.form
实例
下面的例子将返回该确认按钮所属的表单的 id：
<html>
<body>

<form id="form1">
<input type="submit" id="submit1" />
</form>

<p>The id of the form containing the submit button is: 
<script type="text/javascript">
x=document.getElementById('submit1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
取得确认按钮所属的表单的 id■◆627■设置或返回提交按钮的 id                 简化命令：．id■．id■设置或返回提交按钮的 id。




定义和用法
id 属性可设置或返回确认按钮的 id。
语法
submitObject.id=id
实例
下面的例子可提示出确认按钮的 id：
<html>
<head>
<script type="text/javascript">
function alertId()
{
alert(document.getElementById("submit1").id)
}
</script>
</head>

<body>
<form>
<input type="submit" id="submit1" onclick="alertId()" />
</form>
</body>

</html>
TIY
提示确认按钮的 id、类型和值 + 禁用按钮■◆627■设置或返回提交按钮的名称                简化命令：．名称■．名称■设置或返回提交按钮的名称。



定义和用法
name 属性可设置或返回确认按钮的名称。
语法
submitObject.name=name
实例
下面的例子可显示出该确认按钮的名称：
<html>
<body>

<form>
<input type="submit" id="submit1" name="submit1" />
</form>

<p>The name of the submit button is:
<script type="text/javascript">
x=document.getElementById('submit1');
document.write(x.name);
</script></p>

</body>
</html>
TIY
取得一个确认按钮的名称■◆627■设置或返回提交按钮的 tab 键控制次序     简化命令：．tab次序■．tab次序■设置或返回提交按钮的 tab 键控制次序。



定义和用法
tabIndex 属性可设置或返回确认按钮的 tab 键控制次序。
语法
submitObject.tabIndex=tabIndex
实例
下面的例子可显示表单元素的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function showTabIndex()
  {
  var email=document.getElementById('email').tabIndex;
  var r1=document.getElementById('submit1').tabIndex;
  document.write("Tab index of email: " + email);
  document.write("<br />");
  document.write("Tab index of submit button: " + r1);
  }
</script>
</head>
<body>

<form>
Email: <input type="text" id="email" tabIndex="1"
size="25" value="someone@example.com" />
<br />
<input type="submit" id="submit1" tabIndex="2" />
<br /><br />
<input type="button" onclick="showTabIndex()" value="Show tabIndex" />
</form>

</body>
</html>
TIY
显示表单元素的 tab 键控制次序■◆627■返回提交按钮的表单元素类型              简化命令：．类型■．类型■返回提交按钮的表单元素类型。



定义和用法
type 属性可返回确认按钮的表单元素类型。对于确认按钮，该属性总是 "submit"。
语法
submitObject.type
实例
下面的例子可返回确认按钮的表单元素类型：
<html>
<head>
<script type="text/javascript">
function alertType()
{
alert(document.getElementById("submit1").type)
}
</script>
</head>

<body>
<form>
<input type="submit" id="submit1" onclick="alertType()" />
</form>
</body>

</html>
TIY
提示确认按钮的 id、类型和值 + 禁用按钮■◆627■设置或返回在提交按钮上显示的文本        简化命令：．值■．值■设置或返回在提交按钮上显示的文本。



定义和用法
value 属性可设置或返回显示在确认按钮上的文本。
语法
submitObject.value=sometext
实例
下面的例子可提示出显示在确认按钮上的文本：
<html>
<head>
<script type="text/javascript">
function alertValue()
{
alert(document.getElementById("submit1").value)
}
</script>
</head>

<body>
<form>
<input type="submit" value="submit values" id="submit1"
onclick="alertValue()" />
</form>
</body>

</html>
TIY
提示确认按钮的 id、类型和值 + 禁用按钮■◆627■从提交按钮上移开焦点()                  简化命令：．移焦■．移焦■从提交按钮上移开焦点。■◆627■在提交按钮上模拟一次鼠标点击()          简化命令：．单击■．单击■在提交按钮上模拟一次鼠标点击。■◆627■为提交按钮赋予焦点()                    简化命令：．给焦■．给焦■为提交按钮赋予焦点。■◆345■表单文本■表单文本■Text 对象
Text 对象代表 HTML 表单中的文本输入域。
在 HTML 表单中 <input type="text"> 每出现一次，Text 对象就会被创建。
该元素可创建一个单行的文本输入字段。当用户编辑显示的文本并随后把输入焦点转移到其他元素的时候，会触发 onchange 事件句柄。
您可以使用 HTML <textarea> 标记来创建多行文本输入。参阅 Textarea 对象。
对于掩码文本输入，把 <input type="text"> 中的 type 设置为 "password"。参阅 Input Password。
您可以通过表单的 elements[] 数组来访问文本输入域，或者通过使用 document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆640■设置或返回访问文本域的快捷键            简化命令：．快捷键■．快捷键■设置或返回访问文本域的快捷键。


定义和用法
accessKey 属性可设置或返回访问文本域的快捷键。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
textObject.accessKey=accessKey
实例
下面的例子设置了文本域的快捷键：
<html>
<head>
<script type="text/javascript">
function setAccessKeys()
  {
  document.getElementById('fname').accessKey="n"
  document.getElementById('pwd').accessKey="p"
  }
</script>
</head>

<body onload="setAccessKeys()">
<form>
Name: <input id="fname" type="text" />
<br />
Password: <input id="pwd" type="password" />
</form>
</body>

</html>
TIY
为文本域添加快捷键
为若干表单域添加快捷键■◆640■设置或返回不支持文本域时替代文本        简化命令：．备文■．备文■设置或返回当浏览器不支持文本域时供显示的替代文本。



定义和用法
alt 属性可设置或返回在浏览器不支持文本域时显示的替代文本。
语法
textObject.alt=alternate_text
实例
下面的例子可返回文本域的 alt 文本：
<html>
<body>

<form>
Email: <input type="text" alt="Email input field" id="email" />
</form>

<p>The alt text for the text field is:
<script type="text/javascript">
x=document.getElementById('email');
document.write(x.alt);
</script></p>

</body>
</html>
TIY
返回文本域的 alt 文本■◆640■设置或返回文本域的默认值                简化命令：．初始值■．初始值■设置或返回文本域的默认值。


定义和用法
defaultValue 属性可设置或返回文本域的默认值。
注释：该默认值是规定于 HTML "value" 属性的值。
语法
textObject.defaultValue=somevalue
实例
下面的例子可获得该文本域的默认文本：
<html>
<head>
<script type="text/javascript">
function alertValue()
{
alert(document.getElementById("text1").defaultValue)
}
</script>
</head>
<body>

<form>
<input type="text" id="text1" value="Hello World!" />
<input type="button" id="button1" onclick="alertValue()" 
value="Show default value" />
</form>

</body>
</html>
TIY
获得该文本域的默认文本■◆640■设置或返回文本域是否应被禁用            简化命令：．禁用■．禁用■设置或返回文本域是否应被禁用。



定义和用法
disabled 属性可设置或返回是否禁用文本域。
语法
textObject.disabled=true|false
实例
下面的例子禁用了一个文本域：
<html>
<head>
<script type="text/javascript">
function disableField()
  {
  document.getElementById("text1").disabled=true
  }
</script>
</head>
<body>

<form>
<input type="text" id="text1" value="Hello world!" />
<input type="button" id="button1" onclick="disableField()"
value="Disable text field" />
</form>

</body>
</html>
TIY
禁用了文本域■◆640■返回一个对包含文本域的表单对象的引用    简化命令：．表单■．表单■返回一个对包含文本域的表单对象的引用。



定义和用法
form 属性可返回队包含该文本域的表单的引用。
若成功，该属性返回一个表单对象。
语法
textObject.form
实例
下面的例子为文本域所属的表单设置了 id：
<html>
<body>

<form id="form1">
<input type="text" id="text1" />
</form>

<p>The id of the form containing the text field is:
<script type="text/javascript">
x=document.getElementById('text1');
document.write(x.form.id);
</script></p>

</body>
</html>
TIY
获得文本域所属的表单的 id■◆640■设置或返回文本域的 id                   简化命令：．id■．id■设置或返回文本域的 id。



定义和用法
id 属性设置或返回文本域的 id。
语法
textObject.id=id
实例
本例设置了该文本域的 id：
<html>
<body>

<form>
<input type="text" id="text1" />
</form>

<p>The id of the text field is:
<script type="text/javascript">
x=document.getElementById('text1');
document.write(x.id);
</script></p>

</body>
</html>
TIY
获得文本域的 id■◆640■设置或返回文本域中的最大字符数          简化命令：．最长■．最长■设置或返回文本域中的最大字符数。



定义和用法
maxLength 属性可设置或返回文本域中的最大字符数。
语法
textObject.maxLength=number_of_char
实例
下面的例子显示出该文本域的最大字符数：
<html>
<head>
<script type="text/javascript">
function maxLen()
  {
  alert(document.getElementById("name").maxLength)
  }
</script>
</head>

<body>
<form>
Name:
<input type="text" id="name" value="Mickey Mouse" size="20" maxlength="30" />
<br /><br />
<input type="button" onclick="maxLen()" value="Alert maxlength" />
</form>
</body>

</html>
TIY
提示出文本域的尺寸和最大字符数
当达到文本域的最大字符数时跳至下一个域■◆640■设置或返回文本域的名称                  简化命令：．名称■．名称■设置或返回文本域的名称。



定义和用法
name 属性设置或返回文本域的名称。
语法
textObject.name=name
实例
下面的例子获得了文本域的名称：
<html>
<body>

<form>
Email: <input type="text" id="email" name="email" />
</form>

<p>The name of the text field is:
<script type="text/javascript">
x=document.getElementById('text1');
document.write(x.name);
</script></p>

</body>
</html>
TIY
获得文本域的名称■◆640■设置或返回文本域是否应是只读的          简化命令：．只读■．只读■设置或返回文本域是否应是只读的。



定义和用法
readOnly 属性设置或返回文本域是否为只读。
语法
textObject.readOnly=true|false
实例
下面的例子将文本域设置为只读：
<html>
<head>
<script type="text/javascript">
function makeReadOnly()
  {
  document.getElementById("text1").readOnly=true
  }
</script>
</head>
<body>

<form>
<input type="text" id="text1" value="Hello World!" />
<input type="button" onclick="makeReadOnly()" value="Make read-only" />
</form>

</body>
</html>
TIY
将文本域设置为只读■◆640■设置或返回文本域的尺寸                  简化命令：．尺寸■．尺寸■设置或返回文本域的尺寸。



定义和用法
size 属性设置或返回文本域的尺寸（以字符数计）
语法
textObject.size=number_of_char
实例
下面的例子提示出了文本域的尺寸：
<html>
<head>
<script type="text/javascript">
function fieldSize()
  {
  alert(document.getElementById("name").size)
  }
</script>
</head>

<body>
<form>
Name:
<input type="text" id="name" value="Mickey Mouse" size="20" maxlength="30" />
<br /><br />
<input type="button" onclick="fieldSize()" value="Alert size" />
</form>
</body>

</html>
TIY
提示出文本域的尺寸和最大字符数■◆640■设置或返回文本域的 tab 键控制次序       简化命令：．tab次序■．tab次序■设置或返回文本域的 tab 键控制次序。



定义和用法
tabIndex 属性设置或返回文本域的 tab 键控制次序。
语法
textObject.tabIndex=number
实例
下面的例子显示出不同文本域的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function checkTab(x)
{
alert(x.tabIndex)
}
</script>
</head>
<body>

<form id="myForm">
<input type="text" tabindex="1" onclick="checkTab(this)">
<input type="text" tabindex="2" onclick="checkTab(this)">
<input type="text" tabindex="3" onclick="checkTab(this)">
</form>

</body>
</html>
TIY
显示出不同文本域的 tab 键控制次序■◆640■返回文本域的表单元素类型                简化命令：．类型■．类型■返回文本域的表单元素类型。



定义和用法
type 属性返回文本域的表单元素类型。对于文本域，该属性总是返回 "text"。
语法
textObject.type
实例
下面的例子返回了文本域的表单元素类型：
<html>
<body>

<form>
<input type="text" id="text1" />
</form>

<script type="text/javascript">
x=document.getElementById("text1");
document.write("Form element type is: ");
document.write(x.type);
</script>

</body>
</html>
TIY
获得了文本域的表单元素类型■◆640■设置或返回文本域的 value 属性的值       简化命令：．值■．值■设置或返回文本域的 value 属性的值。




定义和用法
value 属性设置或返回文本域的值。
语法
textObject.value=text
实例
下面的例子可获得文本域的值：
<html>
<head>
<script type="text/javascript">
function alertValue()
  {
  alert(document.getElementById("text1").value)
  }
</script>
</head>
<body>

<form>
<input type="text" id="text1" value="Hello world!" />
<input type="button" id="button1" onclick="alertValue()" 
value="Show default value" />
</form>

</body>
</html>
TIY
获得文本域的值
表单验证
表单中的单选按钮
表单中的复选按钮
表单中的下拉列表
另一个下拉列表■◆640■从文本域上移开焦点()                    简化命令：．移焦■．移焦■从文本域上移开焦点。



定义和用法
blur() 方法用于从文本域移开焦点。
语法
textObject.blur()
实例
下面的例子可设置和移开文本域上的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('text1').focus()
  }
function loseFocus()
  {
  document.getElementById('text1').blur()
  }
</script>
</head>
<body>

<form>
<input type="text" id="text1" />
<br />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />
</form>

</body>
</html>
TIY
设置和移开文本域上的焦点■◆640■在文本域上设置焦点()                    简化命令：．给焦■．给焦■在文本域上设置焦点。



定义和用法
focus() 方法用于赋予文本域焦点。
语法
textObject.focus()
实例
下面的例子可设置和移开文本域上的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('text1').focus()
  }
function loseFocus()
  {
  document.getElementById('text1').blur()
  }
</script>
</head>
<body>

<form>
<input type="text" id="text1" />
<br />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />
</form>

</body>
</html>
TIY
设置和移开文本域上的焦点■◆640■选取文本域中的内容()                    简化命令：．选取■．选取■选取文本域中的内容。



定义和用法
select() 方法用于选取文本域中的内容。
语法
textObject.select()
实例
下面的例子可选取文本域中的内容：
<html>
<head>
<script type="text/javascript">
function selText()
  {
  document.getElementById("myText").select()
  }
</script>
</head>
<body>

<form>
<input size="25" type="text" id="myText" value="A cat played with a ball">
<input type="button" value="Select text" onclick="selText()"> 
</form>

</body>
</html>
TIY
选取文本域中的内容■◆345■外部资源■外部资源■Link 对象
Link 对象代表某个 HTML 的 <link> 元素。<link> 元素可定义两个链接文档之间的关系。
<link> 元素被定义于 HTML 文档的 head 部分。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆657■设置或返回目标 URL 的字符编码           简化命令：．字符集■．字符集■设置或返回目标 URL 的字符编码。



定义和用法
The charset property sets or returns the character encoding of the target URL.
语法
linkObject.charset=character-encoding
实例
The following example sets the character encoding of the target URL:
<html>
<head>
<link rel="stylesheet" type="text/css" id="style1"
href="try_dom_link.css" />
</head>
<body>

<script type="text/javascript">
x=document.getElementById("style1");
x.charset="ISO-8859-1";
document.write("Charset=" + x.charset);
</script>

</body>
</html>
TIY
Set the character encoding of a <link> element■◆657■设置或返回目标 URL 是否当被禁用         简化命令：．禁用■．禁用■设置或返回目标 URL 是否当被禁用。



定义和用法
The disabled property sets or returns whether or not the target URL should be disabled.
语法
linkObject.disabled=true|false
实例
The following example disables the style sheet:
<html>
<head>
<link rel="stylesheet" type="text/css" 
id="style1" href="try_dom_link.css" />

<script type="text/javascript">
function disableStyle()
  {
  document.getElementById("style1").disabled=true
  }
</script>
</head>
<body>

<form>
<input type="button" id="button1" onclick="disableStyle()" 
value="Disable style sheet" />
</form>

</body>
</html>
TIY
Disable a style sheet■◆657■设置或返回被链接资源的URL               简化命令：．完整URL★■．完整URL■设置或返回被链接资源的 URL。



定义和用法
The href property sets or returns the URL of the linked resource.
语法
linkObject.href=URL
实例
The following example changes style sheet:
<html>
<head>
<link rel="stylesheet" type="text/css" 
id="style1" href="try_dom_link.css" />

<script type="text/javascript">
function changeStyle()
{
document.getElementById("style1").href="try_dom_link2.css"
}
</script>
</head>
<body>

<form>
<input type="button" id="button1" onclick="changeStyle()" 
value="Change style sheet" />
</form>

</body>
</html>
TIY
Change a style sheet link■◆657■设置或返回目标 URL 的基准语言           简化命令：．语言码■．语言码■设置或返回目标 URL 的基准语言。



定义和用法
The hreflang property sets or returns the base language of the target URL.
语法
linkObject.hreflang=languagecode
实例
The following example returns the language code of the link element:
<html>
<head>
<link rel="stylesheet" type="text/css" 
hreflang="us-en" id="style1" href="try_dom_link.css" />
</head>
<body>

<script type="text/javascript">
x=document.getElementById("style1");
document.write("Language code=" + x.hreflang);
</script>

</body>
</html>
TIY
Get the language code of a <link> element■◆657■设置或返回某个 <link> 元素的 id         简化命令：．id■．id■设置或返回某个 <link> 元素的 id。



定义和用法
The id property sets or returns the id of a link element.
语法
linkObject.id=id
实例
The following example outputs the id of a link element:
<html>
<head>
<link rel="stylesheet" type="text/css" 
id="style1" href="try_dom_link.css" />
</head>
<body>

<script type="text/javascript">
x=document.getElementById("style1");
document.write("Id of link=" + x.id);
</script>

</body>
</html>
TIY
Get the id of a <link> element■◆657■设置或返回文档显示的设备类型            简化命令：．设备■．设备■设置或返回文档显示的设备类型。



定义和用法
media 属性设置或返回显示文档的设备。
对于样式信息而言，目标媒介非常重要。移动设备和桌面计算机的样式可能是不同的。
语法
linkObject.media=device
设备可以是下列值之一：
值	描述
screen	针对不分页的计算机屏幕。
tty	针对使用等宽字符网格的媒介（比如打字机、终端或其他具有有限显示能力的设备）。
tv	针对 TV 类型的设备。
projection	针对投影机。
handheld	针对手持设备。
print	针对打印预览模式的页面和文档。
braille	针对盲人用点字法触觉反馈装置。
aural	针对语音合成。
all	针对所有设备或装置。
实例
下面的例子获得使用 link 元素的媒介类型：
<html>
<head>
<link rel="stylesheet" type="text/css" media="screen"
id="style1" href="try_dom_link.css" />
</head>
<body>

<script type="text/javascript">
x=document.getElementById("style1");
document.write("Intended media type=" + x.media);
</script>

</body>
</html>
TIY
获得使用 link 元素的媒介类型■◆657■设置或返回 <link> 元素的名称            简化命令：．名称■．名称■设置或返回 <link> 元素的名称。




定义和用法
The name property sets or returns the name of a element.
语法
linkObject.name=name
实例
The following example outputs the name of a link element:
<html>
<head>
<link rel="stylesheet" type="text/css" name="stylesheet" 
id="style1" href="try_dom_link.css" />

<script type="text/javascript">
function alertName()
  {
  alert(document.getElementById("style1").name);
  }
</script>
</head>
<body>

<form>
<input type="button" onclick="alertName()" 
value="Alert name attribute" />
</form>

</body>
</html>
TIY
Get the name attribute of a <link> element■◆657■设置或返回当前文档与目标 URL之间的关系  简化命令：．关系■．关系■设置或返回当前文档与目标 URL之间的关系。




定义和用法
The rel property sets or returns the relationship between the current document and the target URL.
The rel and rev properties work together. Those two properties are used by search engines to provide a linked navigation menu.
语法
linkObject.rel=relationship
The rel property can have one of the following values:
Value	Description
appendix	Link to the appendix page of the document
alternate	Link to an alternative source of the document
bookmark	Link to a bookmark
chapter	Link to a chapter
contents	Link to the table of contents of the document
copyright	Link to copyright or the policy of the document
glossary	Link to the glossary page of the document
index	Link to the index page of the document
next	Link to the next page
prev	Link to the previous page
section	Link to a section in a list of documents
start	Link to the first page (used by search engines to show the first page)
stylesheet	Link to the style sheet of the document.
subsection	Link to a sub-section in a list of current documents
实例
The following example returns the relationship between the current document and the target URL:
<html>
<head>
<link rel="stylesheet" type="text/css" 
id="style1" href="try_dom_link.css" />
</head>
<body>

<script type="text/javascript">
x=document.getElementById("style1");
document.write("Relationship: " + x.rel);
</script>

</body>
</html>
TIY
Return the relationship of a <link> element■◆657■设置或返回目标URL与当前文档之间的关系   简化命令：．反向关系■．反向关系■设置或返回目标 URL 与当前文档之间的关系。



定义和用法
The rev property sets or returns the relationship between the target URL and the current document.
The rel and rev properties work together. Those two properties are used by search engines to provide a linked navigation menu.
语法
linkObject.rev=relationship
The rel property can have one of the following values:
Value	Description
appendix	Link to the appendix page of the document
alternate	Link to an alternative source of the document
bookmark	Link to a bookmark
chapter	Link to a chapter
contents	Link to the table of contents of the document
copyright	Link to copyright or the policy of the document
glossary	Link to the glossary page of the document
index	Link to the index page of the document
next	Link to the next page
prev	Link to the previous page
section	Link to a section in a list of documents
start	Link to the first page (used by search engines to show the first page)
stylesheet	Link to the style sheet of the document.
subsection	Link to a sub-section in a list of current documents
实例
The following example returns the relationship between the target URL and the current document:
<html>
<head>
<link rev="subsection" id="link1" 
href="/htmldom/prop_link_rev.asp" />
</head>
<body>

<script type="text/javascript">
x=document.getElementById("link1");
document.write("Reverse relationship: " + x.rev);
document.write("<br />This page is a subsection of: ");
document.write(x.href);
</script>

</body>
</html>
TIY
Return the reverse relationship of a <link> element■◆657■设置或返回目标URL的MIME类型             简化命令：．类型■．类型■设置或返回目标 URL 的 MIME 类型。



定义和用法
The type property sets or returns the MIME type of the target URL (like "text/css", "text/javascript", "image/gif", etc.).
语法
linkObject.type=MIME_type
实例
The following example returns the MIME type of the target URL:
<html>
<head>
<link rel="stylesheet" type="text/css" 
id="style1" href="try_dom_link.css" />
</head>
<body>

<script type="text/javascript">
x=document.getElementById("style1");
document.write("MIME type: " + x.type);
</script>

</body>
</html>
TIY
Get the MIME type of a <link> element■◆345■概要■概要■Meta 对象
Meta 对象代表 HTML 的 一个 <meta> 元素。
<meta> 元素可提供有关某个 HTML 元素的元信息 (meta-information)，比如描述、针对搜索引擎的关键词以及刷新频率。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆668■设置或返回<meta>元素content属性值       简化命令：．content■．content■设置或返回 <meta> 元素的 content 属性的值。




定义和用法
content 属性设置或返回 <meta> 元素的 content 属性的值。
语法
metaObject.content=text
实例
本例的 <meta> 标签为搜索引擎定义了一些关键词。以下代码返回 content 属性的值：
<html>
<head>
<meta name="keywords" content="HTML,DHTML,CSS,JavaScript" />
</head>
<body>

<script type="text/javascript">
x=document.getElementsByTagName("meta")[0];
document.write("Meta content: " + x.content);
</script>

</body>
</html>
TIY
获得 <meta> 元素的 content 属性的值■◆668■把content属性连接到一个HTTP头部         简化命令：．httpEquiv■．httpEquiv■把 content 属性连接到一个 HTTP 头部。



定义和用法
httpEquiv 属性把 content 属性连接到 HTTP 头部。
语法
metaObject.httpEquiv=content-type|expires|refresh|set-cookie
实例
本例每 5 秒刷新页面：
<html>
<head>
<meta http-equiv="refresh" content="5" />
</head>
<body>

<script type="text/javascript">
x=document.getElementsByTagName("meta")[0];
document.write("Http equiv: " + x.httpEquiv);
</script>

</body>
</html>
TIY
每 5 秒刷新页面
5 秒后重定向页面■◆668■把 content 属性连接到某个名称           简化命令：．名称■．名称■把 content 属性连接到某个名称。



定义和用法
name 属性把 content 属性连接到 name。
语法
metaObject.name=author|description|keywords|generator|revised|others
实例
本例的 <meta> 标签为搜索引擎定义了一些关键词。以下代码返回 content 属性的值：
<html>
<head>
<meta name="keywords" content="HTML,DHTML,CSS,JavaScript" />
</head>
<body>

<script type="text/javascript">
x=document.getElementsByTagName("meta")[0];
document.write("Meta name: " + x.name);
</script>

</body>
</html>
TIY
获得 <meta> 元素的 content 属性的名称■◆668■设置或返回用于解释content属性的值的格式 简化命令：．scheme■．scheme■设置或返回用于解释 content 属性的值的格式。



定义和用法
scheme 属性设置或返回用于解释 content 属性的值的格式。
语法
metaObject.scheme=format
实例
本例返回用于解释 content 属性的值的格式：
<html>
<head>
<meta name="revised" content="2006-11-03" scheme="YYYY-MM-DD" />
</head>

<body>

<script type="text/javascript">
x=document.getElementsByTagName("meta")[0];
document.write("Content format: " + x.scheme);
</script>

</body>

</html>
TIY
返回 <meta> 元素中 content 的格式■◆345■对象标签■对象标签■Object 对象
Object 对象代表 HTML 的 <object> 元素。
<object> 元素用于在网页中包含对象，比如：图像、音频、视频、Java applet、ActiveX、PDF、Flash 等。■◆673■设置或返回对象相对于周围文本的对齐方式  简化命令：．对齐■．对齐■设置或返回对象相对于周围文本的对齐方式。■◆673■设置或返回字符串实现对象的存档功能      简化命令：．archive■．archive■设置或返回一个字符串，用于实现对象的存档功能。■◆673■设置或返回围绕对象的边框                简化命令：．框宽■．框宽■设置或返回围绕对象的边框。■◆673■设置或返回文件URL该文件包含Java类       简化命令：．code■．code■设置或返回文件的 URL，该文件包含已编译的 Java 类。■◆673■设置或返回组件的 URL                    简化命令：．codeBase■．codeBase■设置或返回组件的 URL。■◆673■codeType                                简化命令：．codeType■．codeType■codeType■◆673■ data                                   简化命令：．data■．data■ data■◆673■ declare                                简化命令：．declare■．declare■ declare■◆673■返回对对象的父表单的引用                简化命令：．表单■．表单■返回对对象的父表单的引用。■◆673■设置或返回对象的高度                    简化命令：．全高■．全高■设置或返回对象的高度。■◆673■设置或返回对象的水平外边距              简化命令：．图横空■．图横空■设置或返回对象的水平外边距。■◆673■设置或返回对象的名称                    简化命令：．名称■．名称■设置或返回对象的名称。■◆673■设置或返回在加载对象时返回的消息        简化命令：．standby■．standby■设置或返回在加载对象时返回的消息。■◆673■设置或返回通过data属性下载数据内容类型  简化命令：．类型■．类型■设置或返回通过 data 属性下载的数据的内容类型。■◆673■ useMap                                 简化命令：．用图■．用图■ useMap■◆673■设置或返回对象的垂直外边距              简化命令：．图竖空■．图竖空■设置或返回对象的垂直外边距。■◆673■设置或返回对象的宽度                    简化命令：．全宽■．全宽■设置或返回对象的宽度。■◆345■下拉表选项■下拉表选项■Option 对象
Option 对象代表 HTML 表单中下拉列表中的一个选项。
在 HTML 表单中 <option> 标签每出现一次，一个 Option 对象就会被创建。
您可通过表单的 elements[] 数组访问一个 Option 对象，或者通过使用 document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆691■返回selected属性的默认值                简化命令：．是否默认■．是否默认■返回 selected  属性的默认值。



定义和用法
defaultSelected 属性可返回 selected 属性的初始值。
如果选择了默认的选项，则返回 true，否则返回 fasle。
如果表单被重置，则 selected 属性重置为该属性的值。这个该属性也会设置 selected 属性的值。
注释：默认的选项将显示在第一位。
语法
optionObject.defaultSelected
实例
下面的例子可检测所选项是否是默认选项：
<html>
<head>
<script type="text/javascript">
function alertDefaultSelected()
  {
  var x=document.getElementById("mySelect").selectedIndex;
  var y=document.getElementsByTagName("option");
  var txt="Is " + y[x].text + " selected by default? ";
  txt=txt + y[x].defaultSelected;
  alert(txt);
  }
</script>
</head>
<body>

<form>
Select your favorite fruit:
<select id="mySelect">
  <option>Apple</option>
  <option>Orange</option>
  <option selected="selected">Pineapple</option>
  <option>Banana</option>
</select>
<br />
<br />
<input type="button" onclick="alertDefaultSelected()"
value="Is the chosen fruit selected by default?">
</form>

</body>
</html>
TIY
检测所选项是否是默认选项■◆691■设置或返回选项是否应被禁用              简化命令：．禁用■．禁用■设置或返回选项是否应被禁用。


定义和用法
disabled 属性可设置或返回是否默认地禁用某个 <option> 元素。
注释：该 disabled 属性在 IE 中不起作用。
如果该属性为 true，则该 <option> 元素将被禁用，用户就无法选择它了。
该属性映射 HTML 属性 disabled。
语法
optionObject.disabled=true|false
实例
下面的例子可提示所选的水果是否被默认地禁用：
<html>
<head>
<script type="text/javascript">
function alertDefaultDisabled()
  {
  var x=document.getElementById("mySelect").selectedIndex;
  var y=document.getElementsByTagName("option");
  alert("Is " + y[x].text + " disabled by default? " + y[x].disabled);
  }
</script>
</head>
<body>

<form>
Select your favorite fruit:
<select id="mySelect">
<option>Apple</option>
<option>Orange</option>
<option disabled="disabled">Pineapple</option>
<option>Banana</option>
</select>
<br />
<br />
<input type="button" onclick="alertDefaultDisabled()"
value="Is the chosen fruit disabled by default?">
</form>

</body>
</html>
TIY
检测某个选项是否被默认地禁用
通过 id 禁用某个选项■◆691■返回对包含该元素的 <form> 元素的引用    简化命令：．表单■．表单■返回对包含该元素的 <form> 元素的引用。



定义和用法
form 属性可返回对包含选项的表单的引用。
语法
optionObject.form
实例
<html>
<body>

<form id="myForm">
<select id="mySelect">
  <option id="apple">Apple</option>
  <option id="orange">Orange</option>
  <option id="pineapple">Pineapple</option>
  <option id="banana">Banana</option>
</select>
</form>

<p>The id of the form is:
<script type="text/javascript">
document.write(document.getElementById("apple").form.id)
</script>
</p>

</body>
</html>
TIY
取得包含列表中选项的表单的 id■◆691■设置或返回选项的 id                     简化命令：．id■．id■设置或返回选项的 id。



定义和用法
id 属性可设置或返回下拉列表中选项的 id。
语法
optionObject.id=id
实例
下面的例子可返回下拉列表中所选选项的 id：
<html>
<head>
<script type="text/javascript">
function alertOptionId()
{
var x=document.getElementById("mySelect").selectedIndex;
alert(document.getElementsByTagName("option")[x].id);
}
</script>
</head>
<body>

<form>
Select your favorite fruit:
<select id="mySelect">
  <option id="apple">Apple</option>
  <option id="orange">Orange</option>
  <option id="pineapple">Pineapple</option>
  <option id="banana">Banana</option>
</select>
<br /><br />
<input type="button" onclick="alertOptionId()" value="Alert id">
</form>

</body>
</html>
TIY
取得下拉列表中所选选项的 id■◆691■返回下拉列表中某个选项的索引位置        简化命令：．索引■．索引■返回下拉列表中某个选项的索引位置。




定义和用法
index 属性可返回下拉列表中选项的索引位置。
语法
optionObject.index
实例
本例可返回下拉列表中所选的选项的索引位置：
<<html>
<head>
<script type="text/javascript">
function alertIndex()
{
var x=document.getElementById("mySelect").selectedIndex;
var y=document.getElementsByTagName("option");
alert(y[x].text + " has the index of: " + y[x].index);
}
</script>
</head>
<body>

<form>
Select your favorite fruit:
<select id="mySelect">
  <option>Apple</option>
  <option>Orange</option>
  <option>Pineapple</option>
  <option>Banana</option>
</select>
<br />
<br />
<input type="button" onclick="alertIndex()"
value="Show index of the chosen fruit">
</form>

</body>
</html>
TIY
取得下拉列表中所选的选项的索引位置■◆691■设置或返回选项的标记                    简化命令：．标记■．标记■设置或返回选项的标记 （仅用于选项组）。■◆691■设置或返回selected属性的值              简化命令：．被选择■．被选择■设置或返回 selected 属性的值。



定义和用法
selected 属性可设置或返回选项的 selected 属性的值。
该属性设置选项的当前状态，如果为 true，则该选项被选中。该属性的初始值来自 <option> 的 selected 属性。
语法
optionObject.selected=true|false
实例
本例可更改下拉列表中的被选选项：
<html>
<head>
<script type="text/javascript">
function selectOrange()
{
document.getElementById("orange").selected=true;
}
</script>
</head>

<body>
<form>
Select your favorite fruit:
<select>
<option id="apple">Apple</option>
<option id="orange">Orange</option>
<option id="pineapple" selected="selected">Pineapple</option>
<option id="banana">Banana</option>
</select>
<br /><br />
<input type="button" onclick="selectOrange()" value="Select Orange">
</form>
</body>
</html>
TIY
更改被选选项■◆691■设置或返回某个选项的纯文本值            简化命令：．文本■．文本■设置或返回某个选项的纯文本值。



定义和用法
text 属性可设置或返回选项的文本值。
该属性设置或返回的是包含在 <option> 元素中的纯文本。这个文本会作为选项的标签出现。
语法
optionObject.text=sometext
实例
下面的例子返回下拉列表中所有选项的文本：
<html>
<head>
<script type="text/javascript">
function getOptions()
  {
  var x=document.getElementById("mySelect");
  var y="";
  for (i=0;i<x.length;i++)
    {
    y+=x.options[i].text;
    y+="<br />";
    }
  document.write(y);
  }
</script>
</head>

<body>

<form>
请选择您喜欢的水果：
<select id="mySelect">
  <option>苹果</option>
  <option>桃子</option>
  <option>香蕉</option>
  <option>桔子</option>
</select>
<br /><br />
<input type="button" onclick="getOptions()" value="输出所有选项">
</form>

</body>
</html>
亲自试一试
TIY
输出下拉列表中所有选项的文本
设置下拉列表中被选选项的文本■◆691■设置或返回被送往服务器的值              简化命令：．值■．值■设置或返回被送往服务器的值。




定义和用法
value 属性可设置或返回选项的值。
当表单提交发生的时候，如果这个选项被选中，value 会和表单一起提交。映射 <option> 的 value 属性。
语法
optionObject.value=somevalue
实例
下面的例子可返回被选选项的文本：
<html>
<head>
<script type="text/javascript">
function alertValue()
  {
  var x=document.getElementById("mySelect").selectedIndex;
  alert(document.getElementsByTagName("option")[x].value);
  }
</script>
</head>
<body>

<form>
Select your favorite fruit:
<select id="mySelect">
  <option value="apple">Apple</option>
  <option value="orange">Orange</option>
  <option value="pineapple">Pineapple</option>
  <option value="banana">Banana</option>
</select>
<br /><br />
<input type="button" onclick="alertValue()" value="Alert selected value">
</form>

</body>
</html>
TIY
返回被选选项的文本■◆345■下拉表■下拉表■Select 对象
Select 对象代表 HTML 表单中的一个下拉列表。
在 HTML 表单中，<select> 标签每出现一次，一个 Select 对象就会被创建。
您可通过遍历表单的 elements[] 数组来访问某个 Select 对象，或者使用 document.getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆701■返回包含下拉列表中所有选项数组［集合］  简化命令：．选项■．选项■返回包含下拉列表中的所有选项的一个数组。



定义和用法
option 集合可返回包含 <select> 元素中所有 <option> 的一个数组。
注释：数组中的每个元素对应一个 <option> 标签 - 由 0 起始。
语法
selectObject.options[]
说明
options[] 集合并非一个普通的 HTMLcollection。为了和早期的浏览器向后兼容，这个集合有某种特殊的行为：允许通过 Select 对象来改变显示的选项：
如果把 options.length 属性设置为 0,Select 对象中所有选项都会被清除。
如果 options.length 属性的值比当前值小，出现在数组尾部的元素就会被丢弃。
如果把 options[] 数组中的一个元素设置为 null，那么选项就会从 Select 对象中删除。
可以通过构造函数 Option() 来创建一个新的 option 对象（需要设置 options.length 属性）。
实例
下面的例子返回下拉列表中所有选项的文本：
<html>
<head>
<script type="text/javascript">
function getOptions()
  {
  var x=document.getElementById("mySelect");
  var y="";
  for (i=0;i<x.length;i++)
    {
    y+=x.options[i].text;
    y+="<br />";
    }
  document.write(y);
  }
</script>
</head>

<body>

<form>
请选择您喜欢的水果：
<select id="mySelect">
  <option>苹果</option>
  <option>桃子</option>
  <option>香蕉</option>
  <option>桔子</option>
</select>
<br /><br />
<input type="button" onclick="getOptions()" value="输出所有选项">
</form>

</body>
</html>
亲自试一试
TIY
输出下拉列表中所有选项的文本
设置下拉列表中被选选项的文本■◆701■设置或返回是否应禁用下拉列表            简化命令：．禁用■．禁用■设置或返回是否应禁用下拉列表。



实例
禁用下拉列表：
<script>

document.getElementById("mydrop").disabled=true;

</script>
结果是：

亲自试一试
定义和用法
disabled 属性设置或返回是否禁用下拉列表。
被禁用的元素不可用且不可点击。被禁用元素在浏览器中通常显示为灰色。
语法
设置 disabled 属性：
element.disabled=true|false
返回 disabled 属性：
element.disabled
浏览器支持
所有浏览器都支持 disabled 属性。■◆701■返回对包含下拉列表的表单的引用          简化命令：．表单■．表单■返回对包含下拉列表的表单的引用。




定义和用法
form 属性可返回对包含该下拉列表的表单元素的引用。
语法
selectObject.form
实例
<html>
<body>

<form id="myForm">
<select id="mySelect">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
</form>

<p>The id of the form is:
<script type="text/javascript">
document.write(document.getElementById("mySelect").form.id)
</script>
</p>

</body>
</html>
TIY
取得包含该下拉列表的表单的 id■◆701■设置或返回下拉列表的 id                 简化命令：．id■．id■设置或返回下拉列表的 id。




定义和用法
id 属性可设置或返回下拉列表的 id。
语法
selectObject.id=id
实例
下面的例子可返回下拉列表的 id：
<html>
<body>

<form id="myForm">
<select id="mySelect">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
</form>

<p>The id of the dropdown list is:
<script type="text/javascript">
document.write(document.getElementById("mySelect").id)
</script>
</p>

</body>
</html>
TIY
取得下拉列表的 id■◆701■返回下拉列表中的选项数目                简化命令：．选项数■．选项数■返回下拉列表中的选项数目。




定义和用法
length 属性可返回下拉列表中选项的数目。
语法
selectObject.length=number
实例
下面的例子可返回下拉列表的 id：
<html>
<head>
<script type="text/javascript">
function getLength()
  {
  alert(document.getElementById("mySelect").length)
  }
</script>
</head>
<body>

<form>
<select id="mySelect">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<input type="button" onclick="getLength()"
value="How many options in the list?">
</form>

</body>
</html>
TIY
取得下拉列表中选项的数目■◆701■设置或返回是否选择多个项目              简化命令：．可以多选■．可以多选■设置或返回是否选择多个项目。



定义和用法
multiple 属性可设置或返回是否可有多个选项被选中。
注释：Opera 9 无法在脚本中设置该属性，仅能返回它。
语法
selectObject.multiple=true|false
实例
The following example returns the id of the dropdown list:
<html>
<head>
<script type="text/javascript">
function selectMultiple()
  {
  document.getElementById("mySelect").multiple=true
  }
</script>
</head>
<body>

<form>
<select id="mySelect" size="4">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<input type="button" onclick="selectMultiple()"
value="Select multiple">
</form>

</body>
</html>
TIY
选择下拉列表中的多个选项■◆701■设置或返回下拉列表的名称                简化命令：．名称■．名称■设置或返回下拉列表的名称。




定义和用法
name 属性可设置或返回下拉列表的名称。
语法
selectObject.name=name
实例
下面的例子可提示下拉列表的名称：
<html>
<head>
<script type="text/javascript">
function getName()
  {
  alert(document.getElementById("mySelect").name)
  }
</script>
</head>
<body>

<form>
<select name="mySelect" id="mySelect">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<input type="button" onclick="getName()" 
value="Alert name">
</form>

</body>
</html>
TIY
取得下拉列表的名称■◆701■设置或返回下拉列表中被选项目的索引号    简化命令：．被选索引■．被选索引■设置或返回下拉列表中被选项目的索引号。



定义和用法
selectedIndex 属性可设置或返回下拉列表中被选选项的索引号。
注释：若允许多重选择，则仅会返回第一个被选选项的索引号。
语法
selectObject.selectedIndex=number
实例
下面的例子可提示出被选选项的索引号：
<html>
<head>
<script type="text/javascript">
function getIndex()
  {
  var x=document.getElementById("mySelect")
  alert(x.selectedIndex)
  }
</script>
</head>
<body>

<form>
Select your favorite fruit:
<select id="mySelect">
  <option>Apple</option>
  <option>Orange</option>
  <option>Pineapple</option>
  <option>Banana</option>
</select>
<br /><br />
<input type="button" onclick="getIndex()"
value="Alert index of selected option">
</form>

</body>
</html>
TIY
显示被选选项的索引号
设置下拉列表中被选选项的文本
从下拉列表中删除选项■◆701■设置或返回下拉列表中的可见行数          简化命令：．尺寸■．尺寸■设置或返回下拉列表中的可见行数。




定义和用法
size 属性可设置或返回下拉列表中一次显示显示的选项数。
注释：Opera 9 无法在脚本中设置该属性，仅能返回它。
语法
selectObject.size=number
实例
<html>
<head>
<script type="text/javascript">
function changeSize()
  {
  document.getElementById("mySelect").size=4
  }
</script>
</head>
<body>

<form>
<select id="mySelect">
  <option>Apple</option>
  <option>Banana</option>
  <option>Orange</option>
  <option>Melon</option>
</select>
<input type="button" onclick="changeSize()"
value="Change size">
</form>

</body>
</html>
TIY
更改下拉列表中的可见行数■◆701■设置或返回下拉列表的 tab 键控制次序     简化命令：．tab次序■．tab次序■设置或返回下拉列表的 tab 键控制次序。



定义和用法
tabIndex 属性可设桌返回下拉列表中的 tab 键控制次序。
语法
selectObject.tabIndex=number
实例
下面的例子将显示出一个文本框和一个下拉列表的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function showTabIndex()
  {
  var email=document.getElementById('email').tabIndex;
  var sex=document.getElementById('sex').tabIndex;
  document.write("Tab index of email field: " + email);
  document.write("<br />");
  document.write("Tab index of dropdown list: " + sex);
  }
</script>
</head>
<body>

<form>
Email: <input type="text" id="email" tabindex="1" />
<br />
Sex:
<select id="sex" tabindex="2">
<option>Male</option>
<option>Female</option>
</select>
<br /><br />
<input type="button" onclick="showTabIndex()"
value="Show tabIndex" />
</form>

</body>
</html>
TIY
显示表单域的 tab 键控制次序■◆701■返回下拉列表的表单类型                  简化命令：．类型■．类型■返回下拉列表的表单类型。



定义和用法
type 属性可返回下拉列表的表单类型。对于下拉列表，类型总是 "select-one" 或 "select-multiple"。
语法
selectObject.type
实例
下面的例子返回下拉列表的表单类型：
<html>
<head>
<script type="text/javascript">
function getType()
  {
  alert(document.getElementById("mySelect").type)
  }
</script>
</head>
<body>

<form>
<select id="mySelect">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<input type="button" onclick="getType()" 
value="Alert type of dropdown list">
</form>
</body>
</html>
TIY
取得下拉列表的类型■◆701■向下拉列表添加一个选项()                简化命令：．加入■．加入■向下拉列表添加一个选项。




定义和用法
add() 方法用于向 <select> 添加一个 <option> 元素。
语法
selectObject.add(option,before)
参数	描述
option	必需。要添加选项元素。必需是 option 或 optgroup 元素。
before	必需。在选项数组的该元素之前增加新的元素。如果该参数是null，元素添加到选项数组的末尾。
实例
下面的例子可向下拉列表的末尾添加一个 "kiwi" 选项：
<html>
<head>
<script type="text/javascript">
function insertOption()
  {
  var y=document.createElement('option');
  y.text='Kiwi'
  var x=document.getElementById("mySelect");
  try
    {
    x.add(y,null); // standards compliant
    }
  catch(ex)
    {
    x.add(y); // IE only
    }
  }
</script>
</head>
<body>

<form>
<select id="mySelect">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<input type="button" onclick="insertOption()"
value="Insert option" />
</form>

</body>
</html>
TIY
把一个选项添加到下拉列表的末尾
在下拉列表的被选选项之前添加选项■◆701■从下拉列表移开焦点()                    简化命令：．移焦■．移焦■从下拉列表移开焦点。




定义和用法
blur() 方法用于从下拉列表中移开焦点。
语法
selectObject.blur()
实例
下面的例子可设置或从下拉列表移开焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('select1').focus()
  }
function loseFocus()
  {
  document.getElementById('select1').blur()
  }
</script>
</head>
<body>

<form>
<select id="select1">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<br /><br />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />
</form>

</body>
</html>
TIY
设置并从下拉列表移开焦点■◆701■在下拉列表上设置焦点()                  简化命令：．给焦■．给焦■在下拉列表上设置焦点。



定义和用法
focus() 方法用于赋予下拉列表焦点。
语法
selectObject.focus()
实例
下面的例子可为下拉列表设置焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('select1').focus()
  }
</script>
</head>
<body>

<form>
<select id="select1">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<br /><br />
<input type="button" onclick="setFocus()" value="Set focus" />
</form>

</body>
</html>
TIY
设置并从下拉列表移开焦点■◆701■从下拉列表中删除一个选项()              简化命令：．删除■．删除■从下拉列表中删除一个选项。




定义和用法
remove() 方法用于从下拉列表删除选项。
语法
selectObject.remove(index)
参数	描述
index	必需。规定要删除的选项的索引号。
说明
该方法从选项数组的指定位置移除 <option> 元素。如果指定的下标比 0 小，或者大于或等于选项的数目，remove() 方法会忽略它并什么也不做。
实例
下面的例子可从列表中删除被选的选项：
<html>
<head>
<script type="text/javascript">
function removeOption()
  {
  var x=document.getElementById("mySelect")
  x.remove(x.selectedIndex)
  }
</script>
</head>
<body>

<form>
<select id="mySelect">
  <option>Apple</option>
  <option>Pear</option>
  <option>Banana</option>
  <option>Orange</option>
</select>
<input type="button" onclick="removeOption()"
value="Remove option">
</form>

</body>
</html>
TIY
从下拉列表中删除被选的选项
从下拉列表中删除最后的选项■◆701■当改变选择时调用的事件句柄    事件句柄！简化命令：．被改■．被改■当改变选择时调用的事件句柄。


定义和用法
当改变选择时调用的事件句柄。
语法
selectObject.onchange
说明
Select 对象的 onchange 属性引用了一个事件句柄函数。当用户选中一个选项，或者取消了对一个选项的选定时，就会调用该句柄。这个事件不会指定新的选项是什么，必须通过 Select 对象的 selectedIndex 属性，或者各个 Option 对象的 selected 属性来确定这一点。■◆345■样式■样式■Style 对象
Style 对象代表一个单独的样式声明。可从应用样式的文档或元素访问 Style 对象。
使用 Style 对象属性的语法：
document.getElementById("id").style.property="值"
Style 对象的属性：
背景
边框和边距
布局
列表
杂项
定位
打印
滚动条
表格
文本
规范
IE: Internet Explorer, M: 仅适用于 Mac IE, W: 仅适用于 Windows IE, F: Firefox, O: Opera
W3C: 万维网联盟 World Wide Web Consortium (Internet 标准).



cssText 属性
它是一组样式属性及其值的文本表示。这个文本格式化为一个 CSS 样式表，去掉了包围属性和值的元素选择器的花括号。
将这一属性设置为非法的值将会抛出一个代码为 SYNTAX_ERR 的 DOMException 异常。当 CSS2Properties 对象是只读的时候，试图设置这一属性将会抛出一个代码为 NO_MODIFICATION_ALLOWED_ERR 的 DOMException 异常。
关于 CSS2Properties 对象
CSS2Properties 对象表示一组 CSS 样式属性及其值。它为 CSS 规范定义的每一个 CSS 属性都定义一个 JavaScript 属性。
一个 HTMLElement 的 style 属性是一个可读可写的 CSS2Properties 对象，就好像 CSSRule 对象的 style 属性一样。不过，Window.getComputedStyle() 的返回值是一个 CSS2Properties 对象，其属性是只读的。
相关页面
XML DOM 参考手册：CSS2Properties 对象
参考手册：CSS 参考手册


■◆718■在一行中设置所有的背景属性              简化命令：．背属■．背属■在一行中设置所有的背景属性



定义和用法
background 属性在一个声明中设置所有的背景属性。
语法：
Object.style.background=background-color background-image
background-repeat background-attachment background-position
参数	描述	值
background-color	设置元素的背景色。	
color-name
color-rgb
color-hex
transparent
background-image	设置背景图像。	
url(URL)
none
background-repeat	设置背景图像是否及如何重复。	
repeat
repeat-x
repeat-y
no-repeat
background-attachment	背景图像是否固定或者随着页面的其余部分滚动。	
scroll
fixed
background-position	设置背景图像的起始位置。	
top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right
x% y%
xpos ypos
实例
下面的例子改变了文档背景的样式：
<html>
<head>
<script type="text/javascript">
function setStyle()
{
document.body.style.background="#FFCC80 url(bgdesert.jpg) repeat-y";
}
</script>
</head>
<body>

<input type="button" onclick="setStyle()"
value="Set background style" />

</body>
</html>
TIY
改变文档背景的样式■◆718■设置背景图像是否固定或随页面滚动        简化命令：．背景图固定■．背景图固定■设置背景图像是否固定或随页面滚动



定义和用法
backgroundAttachment 属性设置背景图像是否固定或者随着页面的其余部分滚动。
语法：
Object.style.backgroundAttachment=scroll|fixed
提示和注释
提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好的视觉效果。
实例
本例设置在点击按钮后把背景图像设置为固定（不滚动）：
<html>
<head>
<style type="text/css">
body
{
background-color="#FFCC80";
background-image:url(bgdesert.jpg);
}
p
{
color:white;
}
</style>
<script type="text/javascript">
function changeAttachment()
{
document.body.style.backgroundAttachment="fixed";
}
</script>

</head>
<body>

<input type="button" onclick="changeAttachment()"
value="Set background-image to be fixed" />
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>
<p>This is a paragraph</p>

</body>
</html>
TIY
把背景图像设置为固定■◆718■设置元素的背景颜色                      简化命令：．景色★■．景色■设置元素的背景颜色



定义和用法
backgroundColor 属性设置元素的背景颜色。
语法：
Object.style.backgroundColor=color-name|color-rgb
|color-hex|transparent
实例
本例设置 body 的背景色：
<html>
<head>
<style type="text/css">
body
{
background-color:#B8BFD8;
}
</style>
<script type="text/javascript">
function changeStyle()
{
document.body.style.backgroundColor="#FFCC80";
}
</script>
</head>
<body>

<input type="button" onclick="changeStyle()"
value="Change background color" />

</body>
</html>
TIY
改变背景色（十六进制）
改变背景色（颜色名）■◆718■设置元素的背景图像                      简化命令：．景图■．景图■设置元素的背景图像



定义和用法
backgroundImage 属性设置元素的背景图像。
语法：
Object.style.backgroundImage=url(URL)|none
参数	描述
url(URL)	图像的路径。
none	无背景图像。
提示和注释
提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好的视觉效果。
实例
本例设置了背景图像：
<html>
<head>
<script type="text/javascript">
function changeStyle()
{
document.body.style.backgroundColor="#FFCC80";
document.body.style.backgroundImage="url(bgdesert.jpg)";
}
</script>
</head>
<body>

<input type="button" onclick="changeStyle()"
value="Set background image" />

</body>
</html>
TIY
设置背景图像■◆718■设置背景图像的起始位置                  简化命令：．景图起始■．景图起始■设置背景图像的起始位置



定义和用法
backgroundPosition 属性设置背景图像的位置。
语法：
Object.style.backgroundPosition=position
参数	描述
top left
top center
top right
center left
center center
center right
bottom left
bottom center
bottom right
如果您仅规定了一个关键词，那么第二个值将是"center"。
默认值：0% 0%。
x% y%	
第一个值是水平位置，第二个值是垂直位置。
左上角是 0% 0%。右下角是 100% 100%。
如果您仅规定了一个值，另一个值将是 50%。
xpos ypos	
第一个值是水平位置，第二个值是垂直位置。
左上角是 0 0。单位是像素 (0px 0px) 或任何其他的 CSS 单位。
如果您仅规定了一个值，另一个值将是50%。
您可以混合使用 % 和 position 值。
实例
本例改变背景图像的位置：
<html>
<head>
<style type="text/css">
body
{
background-color:#FFCC80;
background-image:url(bgdesert.jpg);
background-repeat:no-repeat
}
</style>
<script type="text/javascript">
function changePosition()
{
document.body.style.backgroundPosition="bottom center";
}
</script>
</head>
<body>

<input type="button" onclick="changePosition()"
value="Change background-image position" />

</body>
</html>
TIY
改变背景图像的位置■◆718■设置backgroundPosition属性的X坐标       简化命令：．起始横■．起始横■设置backgroundPosition属性的X坐标



定义和用法
backgroundPositionX 属性设置背景图像的水平位置。
语法：
Object.style.backgroundPositionX=position
参数	描述
left
center
right
水平位置。
x%	水平位置。左是 0%。右是 100%。
xpos	水平位置。左是 0。单位是像素 (0px) 或其他 CSS 单位。
实例
本例改变了背景图像的水平位置：
<html>
<head>
<style type="text/css">
body
{
background-color:#FFCC80;
background-image:url(bgdesert.jpg);
background-repeat:no-repeat
}
</style>
<script type="text/javascript">
function changePosition()
{
document.body.style.backgroundPositionX="right";
}
</script>
</head>
<body>

<input type="button" onclick="changePosition()"
value="Change background-image's x-position" />

</body>
</html>
TIY
改变背景图像的水平位置■◆718■设置backgroundPosition属性的Y坐标       简化命令：．起始竖■．起始竖■设置backgroundPosition属性的Y坐标




定义和用法
backgroundPositionY 属性设置 background-image 的垂直位置。
语法：
Object.style.backgroundPositionY=position
参数	描述
top
center
bottom
垂直位置。
y%	垂直位置。Top 是 0%。Bottom 是 100%
ypos	垂直位置。Top 是 0。单位是像素 (0px) 或其他 CSS 单位。
实例
下面的例子改变 background-image 的垂直位置：
<html>
<head>
<style type="text/css">
body
{
background-color:#FFCC80;
background-image:url(bgdesert.jpg);
background-repeat:no-repeat
}
</style>
<script type="text/javascript">
function changePosition()
{
document.body.style.backgroundPositionY="bottom";
}
</script>
</head>
<body>

<input type="button" onclick="changePosition()"
value="Change background-image's y-position" />

</body>
</html>
TIY
改变 background-image 的垂直位置■◆718■设置是否及如何重复背景图像              简化命令：．景图重复■．景图重复■设置是否及如何重复背景图像


．景图重复＝全面
．景图重复＝横向
．景图重复＝纵向
．景图重复＝不重



定义和用法
backgroundRepeat 属性设置背景图像是否及如何重复。
语法：
Object.style.backgroundRepeat=repeat_value
参数	描述
repeat	默认。背景图像将在垂直方向和水平方向重复。
repeat-x	背景图像将在水平方向重复。
repeat-y	背景图像将在垂直方向重复。
no-repeat	背景图像将仅显示一次。
实例
本例仅在 y 轴重复背景图像：
<html>
<head>
<style type="text/css">
body
{
background-color:#FFCC80;
background-image:url(bgdesert.jpg);
}
</style>
<script type="text/javascript">
function changeRepeat()
{
document.body.style.backgroundRepeat="repeat-y";
}
</script>
</head>
<body>

<input type="button" onclick="changeRepeat()"
value="Repeat background-image only on the y-axis" />

</body>
</html>
TIY
改变 background-image 的 repeat 属性■◆718■在一行设置四个边框的所有属性            简化命令：．边框■．边框■在一行设置四个边框的所有属性



定义和用法
border 属性在一个声明中设置所有边框属性。
语法：
Object.style.border=borderWidth borderStyle borderColor
值	描述	值
borderWidth	设置边框的宽度。	
thin
medium
thick
length
borderStyle	设置边框的样式。	
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
borderColor	设置边框的颜色。	
color-name
color-rgb
color-hex
transparent
实例
本例改变元素的边框：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000
}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.border="thick solid #0000FF";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
border - 改变元素的边框■◆718■在一行设置底边框的所有属性              简化命令：．底边框■．底边框■在一行设置底边框的所有属性



定义和用法
borderBottom 属性在一个声明中为下边框设置所有的属性。
语法：
Object.style.borderBottom=borderWidth borderStyle borderColor
值	描述	值
borderWidth	设置边框的宽度。	
thin
medium
thick
length
borderStyle	设置边框的样式。	
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
borderColor	设置边框的颜色。	
color-name
color-rgb
color-hex
transparent
实例
下面的例子设置下边框：
<html>
<head>
<style type="text/css">
p {border: thin dotted #FF0000}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderBottom="thick solid blue";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change bottom paragraph border" />
<p id="p1">This is a paragraph with a border</p>

</body>
</html>
TIY
borderBottom - 改变元素的下边框■◆718■设置底边框的颜色                        简化命令：．底框色■．底框色■设置底边框的颜色



定义和用法
borderBottomColor 属性设置元素的下边框的颜色。
语法：
Object.style.borderBottomColor=color-name|color-rgb|color-hex
实例
本例改变下边框的颜色：
<html>
<head>
<style type="text/css">
p {border: thick solid #FF0000}
</style>
<script type="text/javascript">
function changeBorderColor()
{
document.getElementById("p1").style.borderBottomColor="blue";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderColor()"
value="Change border color" />
<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderBottomColor - 改变下边框的颜色■◆718■设置底边框的样式                        简化命令：．底框样式■．底框样式■设置底边框的样式



定义和用法
borderBottomStyle 属性设置下边框的样式。
语法：
Object.style.borderBottomStyle=style
值	描述
none	定义无边框。
hidden	与 "none" 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。
dotted	定义点状边框。在大多数浏览器中呈现为实线。
dashed	定义虚线。在大多数浏览器中呈现为实线。
solid	定义实线。
double	定义双线。双线的宽度等于 border-width 的值。
groove	定义 3D 凹槽边框。其效果取决于 border-color 的值。
ridge	定义 3D 垄状边框。其效果取决于 border-color 的值。
inset	定义 3D inset 边框。其效果取决于 border-color 的值。
outset	定义 3D outset 边框。其效果取决于 border-color 的值。
实例
本例改变下边框的样式：
<html>
<head>
<style type="text/css">
p
{ 
border: thick solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderBottomStyle="dotted";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change bottom border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderBottomStyle - 改变下边框的样式■◆718■设置底边框的宽度                        简化命令：．底框宽■．底框宽■设置底边框的宽度



定义和用法
borderBottomWidth 属性设置下边框的宽度。
语法：
Object.style.borderBottomWidth=thin|medium|thick|length
值	描述
thin	定义细的下边框。
medium	默认。定义中等的下边框。
thick	定义粗的下边框。
length	允许您自定义下边框的宽度。
实例
本例改变下边框的宽度：
<html>
<head>
<style type="text/css">
p
{ 
border: thin solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorderWidth()
{
document.getElementById("p1").style.borderBottomWidth="thick";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderWidth()"
value="Change bottom border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderBottomWidth - 改变下边框的宽度■◆718■设置所有四个边框的颜色                  简化命令：．框色■．框色■设置所有四个边框的颜色 (可设置四种颜色)



定义和用法
borderColor 属性设置元素周围边框的颜色。
本属性可使用 1 到 4 种颜色：
如果规定一种颜色，比如 table {border-color: red} - 所有的边框都是红色。
如果规定了两种颜色，比如 table {border-color: red green} - 上边框和下边框是红色，而左边框和右边框是绿色。
如果规定了三种颜色，比如 table {border-color: red green blue}- 上边框是红色，左边框和右边框是绿色，下边框是蓝色。
如果规定了四种颜色，比如 table {border-color: red green blue yellow} - 上边框是红色，右边框是绿色，下边框是蓝色，左边框是黄色。
语法：
Object.style.borderColor=color-name|color-rgb|color-hex|transparent
实例
本例改变边框的颜色：
<html>
<head>
<style type="text/css">
p
{
border: thick solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorderColor()
{
document.getElementById("p1").style.borderColor="#0000FF #00FF00";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderColor()"
value="Change border color" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderColor - 改变边框的颜色■◆718■在一行设置左边框的所有属性              简化命令：．左边框■．左边框■在一行设置左边框的所有属性



定义和用法
borderLeft 属性在一个声明中为左边框设置所有属性。
语法：
Object.style.borderLeft=borderWidth borderStyle borderColor
可能的值：
值	描述	值
borderWidth	设置边框的宽度。	
thin
medium
thick
length
borderStyle	设置边框的样式。	
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
borderColor	设置边框的颜色。	
color-name
color-rgb
color-hex
transparent
实例
本例改变左边框的宽度、样式和颜色：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000
}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderLeft="thick solid #0000FF";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change left border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderLeft - 改变左边框的宽度、样式和颜色■◆718■设置左边框的颜色                        简化命令：．左框色■．左框色■设置左边框的颜色



定义和用法
borderLeftColor 属性设置元素的左边框的颜色。
语法：
Object.style.borderLeftColor=color-name|color-rgb|color-hex|transparent
实例
本例改变左边框的颜色：
<html>
<head>
<style type="text/css">
p
{ 
border: thick solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorderColor()
{
document.getElementById("p1").style.borderLeftColor="#0000FF";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderColor()"
value="Change left border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderleftColor - 改变左边框的颜色■◆718■设置左边框的样式                        简化命令：．左框样式■．左框样式■设置左边框的样式



定义和用法
borderLeftStyle 属性设置左边框的样式。
语法：
Object.style.borderLeftStyle=style
可能的值：
值	描述
none	定义无边框。
hidden	与 "none" 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。
dotted	定义点状边框。在大多数浏览器中呈现为实线。
dashed	定义虚线。在大多数浏览器中呈现为实线。
solid	定义实线。
double	定义双线。双线的宽度等于 border-width 的值。
groove	定义 3D 凹槽边框。其效果取决于 border-color 的值。
ridge	定义 3D 垄状边框。其效果取决于 border-color 的值。
inset	定义 3D inset 边框。其效果取决于 border-color 的值。
outset	定义 3D outset 边框。其效果取决于 border-color 的值。
实例
本例设置左边框的样式：
<html>
<head>
<style type="text/css">
p
{
border: thick solid #FF0000;
}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderLeftStyle="dotted";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change left border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderLeftStyle - 改变左边框的样式■◆718■设置左边框的宽度                        简化命令：．左框宽■．左框宽■设置左边框的宽度



定义和用法
borderLeftWidth 属性设置左边框的宽度。
语法：
Object.style.borderLeftWidth=thin|medium|thick|length
可能的值：
值	描述
thin	定义细的下边框。
medium	默认。定义中等的下边框。
thick	定义粗的下边框。
length	允许您自定义下边框的宽度。
实例
本例改变左边框的宽度：
<html>
<head>
<style type="text/css">
p
{
border: thin solid #FF0000;
}
</style>
<script type="text/javascript">
function changeBorderWidth()
{
document.getElementById("p1").style.borderLeftWidth="thick";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderWidth()"
value="Change left border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderLeftWidth - 改变左边框的宽度■◆718■在一行设置右边框的所有属性              简化命令：．右边框■．右边框■在一行设置右边框的所有属性



定义和用法
borderRight 属性在一个声明中为右边框设置所有属性。
语法：
Object.style.borderRight=borderWidth borderStyle borderColor
可能的值：
值	描述	值
borderWidth	设置边框的宽度。	
thin
medium
thick
length
borderStyle	设置边框的样式。	
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
borderColor	设置边框的颜色。	
color-name
color-rgb
color-hex
transparent
实例
本例改变右边框的宽度、样式和颜色：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000
}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderRight="thick solid #0000FF";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change right border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderRight - 改变右边框的宽度、样式和颜色■◆718■设置右边框的颜色                        简化命令：．右框色■．右框色■设置右边框的颜色



定义和用法
borderRightColor 属性设置右边框的颜色。
语法：
Object.style.borderRightColor=color-name|color-rgb|color-hex|transparent
实例
本例改变右边框的颜色：
<html>
<head>
<style type="text/css">
p
{
border: thick solid #FF0000;
}
</style>
<script type="text/javascript">
function changeBorderColor()
{
document.getElementById("p1").style.borderRightColor="#0000FF";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderColor()"
value="Change right border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderRightColor - 改变右边框的颜色■◆718■设置右边框的样式                        简化命令：．右框样式■．右框样式■设置右边框的样式



定义和用法
borderRightStyle 属性设置右边框的样式。
语法：
Object.style.borderRightStyle=style
可能的值：
值	描述
none	定义无边框。
hidden	与 "none" 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。
dotted	定义点状边框。在大多数浏览器中呈现为实线。
dashed	定义虚线。在大多数浏览器中呈现为实线。
solid	定义实线。
double	定义双线。双线的宽度等于 border-width 的值。
groove	定义 3D 凹槽边框。其效果取决于 border-color 的值。
ridge	定义 3D 垄状边框。其效果取决于 border-color 的值。
inset	定义 3D inset 边框。其效果取决于 border-color 的值。
outset	定义 3D outset 边框。其效果取决于 border-color 的值。
实例
本例改变右边框的样式：
<html>
<head>
<style type="text/css">
p
{
border: thick solid #FF0000;
}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderRightStyle="dotted";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change right border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderRightStyle - 改变右边框的样式■◆718■设置右边框的宽度                        简化命令：．右框宽■．右框宽■设置右边框的宽度



定义和用法
borderRightWidth 属性设置元素的右边框的宽度。
语法：
Object.style.borderRightWidth=thin|medium|thick|length
Possible Values
值	描述
thin	定义细的下边框。
medium	默认。定义中等的下边框。
thick	定义粗的下边框。
length	允许您自定义下边框的宽度。
实例
本例改变右边框的宽度：
<html>
<head>
<style type="text/css">
p
{
border: thin solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorderWidth()
{
document.getElementById("p1").style.borderRightWidth="thick";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderWidth()"
value="Change right border width" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderRightWidth - 改变右边框的宽度■◆718■设置所有四个边框的样式                  简化命令：．边框样式■．边框样式■设置所有四个边框的样式 (可设置四种样式)



定义和用法
borderStyle 属性在一行声明中为所有四个设置或返回边框样式。
该属性可使用 1 到 4 种样式。
语法：
Object.style.borderStyle=style
可能的值：
值	描述
none	定义无边框。
hidden	与 "none" 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。
dotted	定义点状边框。在大多数浏览器中呈现为实线。
dashed	定义虚线。在大多数浏览器中呈现为实线。
solid	定义实线。
double	定义双线。双线的宽度等于 border-width 的值。
groove	定义 3D 凹槽边框。其效果取决于 border-color 的值。
ridge	定义 3D 垄状边框。其效果取决于 border-color 的值。
inset	定义 3D inset 边框。其效果取决于 border-color 的值。
outset	定义 3D outset 边框。其效果取决于 border-color 的值。
实例
本例改变边框的样式：
<html>
<head>
<style>
p
{ 
border: thick solid #FF0000
}
</style>

<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderStyle="dotted double";
}
</script>

</head>
<body>

<form>
<input type="button" onclick="changeBorder()" 
value="Change paragraph border style" />
</form>

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
改变边框的样式■◆718■在一行设置顶边框的所有属性              简化命令：．顶边框■．顶边框■在一行设置顶边框的所有属性



定义和用法
borderTop 属性在一行声明中为上边框设置所有的属性。
语法：
Object.style.borderTop=borderWidth borderStyle borderColor
可能的值：
值	描述	值
borderWidth	设置边框的宽度。	
thin
medium
thick
length
borderStyle	设置边框的样式。	
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
borderColor	设置边框的颜色。	
color-name
color-rgb
color-hex
transparent
实例
本例改变上边框的宽度、样式和颜色：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000
}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderTop="thick solid #0000FF";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change top border" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderTop - 改变上边框的宽度、样式和颜色■◆718■设置顶边框的颜色                        简化命令：．顶框色■．顶框色■设置顶边框的颜色



定义和用法
borderTopColor 属性设置元素上边框的颜色。
语法：
Object.style.borderTopColor=color-name|color-RGB|color-hex
实例
本例改变段落的上边框的颜色：
<html>
<head>
<style type="text/css">
p
{ 
border: thick solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorderColor()
{
document.getElementById("p1").style.borderTopColor="#0000FF";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderColor()" 
value="Change paragraph border color" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderTopColor - 改变段落的上边框的颜色■◆718■设置顶边框的样式                        简化命令：．顶框样式■．顶框样式■设置顶边框的样式



定义和用法
borderTopStyle 属性设置元素的上边框的样式。
语法：
Object.style.borderTopStyle=style
可能的值：
值	描述
none	定义无边框。
hidden	与 "none" 相同。不过应用于表时除外，对于表，hidden 用于解决边框冲突。
dotted	定义点状边框。在大多数浏览器中呈现为实线。
dashed	定义虚线。在大多数浏览器中呈现为实线。
solid	定义实线。
double	定义双线。双线的宽度等于 border-width 的值。
groove	定义 3D 凹槽边框。其效果取决于 border-color 的值。
ridge	定义 3D 垄状边框。其效果取决于 border-color 的值。
inset	定义 3D inset 边框。其效果取决于 border-color 的值。
outset	定义 3D outset 边框。其效果取决于 border-color 的值。
实例
本例更改段落的上边框的样式：
<html>
<head>
<style type="text/css">
p
{
border: thick solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorder()
{
document.getElementById("p1").style.borderTopStyle="dotted";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorder()"
value="Change border style" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderTopStyle - 改变上边框的样式■◆718■设置顶边框的宽度                        简化命令：．顶框宽■．顶框宽■设置顶边框的宽度



定义和用法
borderTopWidth 属性设置元素的上边框的宽度。
语法：
Object.style.borderTopWidth=thin|medium|thick|length
可能的值：
值	描述
thin	定义细的下边框。
medium	默认。定义中等的下边框。
thick	定义粗的下边框。
length	允许您自定义下边框的宽度。
实例
下面的例子改变了上边框的宽度：
<html>
<head>
<style type="text/css">
p
{
border: thin solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorderWidth()
{
document.getElementById("p1").style.borderTopWidth="thick";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderWidth()"
value="Change border width" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderTopWidth - 改变上边框的宽度■◆718■设置所有四条边框的宽度                  简化命令：．边框宽度■．边框宽度■设置所有四条边框的宽度 (可设置四种宽度)


定义和用法
borderWidth 属性设置所有四个边框的宽度。
该属性可使用 1 到 4 个值：
如果规定一个值，比如 div {border-width: thick} - 所有四个边框都是粗线。
如果规定两个值，比如 div {border-width: thick thin} - 上下边框是粗线，而左右边框是细线。
如果规定三个值，比如 div {border-width: thick thin medium}- 上边框是粗线，左右边框是细线，下边框是中等 (medium) 的宽度。
如果规定四个值，比如 div {border-width: thick thin medium 10px} - 上边框是粗线，右边框是细线，下边框是中等的宽度，而左边框是 10px 的宽度。
语法：
Object.style.borderWidth=thin|medium|thick|length
可能的值：
值	描述
thin	定义细的下边框。
medium	默认。定义中等的下边框。
thick	定义粗的下边框。
length	允许您自定义下边框的宽度。
实例
本例改变边框的宽度：
<html>
<head>
<style type="text/css">
p
{
border: thin solid #FF0000
}
</style>
<script type="text/javascript">
function changeBorderWidth()
{
document.getElementById("p1").style.borderWidth="thick thin";
}
</script>
</head>
<body>

<input type="button" onclick="changeBorderWidth()"
value="Change border widths" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
borderWidth - 改变所有四个边框的宽度■◆718■设置元素的边距                          简化命令：．边距■．边距■设置元素的边距 (可设置四个值)



定义和用法
margin 属性设置元素的外边距。
该属性可使用 1 到 4 个值：
如果规定一个值，比如 div {margin: 50px} - 所有的外边距都是 50 px
如果规定两个值，比如 div {margin: 50px 10px} - 上下外边距是 50px，左右外边距是 10 px。
如果规定三个值，比如 div {margin: 50px 10px 20px}- 上外边距是 50 px，而左右外边距是 10 px，下外边距是 20 px。
如果规定四个值，比如 div {margin: 50px 10px 20px 30px} - 上外边距是 50 px，右外边距是 10 px，下外边距是 20 px，左外边距是 30 px。
语法：
Object.style.margin=margin
可能的值：
值	描述
margin	
设置外边距。
值可以是：
百分比（基于父对象总高度或宽度的百分比）
长度值（定义一个固定的边距）
auto（浏览器设定的值）。
实例
下面的例子改变了段落的外边距：
<html>
<head>
<script type="text/javascript">
function changeMargin()
{
document.getElementById("p1").style.margin="100px";
}
</script>
</head>
<body>

<input type="button" onclick="changeMargin()"
value="Change margins of a paragraph" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
margin - 改变段落的外边距■◆718■设置元素的底边距                        简化命令：．底边距■．底边距■设置元素的底边距



定义和用法
marginBottom 属性设置元素的下外边距。
语法：
Object.style.marginBottom=auto|length|%
可能的值：
值	描述
auto	浏览器设置的一个下外边距。
length	定义一个固定的下外边距。默认值是 0。
%	定义基于父对象总高度的百分比下外边距。
实例
本例改变段落的下外边距：
<html>
<head>
<script type="text/javascript">
function changeMargin()
{
document.getElementById("p1").style.marginBottom="32px";
}
</script>
</head>
<body>

<input type="button" onclick="changeMargin()" 
value="Change the bottom margin of a paragraph" />

<p>This is a paragraph</p>
<p id="p1">This is a paragraph</p>
<p>This is a paragraph</p>

</body>
</html>
TIY
marginBottom - 改变元素的下外边距■◆718■设置元素的左边距                        简化命令：．左边距■．左边距■设置元素的左边距




定义和用法
marginLeft 属性设置元素的左外边距。
语法：
Object.style.marginLeft=auto|length|%
可能的值：
值	描述
auto	浏览器设置的左外边距。
length	定义固定的左外边距。默认值是0。
%	定义基于父对象总高度的百分比左外边距。
实例
本例更改了段落的左外边距：
<html>
<head>
<script type="text/javascript">
function changeMargin()
{
document.getElementById("p1").style.marginLeft="32px";
}
</script>
</head>
<body>

<input type="button" onclick="changeMargin()" 
value="Change the left margin of a paragraph" />

<p>This is a paragraph</p>
<p id="p1">This is a paragraph</p>
<p>This is a paragraph</p>

</body>
</html>
TIY
marginLeft - 改变元素的左外边距■◆718■设置元素的右边据                        简化命令：．右边距■．右边距■设置元素的右边据



定义和用法
marginRight 属性设置元素的右外边距。
语法：
Object.style.marginRight=auto|length|%
可能的值
值	描述
auto	浏览器设置的外右边距。
length	定义固定的外右边距。默认值是 0。
%	定义基于父对象总高度的百分比外右边距。
实例
下面的例子改变了段落的右外边距：
<html>
<head>
<style type="text/css">
p
{ 
text-align: right
}
</style>
<script type="text/javascript">
function changeMargin()
{
document.getElementById("p1").style.marginRight="32px";
}
</script>
</head>
<body>

<input type="button" onclick="changeMargin()"
value="Change the right margin of a paragraph" />

<p>This is a paragraph</p>
<p id="p1">This is a paragraph</p>
<p>This is a paragraph</p>

</body>
</html>
TIY
marginRight - 改变段落的右外边距■◆718■设置元素的顶边距                        简化命令：．顶边距■．顶边距■设置元素的顶边距



定义和用法
marginTop 属性设置元素的上外边距。
语法：
Object.style.marginTop=auto|length|%
可能的值
值	描述
auto	浏览器设置的上外边距。
length	定义固定的上外边距。默认值是 0。
%	定义基于父对象总高度的百分比上外边距。
实例
本例改变段落的上外边距：
<html>
<head>
<script type="text/javascript">
function changeMargin()
{
document.getElementById("p1").style.marginTop="32px";
}
</script>
</head>
<body>

<input type="button" onclick="changeMargin()" 
value="Change the top margin of a paragraph" />

<p>This is a paragraph</p>
<p id="p1">This is a paragraph</p>
<p>This is a paragraph</p>

</body>
</html>
TIY
marginTop - 改变段落的上外边距■◆718■在一行设置所有的outline属性             简化命令：．轮廓■．轮廓■在一行设置所有的outline属性



定义和用法
outline 属性在一个声明中设置所有轮廓属性。
语法：
Object.style.outline = outlineWidth outlineStyle outlineColor
可能的值
值	描述	值
outlineWidth	设置轮廓的宽度。	
thin
medium
thick
length
outlineStyle	设置轮廓的样式。	
none
hidden
dotted
dashed
solid
double
groove
ridge
inset
outset
outlineColor	设置轮廓的颜色。	
color-name
color-rgb
color-hex
transparent
实例
下面的例子改变段落周围的轮廓：
<html>
<head>
<style type="text/css">
p
{
border: thin solid #00FF00;
outline: thick solid #FF0000;
}
</style>
<script type="text/javascript">
function changeOutline()
{
document.getElementById("p1").style.outline="thin dotted #0000FF";
}
</script>
</head>
<body>

<input type="button" onclick="changeOutline()"
value="Change outline" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
outline - 改变元素周围的轮廓（请在非 IE 浏览器中浏览）■◆718■设置围绕元素的轮廓颜色                  简化命令：．轮廓颜色■．轮廓颜色■设置围绕元素的轮廓颜色



定义和用法
outlineColor 属性设置元素周围的轮廓的颜色。
语法：
Object.style.outlineColor=color-name|color-rgb|color-hex
实例
本例改变轮廓的颜色：
<html>
<head>
<style type="text/css">
p
{
border: thin solid #00FF00;
outline: thick solid #FF0000;
}
</style>
<script type="text/javascript">
function changeOutlineColor()
{
document.getElementById("p1").style.outlineColor="#00FF00";
}
</script>
</head>
<body>

<input type="button" onclick="changeOutlineColor()"
value="Change outline color" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
outlineColor - 改变围绕元素的轮廓的颜色（请在非 IE 浏览器中浏览）■◆718■设置围绕元素的轮廓样式                  简化命令：．轮廓样式■．轮廓样式■设置围绕元素的轮廓样式



定义和用法
outlineStyle 属性设置围绕元素的轮廓的样式。
语法：
Object.style.outlineStyle=style
可能的值
值	描述
none	默认。定义无轮廓。
dotted	定义一个点状的轮廓。
dashed	定义一个虚线轮廓。
solid	定义一个实线轮廓。
double	定义一个双线轮廓。双线的宽度等同于 outline-width 的值。
groove	定义一个 3D 凹槽轮廓。此效果取决于 outline-color 值。
ridge	定义一个 3D 凸槽轮廓。此效果取决于 outline-color 值。
inset	定义一个 3D 凹边轮廓。此效果取决于 outline-color 值。
outset	定义一个 3D 凸边轮廓。此效果取决于 outline-color 值。
实例
下面的例子改变轮廓的样式：
<html>
<head>
<style type="text/css">
p
{
border: thin solid #00FF00;
outline: thick solid #FF0000;
}
</style>
<script type="text/javascript">
function changeOutline()
{
document.getElementById("p1").style.outlineStyle="dotted";
}
</script>
</head>
<body>

<input type="button" onclick="changeOutline()"
value="Change outline style" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
outlineStyle - 改变围绕元素的轮廓的样式（请在非 IE 浏览器中浏览）■◆718■设置围绕元素的轮廓宽度                  简化命令：．轮廓宽度■．轮廓宽度■设置围绕元素的轮廓宽度



定义和用法
outlineWidth 属性设置围绕元素的轮廓的宽度。
语法：
Object.style.outlineWidth=thin|medium|thick|length
可能的值
值	描述
thin	定义细轮廓。
medium	默认。定义中等的轮廓。
thick	定义粗的轮廓。
length	允许您定义轮廓粗细的值。
实例
本例改变轮廓的宽度：
<html>
<head>
<style type="text/css">
p
{
border: thin solid #00FF00;
outline: thick solid #FF0000;
}
</style>
<script type="text/javascript">
function changeOutlineWidth()
{
document.getElementById("p1").style.outlineWidth="thin";
}
</script>
</head>
<body>

<input type="button" onclick="changeOutlineWidth()"
value="Change outline width" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
outlineWidth - 改变围绕元素的轮廓的宽度（请在非 IE 浏览器中浏览）■◆718■设置元素的内边距填充                    简化命令：．填充■．填充■设置元素的填充 (可设置四个值)


定义和用法
padding 属性设置元素的内边距。
padding 属性定义元素边框与元素内容之间的空间。
该属性可采取 4 个值：
如果规定一个值，比如 div {padding: 50px} - 所有四个边的 padding 都是 50 px。
如果规定两个值，比如 div {padding: 50px 10px} - 上下内边距是 50 px，左右内边距是 10 px。
如果规定三个值，比如 div {padding: 50px 10px 20px} - 上内边距是 50 px，左右内边距是 10 px，下内边距是 20 px。
如果规定四个值，比如 div {padding: 50px 10px 20px 30px} - 上内边距是 50 px，右内边距是 10 px，下内边距是 20 px，左内边距是 30 px。
语法：
Object.style.padding=padding
Possible Values
值	描述
padding	
设置内边距。
值可以是：
百分比（基于父对象总高度或宽度的百分比）
长度值（定义一个固定的边距）
auto（浏览器设定的值）。
实例
本例改变元素的内边距：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000;
}
</style>
<script type="text/javascript">
function changePadding()
{
document.getElementById("p1").style.padding="2cm";
}
</script>
</head>
<body>

<input type="button" onclick="changePadding()"
value="Change padding" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
padding - 改变元素的内边距■◆718■设置元素的下填充                        简化命令：．下填充■．下填充■设置元素的下填充



定义和用法
paddingBottom 属性设置元素的下内边距。
padding 属性定义元素边框与元素内容之间的空间。
语法：
Object.style.paddingBottom=length|%
可能的值
值	描述
length	定义固定的下内边距值。默认值是 0。
%	定义基于父元素高度的百分比下内边距。此值不会如预期的那样工作于所有的浏览器中。
实例
下面的例子改变元素的下内边距：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000;
}
</style>
<script type="text/javascript">
function changePadding()
{
document.getElementById("p1").style.paddingBottom="2cm";
}
</script>
</head>
<body>

<input type="button" onclick="changePadding()"
value="Change bottom padding" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
paddingBottom - 改变元素的下内边距■◆718■设置元素的左填充                        简化命令：．左填充■．左填充■设置元素的左填充



定义和用法
paddingLeft 属性设置元素的左内边距。
padding 属性定义元素边框与元素内容之间的空间。
语法：
Object.style.paddingLeft=length|%
可能的值
值	描述
length	定义固定的下内边距值。默认值是 0。
%	定义基于父元素高度的百分比下内边距。此值不会如预期的那样工作于所有的浏览器中。
实例
本例改变元素的左内边距：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000;
}
</style>
<script type="text/javascript">
function changePadding()
{
document.getElementById("p1").style.paddingLeft="2cm";
}
</script>
</head>
<body>

<input type="button" onclick="changePadding()"
value="Change left padding" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
paddingLeft - 改变元素的左内边距■◆718■设置元素的右填充                        简化命令：．右填充■．右填充■设置元素的右填充



定义和用法
paddingRight 属性设置元素的右内边距。
padding 属性定义元素边框与元素内容之间的空间。
语法：
Object.style.paddingRight=auto|length|%
可能的值
值	描述
length	定义固定的下内边距值。默认值是 0。
%	定义基于父元素高度的百分比下内边距。此值不会如预期的那样工作于所有的浏览器中。
实例
本例改变元素的右内边距：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000;
}
</style>
<script type="text/javascript">
function changePadding()
{
document.getElementById("p1").style.paddingRight="2cm";
}
</script>
</head>
<body>

<input type="button" onclick="changePadding()"
value="Change right padding" />

<p id="p1">This is a paragraph. This is a paragraph.
This is a paragraph. This is a paragraph.
This is a paragraph. This is a paragraph.</p>

</body>
</html>
TIY
paddingRight - 改变元素的右内边距■◆718■设置元素的顶填充                        简化命令：．顶填充■．顶填充■设置元素的顶填充



定义和用法
padding 属性设置元素的上内边距。
padding 属性定义元素边框与元素内容之间的空间。
语法：
Object.style.paddingTop=length|%
可能的值
值	描述
length	定义固定的下内边距值。默认值是 0。
%	定义基于父元素高度的百分比下内边距。此值不会如预期的那样工作于所有的浏览器中。
实例
本例改变元素的上内边距：
<html>
<head>
<style type="text/css">
p
{ 
border: thin dotted #FF0000;
}
</style>
<script type="text/javascript">
function changePadding()
{
document.getElementById("p1").style.paddingTop="2cm";
}
</script>
</head>
<body>

<input type="button" onclick="changePadding()"
value="Change top padding" />

<p id="p1">This is a paragraph</p>

</body>
</html>
TIY
paddingTop - 改变元素的上内边距■◆718■设置在元素的哪边不允许其他的浮动元素    简化命令：．排除浮动■．排除浮动■设置在元素的哪边不允许其他的浮动元素



定义和用法
clear 属性设置一个元素的侧面是否允许其他的浮动元素。
语法：
Object.style.clear=left|right|both|none
可能的值
值	描述
left	在左侧不允许浮动元素
right	在右侧不允许浮动元素
both	在左右两侧均不允许浮动元素
none	默认。允许浮动元素出现在两侧。
实例
本例不允许文本左边的浮动元素：
<html>
<head>
<style type="text/css">
img 
{
float:left;
}
</style>
<script type="text/javascript">
function clearLeft()
{
document.getElementById("p1").style.clear="left";
}
</script>
</head>
<body>

<img src="logocss.gif" width="95" height="84" />

<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<input type="button" onclick="clearLeft()"
value="Clear left side of text" />

</body>
</html>
TIY
清除文本左边的浮动元素■◆718■设置元素的形状                          简化命令：．裁剪■．裁剪■设置元素的形状



定义和用法
clip 属性设置元素的形状。
当图像大于它所在的元素时会发生什么？"clip" 属性允许你规定元素的可见尺寸，以及元素被裁剪和显示的形状。
语法：
Object.style.clip=rect(top,right,bottom,left)|auto
可能的值
值	描述
rect(top,right,bottom,left)	设置元素的形状。
auto	浏览器设置元素的形状。
提示和注释
注释：该属性不能用于 "overflow" 设置为 "visible" 的元素。
实例
本例把图像裁剪为指定的形状：
<html>
<head>
<style type="text/css">
img
{
position:absolute;
top:100px;
}
</style>
<script type="text/javascript">
function clipImage()
{
document.getElementById("img1").style.clip="rect(0px,50px,50px,0px)";
}
</script>
</head>
<body>

<img id="img1" border="0" src="logocss.gif" width="95" height="84" />

<input type="button" onclick=clipImage() value="Clip image" />

</body>
</html>
TIY
把图像裁剪为指定的形状■◆718■设置元信息                              简化命令：．元信息■．元信息■设置元信息



定义和用法
content 属性设置文本或图像出现（浮动）在另一个元素中的什么地方。
语法：
Object.style.content=value
可能的值
值	描述
string	定义文本内容。
url	定义 url。
counter(name)
counter(name, list-style-type)
counters(name, string)
counters(name, string, list-style-type)
 
attr(X)	定义显示在该选择器之前或之后的选择器的属性。
open-quote	 
close-quote	 
no-open-quote	 
no-close-quote	 
提示和注释
注释：如果在一行中对于浮动元素而言空间太少，则这个元素会跳到下一行，这个过程会持续到有足够空间的一行为止。
注释：行内元素的内容、背景和边框应该出现在浮动元素之前。块级元素的背景和边框应当出现在浮动元素之后，但是块级元素的内容应当在浮动元素的前面。
实例
本例设置图像浮动于左边：
<html>
<head>
<script type="text/javascript">
function setFloatLeft()
{
document.getElementById("img1").style.cssFloat="left";
}
</script>

</head>
<body>

<img id="img1" src="logocss.gif" width="95" height="84" />

<p>This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<form>
<input type="button" onclick="setFloatLeft()" value="Set image to float left" />
</form>

</body>
</html>
TIY
设置图像浮动于文字的左边■◆718■设置其后是正数的计数器名称的列表        简化命令：．计数器增量■．计数器增量■设置其后是正数的计数器名称的列表。其中整数指示每当元素出现时计数器的增量。默认是1。■◆718■设置其后是正数的计数器名称的列表        简化命令：．计数器值■．计数器值■设置其后是正数的计数器名称的列表。其中整数指示每当元素出现时计数器被设置的值。默认是0。■◆718■设置图像文本出现(浮动)另一元素的何处    简化命令：．浮动■．浮动■设置图像或文本将出现（浮动）在另一元素中的何处。



定义和用法
设置文本或图像出现（浮动）在另一个元素中的什么地方。
语法：
Object.style.cssFloat=left|right|none
可能的值
值	描述
left	图像或文本浮动在父元素的左边。
right	图像或文本浮动在父元素的右边。
none	图像或文本浮动显示在它在父元素中出现的位置。
提示和注释
注释：如果在一行中对于浮动元素而言空间太少，则这个元素会跳到下一行，这个过程会持续到有足够空间的一行为止。
实例
本例设置图像浮动于左边：
<html>
<head>
<script type="text/javascript">
function setFloat()
{
document.getElementById("img1").style.cssFloat="left";
}
</script>
</head>
<body>

<img id="img1" src="logocss.gif" />

<p>This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<input type="button" onclick="setFloat()"
value="Set image to float to the left" />

</body>
</html>
TIY
cssFloat - 设置图像浮动于文字的左边（请在非 IE 浏览器中查看）■◆718■设置显示的指针类型                      简化命令：．鼠标样式■．鼠标样式■设置显示的指针类型



定义和用法
cursor 属性规定所显示的指针（光标）的类型。
语法：
Object.style.cursor=cursortype
可能的值
值	描述
url	
需被使用的自定义光标的URL
注释：请在此列表的末端始终定义一种普通的光标，以防没有由 URL 定义的可用光标。
default	默认光标（通常是一个箭头）
auto	默认。浏览器设置的光标。
crosshair	光标呈现为十字线。
pointer	光标呈现为指示链接的指针（一只手）
move	此光标指示某对象可被移动。
e-resize	此光标指示矩形框的边缘可被向右（东）移动。
ne-resize	此光标指示矩形框的边缘可被向上及向右移动（北/东）。
nw-resize	此光标指示矩形框的边缘可被向上及向左移动（北/西）。
n-resize	此光标指示矩形框的边缘可被向上（北）移动。
se-resize	此光标指示矩形框的边缘可被向下及向右移动（南/东）。
sw-resize	此光标指示矩形框的边缘可被向下及向左移动（南/西）。
s-resize	此光标指示矩形框的边缘可被向下移动（北/西）。
w-resize	此光标指示矩形框的边缘可被向左移动（西）。
text	此光标指示文本。
wait	此光标指示程序正忙（通常是一只表或沙漏）。
help	此光标指示可用的帮助（通常是一个问号或一个气球）。
实例
本例改变指针：
<html>
<head>
<script type="text/javascript">
function changeCursor()
{
document.body.style.cursor="crosshair";
document.getElementById("p1").style.cursor="text";
}
</script>
</head>
<body>

<p id="p1">This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text.</p>

<input type="button" onclick="changeCursor()"
value="Change cursor" />

</body>
</html>
TIY■◆718■设置元素的文本方向                      简化命令：．文字方向■．文字方向■设置元素的文本方向



定义和用法
direction 属性设置元素的文本方向。
语法：
Object.style.direction=ltr|rtl|inherit
Possible Values
值	描述
ltr	默认。内容从左向右流动。
rtl	内容从右向左流动。
inherit	内容流动从父元素继承。
实例
本例把文本设置为从右向左流动：
<html>
<head>
<script type="text/javascript">
function changeTextDirection()
{
document.getElementById("p1").style.direction="rtl";
}
</script>
</head>
<body>

<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<input type="button" onclick="changeTextDirection()" 
value="Set text to flow right to left" />

</body>
</html>
TIY
direction - 把文本设置为从右向左流动■◆718■设置元素如何被显示                      简化命令：．显示■．显示■设置元素如何被显示



定义和用法
display 属性设置元素如何显示。
语法：
Object.style.display=value
Possible Values
值	描述
none	此元素不会被显示。
block	此元素将显示为块级元素，此元素前后会带有换行符。
inline	默认。此元素会被显示为内联元素，元素前后没有换行符。
list-item	此元素会作为列表显示。
run-in	此元素会根据上下文作为块级元素或内联元素显示。
compact	此元素会根据上下文作为块级元素或内联元素显示。
marker	
table	此元素会作为块级表格来显示（类似 <table>），表格前后带有换行符。
inline-table	此元素会作为内联表格来显示（类似 <table>），表格前后没有换行符。
table-row-group	此元素会作为一个或多个行的分组来显示（类似 <tbody>）。
table-header-group	此元素会作为一个或多个行的分组来显示（类似 <thead>）。
table-footer-group	此元素会作为一个或多个行的分组来显示（类似 <tfoot>）。
table-row	此元素会作为一个表格行显示（类似 <tr>）。
table-column-group	此元素会作为一个或多个列的分组来显示（类似 <colgroup>）。
table-column	此元素会作为一个单元格列显示（类似 <col>）
table-cell	此元素会作为一个表格单元格显示（类似 <td> 和 <th>）
table-caption	此元素会作为一个表格标题显示（类似 <caption>）
实例
本例设置不显示元素：
<html>
<head>
<script type="text/javascript">
function removeElement()
{
document.getElementById("p1").style.display="none";
}
</script>
</head>
<body>

<h1>Hello</h1>

<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<input type="button" onclick="removeElement()"
value="Do not display paragraph" />

</body>
</html>
TIY
display - 设置不显示元素■◆718■设置元素的高度                          简化命令：．全高■．全高■设置元素的高度



定义和用法
height 属性设置元素的高度。
语法：
Object.style.height=auto|length|%
可能的值
值	描述
auto	默认。浏览器会计算出实际的高度。
length	使用 px、cm 等单位定义高度。
%	基于其包含块的百分比高度。
实例
本例设置按钮的高度：
<html>
<head>
<script type="text/javascript">
function setHeight()
{
document.getElementById("b1").style.height="50px";
}
</script>
</head>
<body>

<input type="button" id="b1" onclick="setHeight()"
value="Change height of button to 50 px" />

</body>
</html>
TIY
height - 设置元素的高度■◆718■设置principalbox距离其最近的边框边缘的距离简化命令：．最近距离■．最近距离■设置marker box的principal box距离其最近的边框边缘的距离■◆718■设置是否cross marks或crop marks应仅仅被呈现于page box边缘之外简化命令：．是否之外■．是否之外■设置是否cross marks或crop marks应仅仅被呈现于page box边缘之外■◆718■设置元素的最大高度                      简化命令：．最大高度■．最大高度■设置元素的最大高度



定义和用法
maxHeight 属性设置元素的最大高度。
语法：
Object.style.maxHeight=length|%
可能的值
值	描述
length	定义元素的最大高度值。
%	定义基于其包含块的百分比最大高度。
实例
本例设置元素框的最大高度：
<html>
<head>
<script type="text/javascript">
function setMaxHeight()
{
document.getElementById("p1").style.maxHeight="10px";
}
</script>
</head>
<body>

<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<input type="button" onclick="setMaxHeight()"
value="Set max height" />

</body>
</html>
TIY
maxHeight - 设置元素框的最大高度■◆718■设置元素的最大宽度                      简化命令：．最大宽度■．最大宽度■设置元素的最大宽度



定义和用法
maxWidth 属性设置元素的最大宽度。
语法：
Object.style.maxWidth=length|%
可能的值
值	描述
length	定义元素的最大宽度值。
%	定义基于其包含块的百分比最大宽度。
实例
本例设置元素框的最大宽度：
<html>
<head>
<script type="text/javascript">
function setMaxWidth()
{
document.getElementById("p1").style.maxWidth="10px";
}
</script>
</head>
<body>

<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<input type="button" onclick="setMaxWidth()"
value="Set max width" />

</body>
</html>
TIY
maxWidth - 设置元素框的最大宽度■◆718■设置元素的最小高度                      简化命令：．最小高度■．最小高度■设置元素的最小高度



定义和用法
minHeight 属性设置元素的最小高度。
语法：
Object.style.minHeight=length|%
可能的值
值	描述
length	定义元素的最小高度值。
%	定义基于其包含块的百分比最小高度。
实例
本例设置元素框的最小高度：
<html>
<head>
<script type="text/javascript">
function setMinHeight()
{
document.getElementById("p1").style.minHeight="200px";
}
</script>
</head>
<body>

<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<input type="button" onclick="setMinHeight()"
value="Set min height" />

</body>
</html>
TIY
minHeight - 设置元素框的最小高度■◆718■设置元素的最小宽度                      简化命令：．最小宽度■．最小宽度■设置元素的最小宽度



定义和用法
minWidth 属性设置元素框的最小宽度。
语法：
Object.style.minWidth=length|%
可能的值
值	描述
length	定义元素的最小宽度值。
%	定义基于其包含块的百分比最小宽度。
实例
本例设置元素框的最小宽度：
<html>
<head>
<script type="text/javascript">
function setMinWidth()
{
document.getElementById("p1").style.minWidth="1000px";
}
</script>
</head>
<body>

<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<input type="button" onclick="setMinWidth()" value="Set min width" />

</body>
</html>
TIY
minWidth - 设置元素框的最小宽度■◆718■规定如何处理不适合元素盒的内容          简化命令：．溢出处理■．溢出处理■规定如何处理不适合元素盒的内容



定义和用法
overflow 属性规定如何处理如何处理不符合元素框的内容。
语法：
Object.style.overflow=visible|hidden|scroll|auto
可能的值
值	描述
visible	内容不会被修剪，会呈现在元素框之外。
hidden	内容会被修剪，但是浏览器不会显示供查看内容的滚动条。
scroll	内容会被修剪，但是浏览器会显示滚动条以便查看其余的内容。
auto	由浏览器决定如何显示。如果需要，则显示滚动条。
实例
本例使用 overflow 来显示溢出元素框的内容：
<html>
<head>
<style type="text/css">
div
{
border:thin solid green;
width:100px;
height:100px;
}
</style>
<script type="text/javascript">
function hideOverflow()
{
document.getElementById("div1").style.overflow="hidden";
}
</script>
</head>
<body>

<div id="div1">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<br />
<input type="button" onclick="hideOverflow()"
value="Hide overflow" />

</body>
</html>
TIY
overflow - 隐藏内容溢出■◆718■设置对元素中的内容进行垂直排列          简化命令：．垂直对齐■．垂直对齐■设置对元素中的内容进行垂直排列



定义和用法
verticalAlign 属性设置内容在元素框中的垂直对齐方式。
语法：
Object.style.verticalAlign=value
可能的值
值	描述
baseline	默认。元素放置在父元素的基线上。
sub	垂直对齐文本的下标。
super	垂直对齐文本的上标
top	把元素的顶端与行中最高元素的顶端对齐
text-top	把元素的顶端与父元素字体的顶端对齐
middle	把此元素放置在父元素的中部。
bottom	把元素的顶端与行中最低的元素的顶端对齐。
text-bottom	把元素的底端与父元素字体的底端对齐。
length	 
%	使用 "line-height" 属性的百分比值来排列此元素。允许使用负值。
实例
本例设置表格中文本的垂直对齐方式：
<html>
<head>
<script type="text/javascript">
function alignText()
{
document.getElementById("td1").style.verticalAlign="bottom";
}
</script>
</head>
<body>

<table border="1" height="100px">
  <tr>
    <td id="td1">
    Some example text
    </td> 
  </tr>
</table>
<br />
<input type="button" onclick="alignText()"
value="Align text" />

</body>
</html>
TIY
verticalAlign - 垂直对齐表格中的文本■◆718■设置元素是否可见                        简化命令：．可见方式■．可见方式■设置元素是否可见




定义和用法
visibility 属性设置元素是否可见。
语法：
Object.style.visibility=visible|hidden|collapse
可能的值
值	描述
visible	默认。元素框是可见的。
hidden	元素框不可见，但仍然影响布局。
collapse	当在表格元素中使用时，此值可删除一行或一列，但是它不会影响表格的布局。被行或列占据的空间会留给其他内容使用。如果此值被用在其他的元素上，会呈现为 "hidden"。
实例
下面的例子隐藏一段文本：
<html>
<head>
<script type="text/javascript">
function changeVisibility()
{
document.getElementById("p1").style.visibility="hidden";
}
</script>

</head>
<body>

<p id="p1">This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.</p>

<form>
<input type="button" onclick="changeVisibility()"
value="Hide paragraph" />
</form>

</body>
</html>
TIY
visibility - 隐藏一段文本■◆718■设置元素的宽度                          简化命令：．全宽■．全宽■设置元素的宽度




定义和用法
width 属性设置元素的宽度。
语法：
Object.style.width=auto|length|%
可能的值
值	描述
auto	默认。浏览器可计算出实际的宽度。
%	定义基于其包含块的百分比宽度。
length	使用 px、cm 等单位定义宽度。
实例
本例设置按钮的宽度：
<html>
<head>
<script type="text/javascript">
function setWidth()
{
document.getElementById("b1").style.width="300px";
}
</script>
</head>
<body>

<input type="button" id="b1" onclick="setWidth()"
value="Change width to 300 px" />

</body>
</html>
TIY
width - 设置元素的宽度■◆718■在一行设置列表的所有属性                简化命令：．列表属性■．列表属性■在一行设置列表的所有属性




定义和用法
listStyle 属性在一个声明中设置所有列表属性。
语法：
Object.style.listStyle=listStyleType listStylePosition listStyleImage
Possible Values
值	描述	值
listStyleType	
设置列表项标志的类型。
注释：并非右列中的所有值在所有浏览器中都有效。
none
disc
circle
square
decimal
decimal-leading-zero
lower-roman
upper-roman
lower-alpha
upper-alpha
lower-greek
lower-latin
upper-latin
hebrew
armenian
georgian
cjk-ideographic
hiragana
katakana
hiragana-iroha
katakana-iroha
listStylePosition	对列表项标志进行定位。	
outside
inside
listStyleImage	把图像设置为列表项标志。	
none
url(url)
实例
本例改变列表的类型：
<html>
<head>
<script type="text/javascript">
function changeList()
  {
  document.getElementById("ul1").style.listStyle="decimal inside";
  }
</script>
</head>
<body>

<ul id="ul1">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Water</li>
  <li>Soda</li>
</ul>

<input type="button" onclick="changeList()"
value="Change list style" />

</body>
</html>
TIY
listStyle - 改变列表的类型■◆718■把图像设置为列表项标记                  简化命令：．图像标记■．图像标记■把图像设置为列表项标记



定义和用法
listStyleImage 属性把图像设置为列表项标志。
语法：
Object.style.listStyleImage=url|none
可能的值
值	描述
url	图形的路径。
none	不会显示图像。
实例
下面的例子改变列表的列表项标志：
<html>
<head>
<script type="text/javascript">
function changeList()
{
document.getElementById("ul1").style.listStyleImage="url('blueb.gif')";
}
</script>
</head>
<body>

<ul id="ul1">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Water</li>
  <li>Soda</li>
</ul>

<input type="button" onclick="changeList()"
value="Change list-item marker" />

</body>
</html>
TIY
listStyleImage - 改变列表的列表项标志■◆718■改变列表项标记的位置                    简化命令：．内外标记■．内外标记■改变列表项标记的位置



定义和用法
listStylePosition 属性对列表中的列表项标记进行定位。
语法：
Object.style.listStylePosition=inside|outside
可能的值
值	描述
inside	列表项目标记放置在文本以内，且环绕文本根据标记对齐。
outside	默认。保持标记位于文本的左侧。列表项目标记放置在文本以外，且环绕文本不根据标记对齐。
实例
本例改变列表项标志的位置：
<html>
<head>
<script type="text/javascript">
function changeList()
{
document.getElementById("ul1").style.listStylePosition="inside";
}
</script>
</head>
<body>

<ul id="ul1">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Water</li>
  <li>Soda</li>
</ul>

<input type="button" onclick="changeList()"
value="Change list-item marker position" />

</body>
</html>
TIY
listStylePosition - 改变列表项标志的位置■◆718■设置列表项标记的类型                    简化命令：．标记类型■．标记类型■设置列表项标记的类型



定义和用法
listStyleType 属性设置列表项标志的类型。
语法：
Object.style.listStyleType=value
可能的值
CSS2 的值：
值	描述
none	无标记。
disc	默认。标记是实心圆。
circle	标记是空心圆。
square	标记是实心方块。
decimal	标记是数字。
decimal-leading-zero	0开头的数字标记。(01, 02, 03, 等。)
lower-roman	小写罗马数字(i, ii, iii, iv, v, 等。)
upper-roman	大写罗马数字(I, II, III, IV, V, 等。)
lower-alpha	小写英文字母The marker is lower-alpha (a, b, c, d, e, 等。)
upper-alpha	大写英文字母The marker is upper-alpha (A, B, C, D, E, 等。)
lower-greek	小写希腊字母(alpha, beta, gamma, 等。)
lower-latin	小写拉丁字母(a, b, c, d, e, 等。)
upper-latin	大写拉丁字母(A, B, C, D, E, 等。)
hebrew	传统的希伯来编号方式
armenian	传统的亚美尼亚编号方式
georgian	传统的乔治亚编号方式(an, ban, gan, 等。)
cjk-ideographic	简单的表意数字
hiragana	标记是：a, i, u, e, o, ka, ki, 等。（日文片假名）
katakana	标记是：A, I, U, E, O, KA, KI, 等。（日文片假名）
hiragana-iroha	标记是：i, ro, ha, ni, ho, he, to, 等。（日文片假名）
katakana-iroha	标记是：I, RO, HA, NI, HO, HE, TO, 等。（日文片假名）
CSS2.1 的值：
disc | circle | square | decimal | decimal-leading-zero | 
lower-roman | upper-roman | lower-greek | lower-latin | upper-latin | 
armenian | georgian | none | inherit
实例
本例改变列表项的类型：
<html>
<head>
<script type="text/javascript">
function changeList()
{
document.getElementById("ul1").style.listStyleType="square";
}
</script>
</head>
<body>

<ul id="ul1">
  <li>Coffee</li>
  <li>Tea</li>
  <li>Water</li>
  <li>Soda</li>
</ul>

<input type="button" onclick="changeList()"
value="Change list-item marker type" />

</body>
</html>
TIY
listStyleType - 改变列表项的类型■◆718■设置元素的底边缘距离父元素底边缘距离    简化命令：．底距离■．底距离■设置元素的底边缘距离父元素底边缘的之上或之下的距离



定义和用法
bottom 属性设置定位元素下外边距边界与其包含块下边界之间的偏移。
语法：
Object.style.bottom=auto|%|length
可能的值
值	描述
auto	默认。通过浏览器计算底部的位置。
%	设置元素的底边到最近一个具有定位设置父元素的底部边缘的百分比位置。
length	使用 px、cm 等单位设置元素的底边到最近一个具有定位设置父元素的底部边缘的位置。可使用负值。
提示和注释
Note:如果 "position" 属性的值为 "static"，那么设置 "bottom" 属性不会产生任何效果。
实例
本例对元素的下边进行设置：
<html>
<head>
<style type="text/css">
input
{
position:absolute;
}
</style>
<script type="text/javascript">
function setBottomEdge()
{
document.getElementById("b1").style.bottom="100px";
}
</script>
</head>
<body>

<input type="button" id="b1" onclick="setBottomEdge()"
value="Set bottom edge to 100 px" />

</body>
</html>
TIY
bottom - 对元素的下边进行设置■◆718■置元素的左边缘距离父元素左边缘距离      简化命令：．左距离■．左距离■置元素的左边缘距离父元素左边缘的左边或右边的距离



定义和用法
left 属性设置定位元素左外边距边界与其包含块左边界之间的偏移。
语法：
Object.style.left=auto|%|length
可能的值
值	描述
auto	默认。通过浏览器来计算左侧的位置。
%	设置元素的左边到最近一个具有定位设置父元素的左边缘的百分比位置。
length	使用 px、cm 等单位设置元素的左边到最近一个具有定位设置父元素的左边缘的位置。可使用负值。
提示和注释
注释：如果 "position" 属性的值为 "static"，那么设置 "left" 属性不会产生任何效果。
实例
下面的例子对按钮的左边进行设置：
<html>
<head>
<style type="text/css">
input
{
position:absolute;
}
</style>
<script type="text/javascript">
function setLeftEdge()
{
document.getElementById("b1").style.left="100px";
}
</script>
</head>
<body>

<input type="button" id="b1" onclick="setLeftEdge()"
value="Set left edge to 100 px" />

</body>
</html>
TIY
left - 对元素的左边进行设置■◆718■元素定位的类型或者说方式                简化命令：．定位类型■．定位类型■把元素放置在static, relative, absolute 或 fixed 的位置



定义和用法
position 属性把元素放置到一个静态的、相对的、绝对的、或固定的位置中。
语法：
Object.style.position=static|relative|absolute|fixed
可能的值
值	描述
static	默认。位置设置为 static 的元素，它始终会处于页面流给予的位置（static 元素会忽略任何 top、bottom、left 或 right 声明）。
relative	位置被设置为 relative 的元素，可将其移至相对于其正常位置的地方，因此 "left:20" 会将元素移至元素正常位置左边 20 个像素的位置。
absolute	位置设置为 absolute 的元素，可定位于相对于包含它的元素的指定坐标。此元素的位置可通过 "left"、"top"、"right" 以及 "bottom" 属性来规定。
fixed	位置被设置为 fixed 的元素，可定位于相对于浏览器窗口的指定坐标。此元素的位置可通过 "left"、"top"、"right" 以及"bottom" 属性来规定。不论窗口滚动与否，元素都会留在那个位置。工作于 IE7（strict 模式）。
实例
本例把元素位置由相对改为绝对：
<html>
<head>
<style type="text/css">
input
{
position:relative;
}
</style>
<script type="text/javascript">
function setPositionAbsolute()
{
document.getElementById("b1").style.position="absolute";
document.getElementById("b1").style.top="10px";
}
</script>
</head>
<body>

<p>This is an example paragraph</p>
<p>This is an example paragraph</p>

<input type="button" id="b1" onclick="setPositionAbsolute()"
value="Set button position to be absolute" />

</body>
</html>
TIY
position - 改变元素的位置■◆718■置元素的右边缘距离父元素右边缘距离      简化命令：．右距离■．右距离■置元素的右边缘距离父元素右边缘的左边或右边的距离





定义和用法
right 属性设置定位元素右外边距边界与其包含块右边界之间的偏移。
语法：
Object.style.right=auto|%|length
可能的值
值	描述
auto	默认。通过浏览器来计算右侧的位置。
%	设置元素的右边到最近一个具有定位设置父元素的右边缘的百分比位置。
length	使用 px、cm 等单位设置元素的右边到最近一个具有定位设置父元素的右边缘的位置。可使用负值。
提示和注释
注释：如果 "position" 属性的值为 "static"，那么设置 "right" 属性不会产生任何效果。
实例
本例对按钮的左边进行设置：
<html>
<head>
<style type="text/css">
input
{
position:absolute;
}
</style>
<script type="text/javascript">
function setRightEdge()
{
document.getElementById("b1").style.right="100px";
}
</script>
</head>
<body>

<input type="button" id="b1" onclick="setRightEdge()"
value="Set right edge to 100 px" />

</body>
</html>
TIY
right - 设置元素的右边界■◆718■设置元素的顶边缘距离父元素顶边缘距离    简化命令：．顶距离■．顶距离■设置元素的顶边缘距离父元素顶边缘的之上或之下的距离



定义和用法
top 属性设置一个定位元素的上外边距边界与其包含块上边界之间的偏移。
语法：
Object.style.top=auto|%|length
可能的值
值	描述
auto	默认。通过浏览器来计算顶部的位置。
%	设置元素的顶部到最近一个具有定位设置父元素的上边缘的百分比位置。
length	使用 px、cm 等单位设置元素的顶部到最近一个具有定位设置上边缘的顶部的位置。可使用负值。
提示和注释
注释：如果 "position" 属性的值为 "static"，那么设置 "top" 属性不会产生任何效果。
实例
本例设置元素的上边界：
<html>
<head>
<style type="text/css">
input
{
position:absolute;
}
</style>
<script type="text/javascript">
function setTopEdge()
{
document.getElementById("b1").style.top="100px";
}
</script>
</head>
<body>

<input type="button" id="b1" onclick="setTopEdge()"
value="Set top edge to 100 px" />

</body>
</html>
TIY
top - 设置元素的上边界■◆718■设置元素的堆叠次序                      简化命令：．堆叠次序■．堆叠次序■设置元素的堆叠次序


定义和用法
zIndex 属性设置元素的堆叠顺序。
该属性设置一个定位元素沿 z 轴的位置，z 轴定义为垂直延伸到显示区的轴。如果为正数，则离用户更近，为负数则表示离用户更远。
语法：
Object.style.zIndex=auto|number
可能的值
值	描述
auto	默认。堆叠顺序与父元素相等。
number	设置元素的堆叠顺序。
提示和注释
注释：元素可拥有负的 z-index 属性值。
注释：Z-index 仅能在定位元素上奏效（例如 position:absolute;）！
实例
本例改变元素的堆叠顺序：
<html>
<head>
<style type="text/css">
#img1
{
position:absolute;
left:0px;
top:0px;
z-index:-1
}
</style>
<script type="text/javascript">
function changeStackOrder()
{
document.getElementById("img1").style.zIndex="1";
}
</script>
</head>
<body>

<h1>This is a Heading</h1>

<img id="img1" src="bulbon.gif" width="100" height="180">

<p>Default z-index is 0. Z-index -1 has lower priority.</p>

<input type="button" onclick="changeStackOrder()"
value="Change stack order" />

</body>
</html>
TIY
zIndex - 改变元素的堆叠顺序■◆718■设置段落留到页面底部的最小行数          简化命令：．最小行数■．最小行数■设置段落留到页面底部的最小行数■◆718■设置显示某元素时使用的页面类型          简化命令：．页面类型■．页面类型■设置显示某元素时使用的页面类型■◆718■设置某元素之后的分页行为                简化命令：．分页行为■．分页行为■设置某元素之后的分页行为


定义和用法
pageBreakAfter 属性设置元素后否应当放置分页符。
语法：
Object.style.pageBreakAfter=auto|always|avoid|left|right
可能的值
值	描述
auto	默认。如果必要则在元素后插入分页符。
always	在元素后插入分页符。
avoid	避免在元素后插入分页符。
left	在元素之后足够的分页符，一直到一张空白的左页为止。
right	在元素之后足够的分页符，一直到一张空白的右页为止。
实例
本例在 id 为 p1 的段落之后设置了一个 page-break：
<html>
<head>
<script type="text/javascript">
function setPageBreak()
{
document.getElementById("p1").style.pageBreakAfter="always";
}
</script>
</head>
<body>

<p id="p1">This is a test paragraph.</p>

<input type="button" onclick="setPageBreak()"
value="Set page-break" />

<p>This is also a test paragraph.</p>

</body>
</html>■◆718■设置某元素之前的分页行为                简化命令：．前分页■．前分页■设置某元素之前的分页行为



定义和用法
pageBreakBefore 属性声明一个元素前是否应当放置分页符。
语法：
Object.style.pageBreakBefore=auto|always|avoid|left|right
可能的值
值	描述
auto	默认。如果必要则在元素前插入分页符。
always	在元素前插入分页符。
avoid	避免在元素前插入分页符。
left	在元素之前足够的分页符，一直到一张空白的左页为止。
right	在元素之前足够的分页符，一直到一张空白的右页为止。
实例
本例在 id 为 p2 的段落之前设置一个 page-break：
<html>
<head>

<script type="text/javascript">
function setPageBreak()
{
document.getElementById("p2").style.pageBreakBefore="always";
}
</script>
</head>
<body>

<p>This is a test paragraph.</p>

<input type="button" onclick="setPageBreak()"
value="Set page-break" />

<p id="p2">This is also a test paragraph.</p>

</body>
</html>■◆718■设置某元素内部的分页行为                简化命令：．内分页■．内分页■设置某元素内部的分页行为



定义和用法
pageBreakInside 声明一个元素内部是否应当放置分页符。
语法：
Object.style.pageBreakInside=auto|avoid
可能的值
值	描述
auto	默认。如果必要则在元素内部插入分页符。
avoid	避免在元素内部插入分页符。
实例
本例避免在 id 为 p2 的段落中的 page-break：
<html>
<head>
<script type="text/javascript">
function setPageBreak()
{
document.getElementById("p2").style.pageBreakInside="avoid";
}
</script>
</head>
<body>

<p>This is a test paragraph.</p>

<input type="button" onclick="setPageBreak()"
value="Set page to not break inside the second paragraph" />

<p id="p2">This is also a test paragraph. We need some
more text here. This is just filler text.</p>

</body>
</html>■◆718■设置页面的方向和尺寸                    简化命令：．尺寸■．尺寸■设置页面的方向和尺寸■◆718■设置段落必须留到页面顶部的最小行数      简化命令：．顶部最小行数■．顶部最小行数■设置段落必须留到页面顶部的最小行数■◆718■设置表格边框是否合并为单边框或者分离    简化命令：．两框间■．两框间■设置表格边框是否合并为单边框，或者像在标准的HTML中那样分离。



定义和用法
borderCollapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示。
语法：
Object.style.borderCollapse=collapse|separate
可能的值
值	描述
separate	边框会被分开。
collapse	默认。如果可能，边框会被合并为一个单一的边框。
实例
下面的例子合并表格边框：
<html>
<head>
<script type="text/javascript">
function setBorderCollapse()
{
document.getElementById('myTable').style.borderCollapse="collapse"
}
</script>
</head>
<body>

<table border="1" id="myTable">
  <tr>
    <td>100</td>
    <td>200</td>
  </tr>
  <tr>
    <td>300</td>
    <td>400</td>
  </tr>
</table>
<br />
<input type="button" onclick="setBorderCollapse()"
value="Collapse border">

</body>
</html>
TIY
borderCollapse - 把表格边框合并为单一边框■◆718■设置分隔单元格边框的距离                简化命令：．框间距离■．框间距离■设置分隔单元格边框的距离



定义和用法
borderSpacing 属性相邻单元格的边框之间的距离（仅用于“边框分离”模式）。
语法：
Object.style.borderSpacing=length,length
可能的值
值	描述
length length	使用 px、cm 等单位定义距离。如果定义一个 length 参数，那么定义的是水平和垂直间距。如果定义了两个 length 参数，那么第一个设置水平间距，而第二个设置垂直间距。length 不能为负值。
实例
本例设置相邻单元格的边框之间的距离：
<html>
<head>
<script type="text/javascript">
function changeBorderSpacing()
{
document.getElementById('myTable').style.borderSpacing="10px"
}
</script>
</head>
<body>

<table border="1" id="myTable">
  <tr>
    <td>100</td>
    <td>200</td>
  </tr>
  <tr>
    <td>300</td>
    <td>400</td>
  </tr>
</table>

<input type="button" onclick="changeBorderSpacing()" 
value="Change border spacing">

</body>
</html>
TIY
borderSpacing - 改变相邻单元格的边框之间的距离（请在非 IE 浏览器中查看）■◆718■设置表格标题的位置                      简化命令：．表格标题位置■．表格标题位置■设置表格标题的位置


定义和用法
captionSide 属性设置表格标题的位置。
语法：
Object.style.captionSide=top|bottom|left|right
可能的值
值	描述
top	默认。把表格标题定位在表格之上。
bottom	把表格标题定位在表格之下。
left	把表格标题定位在表格的左边。
right	把表格标题定位在表格的右边。
实例
本例移动表格标题：
<html>
<head>
<style type="text/css">
caption
{
caption-side:bottom; 
}
</style>
<script type="text/javascript">
function moveCaption()
{
document.getElementById('myTable').style.captionSide="right"
}
</script>
</head>
<body>

<table border="1" id="myTable">
  <caption>This is a caption</caption>
  <tr>
    <td>100</td>
    <td>200</td>
  </tr>
  <tr>
    <td>300</td>
    <td>400</td>
  </tr>
</table>
<br />
<input type="button" onclick="moveCaption()"
value="Move table caption">

</body>
</html>
TIY
captionSide - 对表格标题进行定位（请在非 IE 浏览器中查看）■◆718■设置是否显示表格中的空单元格            简化命令：．空格边框■．空格边框■设置是否显示表格中的空单元格



定义和用法
emptyCells 属性设置是否显示表格中的空单元格（仅用于“分离边框”模式）。
语法：
Object.style.emptyCells=hide|show
可能的值
值	描述
hide	默认。不在空单元格周围绘制边框。
show	在空单元格周围绘制边框。
实例
本例改变空单元格的显示方式：
<html>
<head>
<script type="text/javascript">
function showEmptyCells()
{
document.getElementById('myTable').style.emptyCells="show"
}
</script>
</head>
<body>

<table border="1" id="myTable">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td></td>
</tr>
</table>

<input type="button" onclick="showEmptyCells()"
value="Show empty cells">

</body>
</html>
TIY
改变空单元格的显示方式■◆718■设置用来显示表格单元格、行以及列的算法  简化命令：．格宽规则■．格宽规则■设置用来显示表格单元格、行以及列的算法



定义和用法
tableLayout 属性用来显示表格单元格、行、列的算法规则。
固定表格布局：
固定表格布局与自动表格布局相比，允许浏览器更快地对表格进行布局。
在固定表格布局中，水平布局仅取决于表格宽度、列宽度、表格边框宽度、单元格间距，而与单元格的内容无关。
通过使用固定表格布局，用户代理在接收到第一行后就可以显示表格。
自动表格布局：
在自动表格布局中，列的宽度是由列单元格中没有折行的最宽的内容设定的。
此算法有时会较慢，这是由于它需要在确定最终的布局之前访问表格中所有的内容。
语法：
Object.style.tableLayout=automatic|fixed
可能的值
值	描述
automatic	默认。列宽度由单元格内容设定。
fixed	列宽由表格宽度和列宽度设定。
实例
本例设置固定表格布局：
<html>
<head>
<script type="text/javascript">
function setFixedTableLayout()
{
document.getElementById('myTable').style.tableLayout="fixed";
}
</script>
</head>
<body>

<table id="myTable" border="1" width="100%">
<col width="20%"><col width="40%"><col width="40%">
<tr>
<td>1000000000000000000000000000</td>
<td>10000000</td>
<td>100</td>
</tr>
</table>

<input type="button" onclick="setFixedTableLayout()"
value="Set fixed table layout">

</body>
</html>
TIY
改变表格的布局 (tableLayout)■◆718■设置文本的颜色                          简化命令：．文色■．文色■设置文本的颜色




定义和用法
color 属性设置文本的颜色（元素的前景色）。
语法：
Object.style.color=color
可能的值
值	描述
color	
颜色值可以是颜色名称、rgb 值或者十六进制数。
默认值：取决于浏览器。
实例
本例改变文本的颜色：
<html>
<head>
<script type="text/javascript">
function setColor()
{
document.getElementById("p1").style.color="#ff0000";
document.getElementById("p2").style.color="magenta";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph</p>
<p id="p2">This is also an example paragraph</p>

<input type="button" onclick="setColor()"
value="Change color of text" />

</body>
</html>
TIY
改变文本的颜色■◆718■在一行设置所有的字体属性                简化命令：．字体■．字体■在一行设置所有的字体属性



定义和用法
font 属性在一个声明中设置所有字体属性。
语法：
Object.style.font=value
可能的值
值	描述
fontStyle
fontVariant
fontWeight
fontSize/lineHeight
fontFamily
设置字体的属性。
caption	为控件定义字体（比如按钮、下拉列表等）。
icon	定义用于标注图标的字体。
menu	定义菜单中使用的字体。
message-box	定义对话框中使用的字体。
small-caption	定义用于标注小型控件的字体。
status-bar	定义在窗口状态栏中使用的字体。
实例
本例改变文本的字体：
<html>
<head>
<script type="text/javascript">
function setFont()
{
document.getElementById("p1").style.font="italic bold 12px arial,serif";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>

<input type="button" onclick="setFont()" value="Change paragraph style" />

</body>
</html>
TIY
改变文本的字体■◆718■设置元素的字体系列                      简化命令：．字体系列■．字体系列■设置元素的字体系列。



定义和用法
fontFamily 属性定义用于元素文本显示的字体系列。
语法：
Object.style.fontFamily=font1,font2,....
可能的值
Value	Description
font1, font2,....	字体族名称或类组名称的列表，由逗号分割。
提示和注释
提示：使用逗号分割每个值，并始终提供一个类族名称作为最后的选择。
注释：如果字体族名称中含有空格，请为其加上引号。
实例
本例改变文本的字体系列：
<html>
<head>
<script type="text/javascript">
function setFont()
{
document.getElementById("p1").style.fontFamily="arial,sans-serif";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>

<input type="button" onclick="setFont()" value="Change font" />

</body>
</html>
TIY
fontFamily - 改变文本的字体系列■◆718■设置元素的字体大小                      简化命令：．字值■．字值■设置元素的字体大小。



定义和用法
fontSize 属性设置元素的字体大小。
语法：
Object.style.fontSize=value
可能的值
值	描述
xx-small
x-small
small
medium
large
x-large
xx-large
把字体的尺寸设置为不同的尺寸，从 xx-small 到 xx-large。
默认值：medium。
smaller	把 font-size 设置为比父元素更小的尺寸。
larger	把 font-size 设置为比父元素更大的尺寸。
length	把 font-size 设置为一个固定的值。
%	把 font-size 设置为基于父元素的一个百分比。
实例
本例改变文本的字体大小：
<html>
<head>
<script type="text/javascript">
function setFontSize()
{
document.getElementById("p1").style.fontSize="larger";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>

<input type="button" onclick="setFontSize()" 
value="Change font-size" />

</body>
</html>
TIY
fontSize - 改变文本的字体大小■◆718■设置元素的字体样式                      简化命令：．倾斜度■．倾斜度■设置元素的字体样式



定义和用法
fontStyle 属性设置字体的风格。
语法：
Object.style.fontStyle=normal|italic|oblique
可能的值
值	描述
normal	默认。浏览器显示一个标准的字体。
italic	浏览器会显示一个斜体的字体。
oblique	浏览器会显示一个倾斜的字体。
实例
本例向文本添加斜体样式：
<html>
<head>
<script type="text/javascript">
function setFontStyle()
{
document.getElementById("p1").style.fontStyle="italic";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>

<input type="button" onclick="setFontStyle()" 
value="Change font-style" />

</body>
</html>
TIY
fontStyle - 改变文本的风格■◆718■用小型大写字母字体来显示文本            简化命令：．小型大写■．小型大写■用小型大写字母字体来显示文本



定义和用法
fontVariant 属性用于设置小型大写字母的字体显示文本
语法：
Object.style.fontVariant=normal|small-caps
可能的值
值	描述
normal	默认。浏览器会显示一个标准的字体。
small-caps	浏览器会显示小型大写字母的字体。
实例
本例把第一段设置为小型大写字母：
<html>
<head>
<script type="text/javascript">
function setSmallCaps()
{
document.getElementById("p1").style.fontVariant="small-caps";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>
<p>This is another example paragraph.</p>

<input type="button" onclick="setSmallCaps()" 
value="Display small-caps font" />

</body>
</html>
TIY
fontVariant - 把文本设置为小型大写字母■◆718■设置字体的粗细                          简化命令：．字粗细■．字粗细■设置字体的粗细



定义和用法
fontWeight 属性设置字符的粗细。
语法：
Object.style.fontWeight=value
可能的值
值	描述
normal	默认。定义标准的字符。
bold	定义粗体字符。
bolder	定义更粗的字符。
lighter	定义更细的字符。
100
200
300
400
500
600
700
800
900
定义由粗到细的字符。400 等同于 normal，而 700 等同于 bold。
实例
本例把第一段设置为粗体：
<html>
<head>
<script type="text/javascript">
function setFontWeight()
{
document.getElementById("p1").style.fontWeight="900";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>
<p>This is another example paragraph.</p>

<input type="button" onclick="setFontWeight()"
value="Display bold text" />

</body>
</html>
TIY
fontWeight - 把文本设置为粗体■◆718■设置字符间距                            简化命令：．字间距■．字间距■设置字符间距



定义和用法
letterSpacing 属性设置字符之间的空白。
语法：
Object.style.letterSpacing=normal|length
可能的值
值	描述
normal	默认。定义字符间的标准空间。
length	定义字符间的固定空间。
实例
本例改变字符之间的空白：
<html>
<head>
<script type="text/javascript">
function changeLetterSpacing()
{
document.getElementById("p1").style.letterSpacing="3";
document.getElementById("p2").style.letterSpacing="-1";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>
<p id="p2">This is another example paragraph.</p>

<input type="button" onclick="changeLetterSpacing()"
value="Change letter-spacing" />

</body>
</html>
TIY
letterSpacing - 改变字符之间的空白■◆718■设置行间距                              简化命令：．行间距■．行间距■设置行间距



定义和用法
lineHeight 属性设置行之间的距离（行高）。
语法：
Object.style.lineHeight=normal|number|length|%
可能的值
值	描述
normal	默认。设置合理的行间距。
number	设置数字，此数字会与当前的字体尺寸相乘来设置行间距。
length	设置固定的行间距。
%	基于当前字体尺寸的百分比行间距。
实例
本例改变行高：
<html>
<head>
<script type="text/javascript">
function changeLineHeight()
{
document.getElementById("div1").style.lineHeight="2";
}
</script>
</head>
<body>

<div id="div1">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<br />
<input type="button" onclick="changeLineHeight()"
value="Change line-height" />

</body>
</html>
TIY
lineHeight - 改变行高■◆718■设置在文本中使用哪种引号                简化命令：．引号类型■．引号类型■设置在文本中使用哪种引号


定义和用法
quotes 属性设置嵌入引用的引号类型。
语法：
Object.style.quotes=none|string string string string
可能的值
值	描述
none	规定 "content" 属性的 "open-quote" 和 "close-quote" 的值不会产生任何引号。
string string string string	定义要使用的引号。前两个值规定第一级引用嵌套，后两个值规定下一级引号嵌套。
■◆718■排列文本                                简化命令：．文本对齐■．文本对齐■排列文本



定义和用法
textAlign 属性对齐元素中的文本。
语法：
Object.style.textAlign=left|right|center|justify
可能的值
值	描述
left	把文本排列到左边。默认值：由浏览器决定。
right	把文本排列到右边。
center	把文本排列到中间。
justify	根据 textJustify 属性对齐文本。
实例
本例对齐一段文本：
<html>
<head>
<script type="text/javascript">
function setTextAlign()
{
document.getElementById("p1").style.textAlign="right";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>

<input type="button" onclick="setTextAlign()"
value="Align text" />

</body>
</html>
TIY
textAlign - 对齐一段文本■◆718■设置文本的修饰                          简化命令：．文线关系■．文线关系■设置文本的修饰



定义和用法
textDecoration 属性对文本进行修饰。
语法：
Object.style.textDecoration=none|underline|overline|line-through|blink
可能的值
值	描述
none	默认。定义标准的文本。
underline	定义文本下的一条线。
overline	定义文本上的一条线。
line-through	定义穿过文本下的一条线。
blink	定义闪烁的文本（无法运行在 IE 和 Opera 中）。
实例
本例给文本设置下划线：
<html>
<head>
<script type="text/javascript">
function setTextDecoration()
{
document.getElementById("p1").style.textDecoration="overline";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph.</p>

<input type="button" onclick="setTextDecoration()"
value="Set text-decoration" />

</body>
</html>
TIY
textDecoration - 装饰文本■◆718■缩紧首行的文本                          简化命令：．首行缩量■．首行缩量■缩紧首行的文本


定义和用法
textIndent 属性缩进元素中的首行文本。
语法：
Object.style.textIndent=length|%
可能的值
值	描述
length	定义固定的缩进。默认值：0。
%	定义基于父元素宽度的百分比的缩进。
实例
本例缩进文本：
<html>
<head>
<script type="text/javascript">
function setTextIndent()
{
document.getElementById("div1").style.textIndent="50px";
}
</script>
</head>
<body>

<div id="div1">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<br />
<input type="button" onclick="setTextIndent()"
value="Indent first line of text" />

</body>
</html>
TIY
textIndent - 缩进文本■◆718■对文本设置大写效果                      简化命令：．大写设置■．大写设置■对文本设置大写效果



定义和用法
textTransform 属性会改变元素中的字母大小写，而不论源文档中文本的大小写。
语法：
Object.style.textTransform="none|capitalize|uppercase|lowercase|inherit"
可能的值
值	描述
none	默认。定义带有小写字母和大写字母的标准的文本。
capitalize	文本中的每个单词以大写字母开头。
uppercase	定义仅有大写字母。
lowercase	定义无大写字母，仅有小写字母。
实例
本例把每个单词的第一个字母转换为大写：
<html>
<head>
<script type="text/javascript">
function displayResult()
{
document.getElementById("p1").style.textTransform="capitalize";
}
</script>
</head>
<body>

<p id="p1">This is some text.</p>
<br />

<button type="button" onclick="displayResult()">Convert text</button>

</body>
</html>
亲自试一试■◆718■设置如何设置文本中的折行和空白符        简化命令：．空符设置■．空符设置■设置如何设置文本中的折行和空白符



定义和用法
whiteSpace 属性设置如何处理文本中的空白符（比如空格和换行符）。
语法：
Object.style.whiteSpace=normal|nowrap|pre
可能的值
值	描述
normal	默认。空白会被浏览器忽略。
pre	空白会被浏览器保留。其行为方式类似 HTML 中的 <pre> 标签。
nowrap	文本不会换行，文本会在在同一行上继续，直到遇到 <br> 标签为止。
实例
本例不允许在文本内换行：
<html>
<head>
<script type="text/javascript">
function removeWrapping()
{
document.getElementById("div1").style.whiteSpace="nowrap";
}
</script>
</head>
<body>

<div id="div1">
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
This is some text. This is some text. This is some text.
</div>
<br />
<input type="button" onclick="removeWrapping()" 
value="Do not let the text wrap" />

</body>
</html>
TIY
whiteSpace - 不允许在文本内换行■◆718■设置文本中的词间距                      简化命令：．词间距■．词间距■设置文本中的词间距



定义和用法
wordSpacing 属性设置文本中的单词间距。
语法：
Object.style.wordSpacing=normal|length
可能的值
值	描述
normal	默认。定义单词间的标准空间。
length	定义单词间的固定空间。
实例
本例改变单词间的间距：
<html>
<head>
<script type="text/javascript">
function changeWordSpacing()
{
document.getElementById("p1").style.wordSpacing="10px";
}
</script>
</head>
<body>

<p id="p1">This is an example paragraph</p>

<input type="button" onclick="changeWordSpacing()" 
value="Change space between words" />

</body>
</html>
TIY
wordSpacing - 改变单词间的间距■◆345■表格■表格■Table 对象
Table 对象代表一个 HTML 表格。
在 HTML 文档中 <table> 标签每出现一次，一个 Table 对象就会被创建。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆819■返回包含表格中所有单元格的数组［集合］  简化命令：．格数组■．格数组■返回包含表格中所有单元格的一个数组。



定义和用法
cells 集合返回表格中所有单元格的一个数组。
语法
tableObject.cells[]
实例
下面的例子使用 cells 来显示出第一个单元格的内容：
<html>
<head>
<script type="text/javascript">
function cell()
  {
  var x=document.getElementById('myTable').rows[0].cells;
  alert(x[0].innerHTML);
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>cell 1</td>
<td>cell 2</td>
</tr>
<tr>
<td>cell 3</td>
<td>cell 4</td>
</tr>
</table>
<br />
<input type="button" onclick="cell()" value="Alert first cell">

</body>
</html>
TIY
使用 cells[] 集合

■◆819■返回包含表格中所有行的一个数组［集合］  简化命令：．行数组■．行数组■返回包含表格中所有行的一个数组。




定义和用法
rows 集合返回表格中所有行（TableRow 对象）的一个数组，即一个 HTMLCollection。
该集合包括 <thead>、<tfoot> 和 <tbody> 中定义的所有行。
语法
tableObject.rows[]
实例
下面的例子使用了 rows 集合来显示第一行中的内容：
<html>
<head>
<script type="text/javascript">
function showRow()
  {
  alert(document.getElementById('myTable').rows[0].innerHTML)
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="showRow()" value="Show innerHTML">

</body>
</html>
TIY
某一个行的 InnerHTML
通过 rows 集合向表格行添加一个单元格
排列表格行中的单元格内容
垂直排列表格行中的单元格内容
排列一个单独的单元格中的内容
垂直排列一个单独的单元格中的内容
更改表格单元格中的内容
更改一个表格行的 colspan■◆819■返回包含表格中所有tbody的数组［集合］   简化命令：．表格主体■．表格主体■返回包含表格中所有 tbody 的一个数组。■◆819■设置或返回表格边框的宽度                简化命令：．框宽■．框宽■设置或返回表格边框的宽度。



定义和用法
border 属性可设置或返回表格边框的宽度（以像素为单位）。
语法
tableObject.border=pixels
实例
<html>
<head>
<script type="text/javascript">
function changeBorder()
  {
  document.getElementById('myTable').border="10"
  }
</script>
</head>
<body>

<table border="1" id="myTable">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
<br />
<input type="button" onclick="changeBorder()"
value="Change Border">

</body>
</html>
TIY
更改表格边线的宽度■◆819■对表格的 <caption> 元素的引用           简化命令：．表标题■．表标题■对表格的 <caption> 元素的引用。




定义和用法
caption 属性设置或返回表格的 caption 元素。
<caption> 元素定义了一个表格标题。<caption> 标签必须紧跟在 <table> 标签之后，每个表格仅能规定一个 caption。通常，caption 会位于表格之上居中的位置。
语法
tableObject.caption=captionObject
实例
下面的例子可返回表格的 <caption> 元素的文本：
<html>
<head>
<script type="text/javascript">
function alertCaption()
  {
  alert(document.getElementById("table1").caption.innerHTML);
  }
</script>
</head>
<body>

<table id="table1" border="1">
<caption>This is a table caption</caption>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick=alertCaption()
value="Alert table caption" />

</body>
</html>
TIY
取得表格的 <caption> 元素的文本■◆819■设置或返回格内容和单元格边框间空白量    简化命令：．格内量■．格内量■设置或返回单元格内容和单元格边框之间的空白量。



定义和用法
cellPadding 属性可设置或返回单元格边框与单元格内容之间的空白量（以像素为单位）。
语法
tableObject.cellPadding=pixels
实例
The following example changes the cell padding of a table:
<html>
<head>
<script type="text/javascript">
function padding()
  {
  document.getElementById('myTable').cellPadding="15"
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
<br />
<input type="button" onclick="padding()" value="Change Cellpadding">

</body>
</html>
TIY
更改表格的 cellPadding 和 cellSpacing■◆819■设置或返回在表格中的单元格间空白量      简化命令：．格间量■．格间量■设置或返回在表格中的单元格之间的空白量。



定义和用法
cellSpacing 属性可设置或返回在表格中的单元格之间的空白量（以像素为单位）。
语法
tableObject.cellSpacing=pixels
实例
下面的例子更改了表格的 cellSpacing：
<html>
<head>
<script type="text/javascript">
function spacing()
  {
  document.getElementById('myTable').cellSpacing="15"
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
<br />
<input type="button" onclick="spacing()" value="Change Cellspacing">

</body>
</html>
TIY
更改表格的 cellPadding 和 cellSpacing■◆819■设置或返回表格的外部边框                简化命令：．外边框■．外边框■设置或返回表格的外部边框。



定义和用法
frame 属性可设置或返回表格的外部边框。
语法
tableObject.frame=void|above|below|hsides|vsides|lhs|rhs|box|border
实例
下面的例子设置了表格的两种不同的边框：
<html>
<head>
<script type="text/javascript">
function aboveFrames()
  {
  document.getElementById('myTable').frame="above"
  }
function belowFrames()
  {
  document.getElementById('myTable').frame="below"
  }
</script>
</head>
<body>

<table id="myTable">
<tr>
<td>100</td>
<td>200</td>
</tr>
<tr>
<td>300</td>
<td>400</td>
</tr>
</table>
<br />
<input type="button" onclick="aboveFrames()"
value="Show above frames">
<input type="button" onclick="belowFrames()"
value="Show below frames">

</body>
</html>
TIY
规定表格的外部边框■◆819■设置或返回表格的 id                     简化命令：．id■．id■设置或返回表格的 id。



定义和用法
id 属性可设置或返回表格的 id。
语法
tableObject.id=id
实例
<html>
<head>
<script type="text/javascript">
function alertId()
  {
  alert(document.getElementById("table1").id);
  }
</script>
</head>
<body>

<table id="table1" border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick=alertId()
value="Alert id of table" />

</body>
</html>
TIY
提示一个表格的 id■◆819■设置或返回表格的内部边框或者说行线      简化命令：．内边框■．内边框■设置或返回表格的内部边框（行线）。



定义和用法
rules 属性可设置或返回表格的内部边线。
语法
tableObject.rules=none|groups|rows|cols|all
实例
下面的例子设置了表格的两种不同的内部边线：
<html>
<head>
<script type="text/javascript">
function rowRules()
  {
  document.getElementById('myTable').rules="rows"
  }
function colRules()
  {
  document.getElementById('myTable').rules="cols"
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
<tr>
<td>Row3 cell1</td>
<td>Row3 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="rowRules()"
value="Show only row borders">
<input type="button" onclick="colRules()"
value="Show only col borders">

</body>
</html>
TIY
规定表格的内部边线■◆819■设置或返回对表格的描述                  简化命令：．表格描述■．表格描述■设置或返回对表格的描述（概述）。



定义和用法
summary 属性可设置或返回表格的概述。
summary 属性为语音合成或非可视的浏览器规定了表格的概述。
语法
tableObject.summary=text
实例
下面的例子可返回表格的概述：
<html>
<head>
<script type="text/javascript">
function alertSummary()
  {
  alert(document.getElementById("table1").summary);
  }
</script>
</head>
<body>

<table id="table1" border="1"
summary="Example table of employees">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick=alertSummary()
value="Alert table summary" />

</body>
</html>
TIY
取得表格的概述■◆819■返回表格的 TFoot 对象                   简化命令：．表格脚■．表格脚■返回表格的 TFoot 对象。如果不存在该元素，则为 null。■◆819■返回表格的 THead 对象                   简化命令：．表格头■．表格头■返回表格的 THead 对象。如果不存在该元素，则为 null。■◆819■设置或返回表格的宽度                    简化命令：．全宽■．全宽■设置或返回表格的宽度。



定义和用法
width 属性可设置或返回表格的宽度。
语法
tableObject.width=percent|pixels
实例
下面的例子可更改表格的宽度：
<html>
<head>
<script type="text/javascript">
function changeWidth()
  {
  document.getElementById("table1").width="100%";
  }
</script>
</head>
<body>

<table id="table1" border="1">
<thead>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick=changeWidth()
value="Change table width" />
</body>
</html>
TIY
更改表格的宽度■◆819■为表格创建一个caption元素()             简化命令：．建标题■．建标题■为表格创建一个 caption 元素。



定义和用法
createCaption() 方法用于在表格中获取或创建 <caption> 元素。
语法
tableObject.createCaption()
返回值
返回一个 HTMLElement 对象，表示该表的 <caption> 元素。如果该表格已经有了标题，则返回它。如果该表没有 <caption> 元素，则创建一个新的空 <caption> 元素，把它插入表格，并返回它。
实例
下面的例子为表格创建了一个标题：
<html>
<head>
<script type="text/javascript">
function createCaption()
{
var x=document.getElementById('myTable').createCaption()
x.innerHTML="My table caption"
}
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="createCaption()"
value="Create caption">

</body>
</html>
TIY
为表格创建了一个标题■◆819■在表格中创建一个空的tFoot元素()         简化命令：．建表格脚■．建表格脚■在表格中创建一个空的 tFoot 元素。



定义和用法
createTFoot() 方法用于在表格中获取或创建 <tfoot> 元素。
语法
tableObject.createTFoot()
返回值
返回一个 TableSection，表示该表的 <tfoot> 元素。如果该表格已经有了脚注，则返回它。如果该表没有脚注，则创建一个新的空 <tfoot> 元素，把它插入表格，并返回它。
实例
下面的例子为表格创建了一个脚注：
<html>
<head>
<script type="text/javascript">
function createCaption()
{
var x=document.getElementById('myTable').createTFoot()
x.innerHTML="My table foot"
}
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="createCaption()"
value="Create caption">

</body>
</html>
TIY
为表格创建了一个脚注■◆819■在表格中创建一个空的tHead元素()         简化命令：．建表格头■．建表格头■在表格中创建一个空的 tHead 元素。



定义和用法
createTHead() 方法用于在表格中获取或创建 <thead> 元素。
语法
tableObject.createTHead()
返回值
返回一个 TableSection，表示该表的 <thead> 元素。如果该表格已经有了表头，则返回它。如果该表没有表头，则创建一个新的空 <thead> 元素，把它插入表格，并返回它。
实例
下面的例子为表格创建了一个脚注：
<html>
<head>
<script type="text/javascript">
function createCaption()
{
var x=document.getElementById('myTable').createTHead()
x.innerHTML="My table head"
}
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="createCaption()"
value="Create caption">

</body>
</html>
TIY
为表格创建了一个表头■◆819■从表格删除caption元素以及其内容()       简化命令：．删标题■．删标题■从表格删除 caption 元素以及其内容。



定义和用法
deleteCaption() 方法用于删除表格的 caption 元素及其内容。
语法
tableObject.deleteCaption()
说明
如果该表有 <caption> 元素，则从文档树种删除它。否则，什么也不做。
实例
下面的例子删除表格的标题：
<html>
<head>
<script type="text/javascript">
function deleteCaption()
  {
  document.getElementById('myTable').deleteCaption()
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<caption>My table caption</caption>
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="deleteCaption()"
value="Delete caption" />

</body>
</html>
TIY
删除表格的标题■◆819■从表格删除一行()                        简化命令：．删行■．删行■从表格删除一行。



定义和用法
deleteRow() 方法用于从表格删除指定位置的行。
语法
tableObject.deleteRow(index)
说明
参数 index 指定了要删除的行在表中的位置。行的编码顺序就是他们在文档源代码中出现的顺序。<thead> 和 <tfoot> 中的行与表中其它行一起编码。
实例
The following example deletes the first row of the table:
<html>
<head>
<script type="text/javascript">
function delRow()
  {
  document.getElementById('myTable').deleteRow(0)
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="delRow()"
value="Delete first row">

</body>
</html>
TIY
从表格删除行■◆819■从表格删除tFoot元素及其内容()           简化命令：．删表格脚■．删表格脚■从表格删除 tFoot 元素及其内容。



定义和用法
deleteTFoot() 方法用于从表格删除 <tfoot> 元素。
语法
tableObject.deleteTFoot()
说明
如果该表有 <tfoot> 元素，则将它从文档树种删除，否则什么也不做。
实例
下面的例子删除表的脚注：
<html>
<head>
<script type="text/javascript">
function delRow()
  {
  document.getElementById('myTable').deleteTFoot()
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
<tfoot><td>my table foot</td></tfoot>
</table>
<br />
<input type="button" onclick="delRow()"
value="Delete table foot">

</body>
</html>
TIY
从表格删除脚注■◆819■从表格删除tHead元素及其内容()           简化命令：．删表格头■．删表格头■从表格删除 tHead 元素及其内容。



定义和用法
deleteTHead() 方法用于从表格删除 <thead> 元素。
语法
tableObject.deleteTHead()
说明
如果该表有 <thead> 元素，则将它从文档树种删除，否则什么也不做。
实例
下面的例子删除表的脚注：
<html>
<head>
<script type="text/javascript">
function delRow()
  {
  document.getElementById('myTable').deleteTHead()
  }
</script>
</head>
<body>

<table id="myTable" border="1">
<thead><td>my table head</td></thead>
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="delRow()"
value="Delete table foot">

</body>
</html>
TIY
从表格删除表头■◆819■在表格中插入一个新行()                  简化命令：．插行■．插行■在表格中插入一个新行。



定义和用法
insertRow() 方法用于在表格中的指定位置插入一个新行。
语法
tableObject.insertRow(index)
返回值
返回一个 TableRow，表示新插入的行。
说明
该方法创建一个新的 TableRow 对象，表示一个新的 <tr> 标记，并把它插入表中的指定位置。
新行将被插入 index 所在行之前。若 index 等于表中的行数，则新行将被附加到表的末尾。
如果表是空的，则新行将被插入到一个新的 <tbody> 段，该段自身会被插入表中。
抛出
若参数 index 小于 0 或大于等于表中的行数，该方法将抛出代码为 INDEX_SIZE_ERR 的 DOMException 异常。
提示和注释
提示：可以用 TableRow.insertCell() 方法给新创建的行添加内容。
实例
下面的例子在表格的开头插入一个新行：
<html>
<head>
<script type="text/javascript">
function insRow()
  {
  document.getElementById('myTable').insertRow(0)
  }
</script>
</head>

<body>
<table id="myTable" border="1">
<tr>
<td>Row1 cell1</td>
<td>Row1 cell2</td>
</tr>
<tr>
<td>Row2 cell1</td>
<td>Row2 cell2</td>
</tr>
</table>
<br />
<input type="button" onclick="insRow()"
value="Insert new row">

</body>
</html>
TIY
向表格添加新行 - 然后向其添加内容■◆345■单元格■单元格■TableCell 对象
TableCell 对象代表一个 HTML 表格单元格。
在一个 HTML 文档中 <td> 标签每出现一次，一个 TableCell 对象就会被创建。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆842■设置或返回单元格中内容的缩写版本        简化命令：．缩写■．缩写■设置或返回单元格中内容的缩写版本。




定义和用法
abbr 属性可设置或返回表元中内容的缩写版本（针对非可视的媒介，比如语音和盲文）。
语法
tabledataObject.abbr=text
实例
下面的例子可提示某个单元格的 abbr：
<html>
<head>
<script type="text/javascript">
function alertAbbr()
  {
  alert(document.getElementById('td1').abbr);
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td id="td1" abbr="Some text">Peter</td>
<td id="td2">Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="alertAbbr()" 
value="Alert abbr" />

</body>
</html>
TIY
返回某个单元格的 abbr■◆842■设置或返回单元格内部数据的水平排列方式  简化命令：．对齐■．对齐■设置或返回单元格内部数据的水平排列方式。



定义和用法
align 属性可设置或返回表格单元内数据的水平排列方式。
语法
tabledataObject.align=left|right|center
实例
下面的例子把单元格的内容排列到了右边：
<html>
<head>
<script type="text/javascript">
function alignCell()
  {
  document.getElementById('td1').align="right"
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td id="td1">Peter</td>
<td id="td2">Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="alignCell()" 
value="Align cell" />

</body>
</html>
TIY
更改 <td> 元素的排列方式■◆842■设置或返回相关单元格逗号分隔列表        简化命令：．类型名■．类型名■设置或返回相关单元格的一个逗号分隔的列表。



定义和用法
axis 属性可设置或返回一个由逗号分隔的列表，其中包含了一组类型（有关联的单元格）的名称。
axis 属性可为某个单元格定义类型名称。
语法
tabledataObject.axis=text
实例
下面的例子可返回单元格的 axis：
<<html>
<head>
<script type="text/javascript">
function alertAxis()
  {
  alert(document.getElementById('td3').axis);
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>City</th>
</tr>
<tr>
<td id="td1">Harry</td>
<td id="td2">Potter</td>
<td id="td3" axis="location">NY</td>
</tr>
<tr>
<td id="td4">Peter</td>
<td id="td5">Griffin</td>
<td id="td6" axis="location">Las Vegas</td>
</tr>
</table>
<br />
<input type="button" onclick="alertAxis()"
value="Alert axis" />

</body>
</html>
TIY
显示表元的 axis■◆842■返回单元格在某行的单元格集合中的位置    简化命令：．格位置■．格位置■返回单元格在某行的单元格集合中的位置。



定义和用法
cellIndex 属性可返回一行的单元格集合中单元格的位置。
语法
tabledataObject.cellIndex
实例
下面的例子可返回两个单元格的位置（cell index）：
<html>
<head>
<script type="text/javascript">
function alertTd1()
  {
  alert(document.getElementById('td1').cellIndex);
  }
function alertTd2()
  {
  alert(document.getElementById('td2').cellIndex);
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td id="td1">Peter</td>
<td id="td2">Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="alertTd1()" 
value="Alert cell index of 'Peter'" />
<br />
<input type="button" onclick="alertTd2()" 
value="Alert cell index of 'Griffin'" />

</body>
</html>
TIY
取得单元格的 cell index■◆842■单元格横跨的列数                        简化命令：．横跨■．横跨■单元格横跨的列数。



定义和用法
colSpan 属性可设置或返回表元横跨的列数。
语法
tabledataObject.colSpan=number_of_columns
实例
下面的例子更改了表元横跨的列数：
<html>
<head>
<script type="text/javascript">
function changeColSpan()
  {
  document.getElementById("td1").colSpan="2";
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td id="td1">Peter</td>
<td id="td2">Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick=changeColSpan()
value="Change colspan" />

</body>
</html>
TIY
更改表元横跨的列数■◆842■设置或返回单元格的 id                   简化命令：．id■．id■设置或返回单元格的 id。



定义和用法
id 属性可设置或返回表元的 id。
语法
tabledataObject.id=id
实例
下面的例子返回的表元的 id：
<html>
<head>
<script type="text/javascript">
function alertId()
  {
  alert(document.getElementById("td1").id);
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td id="td1">Peter</td>
<td id="td2">Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick=alertId() value="Alert ID" />

</body>
</html>
TIY
取得表元的 id■◆842■设置或返回单元格开始和结束标签之间HTML  简化命令：．内容■．内容■设置或返回单元格的开始标签和结束标签之间的 HTML。



定义和用法
innerHTML 属性可设置或返回单元格的开始标签和结束标签之间的 HTML。
语法
tabledataObject.innerHTML=text
实例
下面的例子返回了表元的 inner HTML：
<html>
<head>
<script type="text/javascript">
function alertInnerHTML()
  {
  alert(document.getElementById("td1").innerHTML);
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td id="td1">Peter</td>
<td id="td1">Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick=alertInnerHTML()
value="Alert innerHTML" />
</body>
</html>
TIY
取得表元的 inner HTML■◆842■设置或返回单元格可横跨的行数            简化命令：．竖跨■．竖跨■设置或返回单元格可横跨的行数。




定义和用法
rowSpan 属性可设置或返回表元横跨的行数。
语法
tabledataObject.rowSpan=number_of_rows
实例
下面的例子更改了表元横跨的行数：
<html>
<head>
<script type="text/javascript">
function changeRowSpan()
  {
  document.getElementById("td2").rowSpan="2";
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td id="td1">Peter</td>
<td id="td2">Griffin</td>
</tr>
<tr>
<td id="td3">Harry</td>
<td id="td4">Potter</td>
</tr>
</table>
<br />
<input type="button" onclick=changeRowSpan()
value="Change rowspan" />

</body>
</html>
TIY
更改表元横跨的行数■◆842■设置或返回单元格内数据垂直排列方式      简化命令：．竖对齐■．竖对齐■设置或返回表格单元格内数据的垂直排列方式。



定义和用法
vAlign 属性设置或返回单元格内数据的垂直排列方式。
语法
tabledataObject.vAlign=top|middle|bottom|baseline
实例
下面的例子更改了单元格内数据的垂直排列方式：
<html>
<head>
<script type="text/javascript">
function topAlign()
  {
  document.getElementById('td1').vAlign="top";
  document.getElementById('td2').vAlign="top";
  document.getElementById('td3').vAlign="top";
  }
</script>
</head>
<body>

<table width="50%" border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
<th>Text</th>
</tr>
<tr>
<td id="td1">Peter</td>
<td id="td2">Griffin</td>
<td id="td3">Hello my name is Peter Griffin. 
I need a long text for this example. 
I need a long text for this example.</td>
</tr>
</table>
<br />
<input type="button" onclick="topAlign()"
value="Top-align table cells" />

</body>
</html>
TIY
更改单元格内数据的垂直排列方式■◆842■设置或返回单元格的宽度                  简化命令：．全宽■．全宽■设置或返回单元格的宽度。



定义和用法
width 属性设置或返回表元的宽度。
注释：整个列都会受到影响。
语法
tabledataObject.width=percent|pixels
实例
下面的例子更改了表元的宽度：
<html>
<head>
<script type="text/javascript">
function changeWidth()
  {
  document.getElementById("td1").width="200px";
  }
</script>
</head>
<body>

<table border="1">
<tr>
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td id="td1">Peter</td>
<td id="td2">Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick=changeWidth() value="Change width" />

</body>
</html>
TIY
更改表元的宽度■◆345■表格行■表格行■TableRow 对象
TableRow 对象代表一个 HTML 表格行。
在 HTML 文档中 <tr> 标签每出现一次，一个 TableRow 对象就会被创建。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆853■返回包含行中所有单元格的数组［集合］    简化命令：．格数组■．格数组■返回包含行中所有单元格的一个数组。■◆853■设置或返回在行中数据的水平排列          简化命令：．对齐■．对齐■设置或返回在行中数据的水平排列。



定义和用法
align 属性可设置或返回数据在行中的水平对齐方式。
语法
tablerowObject.align=left|center|right|justify|char
实例
下面的例子更改了数据在行中的水平对齐方式：
<html>
<head>
<script type="text/javascript">
function leftAlign()
  {
  document.getElementById('header').align="left";
  }
</script>
</head>
<body>

<table width="100%" border="1">
<tr id="header">
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr>
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="leftAlign()"
value="Left-align table row" />

</body>
</html>
TIY
对齐行中的单元格内容■◆853■设置或返回行的 id                       简化命令：．id■．id■设置或返回行的 id。



定义和用法
id 属性设置或返回表格行的 id。
语法
tablerowObject.id=id
实例
下面的例子返回了表格行的 id：
<html>
<head>
<script type="text/javascript">
function alertId()
  {
  alert(document.getElementById('tr1').id);
  }
</script>
</head>

<body>
<table border="1">
<tr id="tr1">
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="alertId()"
value="Alert table row ID" />

</body>
</html>
TIY
取得表格行的 id■◆853■设置或返回行的开始和结束标签之间HTML    简化命令：．内容■．内容■设置或返回行的开始标签和结束标签之间的 HTML。



定义和用法
innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。
语法
tablerowObject.innerHTML=HTML
实例
下面的例子返回了表格行的 inner HTML：
<html>
<head>
<script type="text/javascript">
function getInnerHTML()
  {
  alert(document.getElementById("tr1").innerHTML);
  }
</script>
</head>
<body>

<table border="1">
<tr id="tr1">
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="getInnerHTML()" 
value="Alert innerHTML of table row" />

</body>
</html>
TIY
取得表格行的 inner HTML■◆853■返回该行在表中的位置                    简化命令：．行位置■．行位置■返回该行在表中的位置。




定义和用法
rowIndex 属性返回某一行在表格的行集合中的位置（row index）。
语法
tablerowObject.rowIndex
实例
下面的例子返回了某一行在表格中的位置：
<html>
<head>
<script type="text/javascript">
function alertRowIndex()
  {
  alert(document.getElementById("tr1").rowIndex);
  }
</script>
</head>
<body>

<table border="1">
<tr id="tr1">
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="alertRowIndex()"
value="Alert row index" />

</body>
</html>
TIY
返回某一行在表格的行集合中的位置■◆853■设置或返回在行中的数据的垂直排列方式    简化命令：．竖对齐■．竖对齐■设置或返回在行中的数据的垂直排列方式。




定义和用法
vAlign 属性设置或返回数据在行中的垂直对齐方式。
语法
tablerowObject.vAlign=top|bottom|middle|baseline
实例
下面的例子更改了数据在行中的垂直排列方式：
<html>
<head>
<script type="text/javascript">
function topAlign()
  {
  document.getElementById('tr2').vAlign="top";
  }
</script>
</head>
<body>

<table width="50%" border="1">
<tr id="tr1">
<th>Firstname</th>
<th>Lastname</th>
<th>Text</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
<td>Hello my name is Peter Griffin. 
I need a long text for this example. 
I need a long text for this example.</td>
</tr>
</table>
<br />
<input type="button" onclick="topAlign()"
value="Top-align table row" />

</body>
</html>
TIY
垂直对齐行中的单元格内容■◆853■删除行中的指定的单元格()                简化命令：．删格■．删格■删除行中的指定的单元格。



定义和用法
deleteCell() 方法用于删除表格行中的单元格（<td> 元素）。
语法
tablerowObject.deleteCell(index)
说明
参数 index 是要删除的表元在行中的位置。
该方法将删除表行中指定位置的表元。
抛出
若参数 index 小于 0 或大于等于行中的的表元数，该方法将抛出代码为 INDEX_SIZE_ERR 的 DOMException 异常。
实例
下面的例子从行中删除了一个单元格：
<html>
<head>
<script type="text/javascript">
function delCell()
  {
  document.getElementById('tr2').deleteCell(0)
  }
</script>
</head>
<body>

<table border="1">
<tr id="tr1">
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="delCell()" value="Delete cell">

</body>
</html>
TIY
删除行中的一个单元格■◆853■在一行中的指定位置插入一个空单元格()    简化命令：．插格■．插格■在一行中的指定位置插入一个空的 <td> 元素。



定义和用法
insertCell() 方法用于在 HTML 表的一行的指定位置插入一个空的 <td> 元素。
语法
tablerowObject.insertCell(index)
返回值
一个 TableCell 对象，表示新创建并被插入的 <td> 元素。
说明
该方法将创建一个新的 <td> 元素，把它插入行中指定的位置。新单元格将被插入当前位于 index 指定位置的表元之前。如果 index 等于行中的单元格数，则新单元格被附加在行的末尾。
请注意，该方法只能插入 <td> 数据表元。若需要给行添加头表元，必须用 Document.createElement() 方法和 Node.insertBefore() 方法（或相关的方法）创建并插入一个 <th> 元素。
抛出
若参数 index 小于 0 或大于等于行中的的表元数，该方法将抛出代码为 INDEX_SIZE_ERR 的 DOMException 异常。
实例
下面的例子在表格行中插入了一个单元格：
<html>
<head>
<script type="text/javascript">
function insCell()
  {
  var x=document.getElementById('tr2').insertCell(0)
  x.innerHTML="John"
  }
</script>
</head>
<body>

<table border="1">
<tr id="tr1">
<th>Firstname</th>
<th>Lastname</th>
</tr>
<tr id="tr2">
<td>Peter</td>
<td>Griffin</td>
</tr>
</table>
<br />
<input type="button" onclick="insCell()" value="Insert cell">

</body>
</html>
TIY
向一个已有的行中插入单元格
向表格添加新行 - 然后添加单元格和内容■◆345■文本区■文本区■Textarea 对象
Textarea 对象代表 HTML 表单中的一个文本区 (text-area)。在表单中 <textarea> 标签每出现一次，一个 Textarea 对象就会被创建。
您可以通过索引相应表单的元素数组来访问某个 Textarea 对象，或者使用 getElementById()。
IE: Internet Explorer, F: Firefox, O: Opera, W3C: W3C 标准.■◆862■设置或返回访问textarea的键盘快捷键      简化命令：．快捷键■．快捷键■设置或返回访问 textarea 的键盘快捷键。



定义和用法
accessKey 属性设置或返回访问文本框的键盘快捷字符。
注释：请使用 Alt + accessKey 为拥有指定快捷键的元素赋予焦点。
语法
textareaObject.accessKey=accessKey
实例
下面的例子为文本框规定了快捷键：
<html>
<head>
<script type="text/javascript">
function setAccessKey()
  {
  document.getElementById('txt1').accessKey="t"
  }
</script>
</head>
<body onload="setAccessKey()">

<textarea id="txt1">
Hello world....This is a text area
</textarea>

</body>
</html>■◆862■设置或返回 textarea 的宽度              简化命令：．列数■．列数■设置或返回 textarea 的宽度。



定义和用法
cols 属性设置或返回文本框的字符列的宽度。
语法
textareaObject.cols=number_of_columns
实例
下面的例子更改的文本框的宽度：
<html>
<head>
<script type="text/javascript">
function changeCols()
  {
  document.getElementById('txt1').cols="20";
  }
</script>
</head>
<body>

<textarea id="txt1">
Hello world....This is a text area
</textarea>
<br />
<input type="button" onclick="changeCols()" value="Change width" />

</body>
</html>■◆862■设置或返回文本框中的初始内容            简化命令：．初始值■．初始值■设置或返回文本框中的初始内容。




定义和用法
defaultValue 属性设置或返回文本框的初始内容。
注释：文本框的初始值是位于 <textarea> 和 </textarea> 标签之间的文本。在表单被重置时，文本框将被恢复为整个值。改变这个属性的值会改变文本框中当前显示的文本。
语法
textareaObject.defaultValue=text
实例
下面的例子提示出了文本框的默认值：
<html>
<head>
<script type="text/javascript">
function alertDefaultValue()
  {
  alert(document.getElementById('txt1').defaultValue);
  }
</script>
</head>
<body>

<textarea id="txt1">
Hello world....This is a text area
</textarea>
<br />
<input type="button" onclick="alertDefaultValue()" 
value="Alert default value" />

</body>
</html>■◆862■设置或返回textarea是否应当被禁用        简化命令：．禁用■．禁用■设置或返回 textarea 是否应当被禁用。




定义和用法
disabled 属性可设置或返回是否应禁用文本框。
语法
textareaObject.disabled=true|false
实例
下面的例子可禁用并启用文本框：
<html>
<head>
<script type="text/javascript">
function disable()
  {
  document.getElementById('txt1').disabled=true;
  }
function enable()
  {
  document.getElementById('txt1').disabled=false;
  }
</script>
</head>
<body>

<textarea id="txt1">
Hello world....This is a text area
</textarea>
<br />
<input type="button" onclick="disable()" value="Disable" />
<input type="button" onclick="enable()" value="Enable" />

</body>
</html>■◆862■返回对包含该textarea的表单对象的引用    简化命令：．表单■．表单■返回对包含该 textarea 的表单对象的引用。



定义和用法
form 属性返回对包含该 text area 的 表单的引用。
若成功，则该属性返回一个 form 对象。
语法
textareaObject.form
实例
本例返回 text area 所属的表单的 id：
<html>
<body>

<form id="form1">
<textarea id="txt1">
Hello world....This is a text area
</textarea>
</form>

<p>The id of the form containing the text area is:
<script type="text/javascript">
x=document.getElementById('txt1');
document.write(x.form.id);
</script>
</p>

</body>
</html>■◆862■设置或返回某个 textarea 的 id           简化命令：．id■．id■设置或返回某个 textarea 的 id。



定义和用法
id 属性设置或返回 textarea 的 id。
语法
textareaObject.id=id
实例
本例获取 textarea 的 id：
<html>
<head>
<script type="text/javascript">
function alertId()
  {
  alert(document.getElementById('txt1').id);
  }
</script>
</head>
<body>

<textarea id="txt1">
Hello world....This is a textarea
</textarea>
<br />
<input type="button" onclick="alertId()" value="Alert ID" />

</body>
</html>■◆862■设置或返回 textarea 的名称              简化命令：．名称■．名称■设置或返回 textarea 的名称。



定义和用法
name 属性设置或返回 textarea 的名称。
语法
textareaObject.name=text
实例
本例设置 textarea 的名称：
<html>
<head>
<script type="text/javascript">
function alertName()
  {
  alert(document.getElementById('txt1').name);
  }
</script>
</head>
<body>

<textarea id="txt1" name="textarea1">
Hello world....This is a text area
</textarea>
<br />
<input type="button" onclick="alertName()" value="Alert name" />

</body>
</html>■◆862■设置或返回textarea是否应当是只读的      简化命令：．只读■．只读■设置或返回 textarea 是否应当是只读的。




定义和用法
readOnly 属性设置或返回 textarea 是否为只读。
语法
textareaObject.readOnly=true|false
实例
本例把 textarea 设置为只读：
<html>
<head>
<script type="text/javascript">
function setReadOnly()
  {
  document.getElementById('txt1').readOnly=true;
  }
</script>
</head>
<body>

<textarea id="txt1">
Hello world....This is a text area
</textarea>
<br />
<input type="button" onclick="setReadOnly()" 
value="Make read-only" />

</body>
</html>■◆862■设置或返回 textarea 的高度              简化命令：．行数■．行数■设置或返回 textarea 的高度。



定义和用法
rows 属性设置或返回 textarea 的高度。
语法
textareaObject.rows=number_of rows
实例
本例改变 textarea 的高度：
<html>
<head>
<script type="text/javascript">
function changeRows()
  {
  document.getElementById('txt1').rows="15";
  }
</script>
</head>
<body>

<textarea id="txt1">
Hello world....This is a text area
</textarea>
<br />
<input type="button" onclick="changeRows()" value="Change height" />

</body>
</html>■◆862■设置或返回textarea的tab键控制次序       简化命令：．tab次序■．tab次序■设置或返回 textarea 的 tab 键控制次序。




定义和用法
tabIndex 属性设置或返回 textarea 的 tab 键控制次序。
语法
textareaObject.tabIndex=number
实例
本例输出不同表单域的 tab 键控制次序：
<html>
<head>
<script type="text/javascript">
function checkTab(x)
  {
  alert(x.tabIndex)
  }
</script>
</head>
<body>

<form>
<textarea id="txt1" tabindex="1" onclick="checkTab(this)">
Hello world....This is a text area
</textarea>
<input id="txt2" type="text" tabindex="2" onclick="checkTab(this)">
<input id="txt3" type="text" tabindex="3" onclick="checkTab(this)">
</form>

</body>
</html>■◆862■返回该文本框的表单类型                  简化命令：．类型■．类型■返回该文本框的表单类型。



定义和用法
type 属性返回表单元素的类型。对于 text area，永远是 "textarea"。
语法
textareaObject.type
实例
本例返回 textarea 元素所属的表单类型：
<html>
<head>
<script type="text/javascript">
function alertType()
  {
  alert(document.getElementById('txt1').type);
  }
</script>
</head>
<body>

<textarea id="txt1">
Hello world....This is a text area
</textarea>
<br />
<input type="button" onclick="alertType()" value="Alert type" />

</body>
</html>■◆862■设置或返回在 textarea 中的文本          简化命令：．值■．值■设置或返回在 textarea 中的文本。



定义和用法
value 属性设置或返回 textarea 的文本。
语法
textareaObject.value=text
实例
本例返回 textarea 元素的文本：
<html>
<head>
<script type="text/javascript">
function alertValue()
  {
  alert(document.getElementById('txt1').value);
  }
</script>
</head>
<body>

<textarea id="txt1">
Hello world....This is a text area
</textarea>
<br />
<input type="button" onclick="alertValue()" value="Alert value" />

</body>
</html>■◆862■从 textarea 移开焦点()                  简化命令：．移焦■．移焦■从 textarea 移开焦点。



定义和用法
blur() 方法用于把键盘焦点从该元素上移开。
语法
textareaObject.blur()
实例
下面的例子设置并移开了文本框上的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('txt1').focus()
  }
function loseFocus()
  {
  document.getElementById('txt1').blur()
  }
</script>
</head>
<body>

<textarea id="txt1">Hello world....</textarea>
<br />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />

</body>
</html>■◆862■在 textarea 上设置焦点()                简化命令：．给焦■．给焦■在 textarea 上设置焦点。



定义和用法
focus() 方法用于给予该元素焦点。这样用户不必点击它，就能编辑显示的文本了。
语法
textareaObject.focus()
实例
下面的例子设置并移开了文本框上的焦点：
<html>
<head>
<script type="text/javascript">
function setFocus()
  {
  document.getElementById('txt1').focus()
  }
function loseFocus()
  {
  document.getElementById('txt1').blur()
  }
</script>
</head>
<body>

<textarea id="txt1">Hello world....</textarea>
<br />
<input type="button" onclick="setFocus()" value="Set focus" />
<input type="button" onclick="loseFocus()" value="Lose focus" />

</body>
</html>■◆862■选择 textarea 中的文本()                简化命令：．选取■．选取■选择 textarea 中的文本。



定义和用法
select() 方法用于选择该元素中的文本。
语法
textareaObject.select()
实例
下面的例子可选择文本框中的文本：
<html>
<head>
<script type="text/javascript">
function selText()
  {
  document.getElementById("txt1").select()
  }
</script>
</head>
<body>

<textarea id="txt1">Hello world....</textarea>
<input type="button" value="Select text" onclick="selText()">

</body>
</html>■◆862■当输入值改变时调用的事件句柄  事件句柄！简化命令：．被改■．被改■当输入值改变时调用的事件句柄



定义和用法
select() 方法用于选择该元素中的文本。
语法
textareaObject.onchange
说明
Textarea 的 onchange 属性引用了一个事件句柄函数，当用户改变文本区域的值然后通过把键盘焦点移动到其他地方“确认”这些改变的时候，调用该句柄。
请注意，当一个 Text 对象的 value 属性通过 JavaScript 设置的时候，onchange 事件句柄不会调用。还要注意，该句柄是为了处理对输入值的一次完整改变，因此，它不会在逐个按键的基础上调用。■◆-1■作者设定命令集合■■定义和用法
作者设定对一些常用大代码段的简化■◆-1■数据库版本为００００１■■定义和用法
作者设定对一些常用大代码段的简化■◆-1■CSS中文命令表■■位于CSS标签内部■◆881■所有背景属性                  简化命令：背景■背景■CSS background 属性
CSS 参考手册
定义和用法
background 简写属性在一个声明中设置所有的背景属性。

可以按顺序设置如下属性：

?background-color
?background-image
?background-repeat
?background-attachment
?background-position
如果不设置其中的某个值，也不会出问题，比如 background:#ff0000 url('smiley.gif'); 也是允许的。

通常建议使用这个属性，而不是分别使用单个属性，因为这个属性在较老的浏览器中能够得到更好的支持，而且需要键入的字母也更少。

■◆881■背景图像是否固定或者滚动      简化命令：景图状态■景图状态■CSS background-attachment 属性
CSS 参考手册
定义和用法
background-attachment 属性设置背景图像是否固定或者随着页面的其余部分滚动。

■◆881■背景颜色                      简化命令：景色■景色■CSS background-color 属性
CSS 参考手册
定义和用法
background-color 属性设置元素的背景颜色。

元素背景的范围
background-color 属性为元素设置一种纯色。这种颜色会填充元素的内容、内边距和边框区域，扩展到元素边框的外边界（但不包括外边距）。如果边框有透明部分（如虚线边框），会透过这些透明部分显示出背景色。

transparent 值
尽管在大多数情况下，没有必要使用 transparent。不过如果您不希望某元素拥有背景色，同时又不希望用户对浏览器的颜色设置影响到您的设计，那么设置 transparent 值还是有必要的。

■◆881■背景图像                      简化命令：景图■景图■CSS background-image 属性
CSS 参考手册
定义和用法
background-image 属性为元素设置背景图像。

元素的背景占据了元素的全部尺寸，包括内边距和边框，但不包括外边距。

默认地，背景图像位于元素的左上角，并在水平和垂直方向上重复。

提示：请设置一种可用的背景颜色，这样的话，假如背景图像不可用，页面也可获得良好的视觉效果。

详细说明
background-image 属性会在元素的背景中设置一个图像。

根据 background-repeat 属性的值，图像可以无限平铺、沿着某个轴（x 轴或 y 轴）平铺，或者根本不平铺。

初始背景图像（原图像）根据 background-position 属性的值放置。

■◆881■背景图像开始位置              简化命令：景图起始■景图起始■CSS background-position 属性
CSS 参考手册
定义和用法
background-position 属性设置背景图像的起始位置。

这个属性设置背景原图像（由 background-image 定义）的位置，背景图像如果要重复，将从这一点开始。

提示：您需要把 background-attachment 属性设置为 "fixed"，才能保证该属性在 Firefox 和 Opera 中正常工作。

■◆881■是否及如何重复背景图像        简化命令：景图重复■景图重复■CSS background-repeat 属性
CSS 参考手册
定义和用法
background-repeat 属性设置是否及如何重复背景图像。

默认地，背景图像在水平和垂直方向上重复。

详细说明
background-repeat 属性定义了图像的平铺模式。

从原图像开始重复，原图像由 background-image 定义，并根据 background-position 的值放置。

■◆881■所有的边框属性                简化命令：边框■边框■CSS border 属性
CSS 参考手册
定义和用法
border 简写属性在一个声明设置所有的边框属性。

可以按顺序设置如下属性：

?border-width
?border-style
?border-color
如果不设置其中的某个值，也不会出问题，比如 border:solid #ff0000; 也是允许的。

■◆881■下边框属性                    简化命令：下边框■下边框■CSS border-bottom 属性
CSS 参考手册
定义和用法
border-bottom 简写属性把下边框的所有属性设置到一个声明中。

可以按顺序设置如下属性：

?border-bottom-width
?border-bottom-style
?border-bottom-color
如果不设置其中的某个值，也不会出问题，比如 border-bottom:solid #ff0000; 也是允许的
■◆881■下边框的颜色                  简化命令：下框色■下框色■CSS border-bottom-color 属性
CSS 参考手册
定义和用法
border-bottom-color 设置元素的下边框的颜色。

只能定义纯色，而且只有当边框的样式是一个非 none 或 hidden 的值时边框才可能出现。

注释：请始终把 border-style 属性声明到 border-color 属性之前。元素必须在您改变其颜色之前获得边框。

■◆881■下边框的样式                  简化命令：下边框■下边框■CSS border-bottom-style 属性
CSS 参考手册
定义和用法
border-bottom-style 设置元素下边框的样式。

只有当这个值不是 none 时边框才可能出现。

在 CSS1 中，HTML 用户代理只需支持 solid 和 none。

■◆881■下边框的宽度                  简化命令：下框宽■下框宽■CSS border-bottom-width 属性
CSS 参考手册
定义和用法
border-bottom-width 属性设置元素的下边框的宽度。

只有当边框样式不是 none 时才起作用。如果边框样式是 none，边框宽度实际上会重置为 0。不允许指定负长度值。

注释：请始终在 border-bottom-width 属性之前声明 border-style 属性。元素只有在获得边框之后，才能改变其边框的宽度。

■◆881■四条边框的颜色                简化命令：边框色■边框色■CSS border-color 属性
CSS 参考手册
定义和用法
border-color 属性设置四条边框的颜色。此属性可设置 1 到 4 种颜色。

border-color 属性是一个简写属性，可设置一个元素的所有边框中可见部分的颜色，或者为 4 个边分别设置不同的颜色。
■◆881■设置所有的左边框属性          简化命令：左边框■左边框■CSS border-left 属性
CSS 参考手册
定义和用法
border-left 简写属性把左边框的所有属性设置到一个声明中。

可以按顺序设置如下属性：

?border-left-width
?border-left-style
?border-left-color
如果不设置其中的某个值，也不会出问题，比如 border-left:solid #ff0000; 也是允许的。

■◆881■左边框的颜色                  简化命令：左框色■左框色■CSS border-left-color 属性
CSS 参考手册
定义和用法
border-left-color 设置元素的左边框的颜色。

只能定义纯色，而且只有当边框的样式是一个非 none 或 hidden 的值时边框才可能出现。

注释：请始终把 border-style 属性声明到 border-color 属性之前。元素必须在您改变其颜色之前获得边框。

■◆881■左边框的样式                  简化命令：左边框■左边框■CSS border-left-style 属性
CSS 参考手册
定义和用法
border-left-style 设置元素左边框的样式。

只有当这个值不是 none 时边框才可能出现。

在 CSS1 中，HTML 用户代理只需支持 solid 和 none。

■◆881■左边框的宽度                  简化命令：左框宽■左框宽■CSS border-left-width 属性
CSS 参考手册
定义和用法
border-left-width 属性设置元素的左边框的宽度。

只有当边框样式不是 none 时才起作用。如果边框样式是 none，边框宽度实际上会重置为 0。不允许指定负长度值。

注释：请始终在 border-left-width 属性之前声明 border-style 属性。元素只有在获得边框之后，才能改变其边框的宽度。

■◆881■右边框属性                    简化命令：右边框■右边框■CSS border-right 属性
CSS 参考手册
定义和用法
border-right 简写属性把右边框的所有属性设置到一个声明中。

可以按顺序设置如下属性：

?border-right-width
?border-right-style
?border-right-color
如果不设置其中的某个值，也不会出问题，比如 border-right:solid #ff0000; 也是允许的。

■◆881■右边框的颜色                  简化命令：右框色■右框色■CSS border-right-color 属性
CSS 参考手册
定义和用法
border-right-color 设置元素的右边框的颜色。

只能定义纯色，而且只有当边框的样式是一个非 none 或 hidden 的值时边框才可能出现。

注释：请始终把 border-style 属性声明到 border-color 属性之前。元素必须在您改变其颜色之前获得边框
■◆881■右边框的样式                  简化命令：右边框■右边框■CSS border-right-style 属性
CSS 参考手册
定义和用法
border-right-style 设置元素右边框的样式。

只有当这个值不是 none 时边框才可能出现。

在 CSS1 中，HTML 用户代理只需支持 solid 和 none。

■◆881■右边框的宽度                  简化命令：右框宽■右框宽■CSS border-right-width 属性
CSS 参考手册
定义和用法
border-right-width 属性设置元素的右边框的宽度。

只有当边框样式不是 none 时才起作用。如果边框样式是 none，边框宽度实际上会重置为 0。不允许指定负长度值。

注释：请始终在 border-right-width 属性之前声明 border-style 属性。元素只有在获得边框之后，才能改变其边框的宽度。

■◆881■四条边框的样式                简化命令：边框样式■边框样式■CSS border-style 属性
CSS 参考手册
定义和用法
border-style 属性用于设置元素所有边框的样式，或者单独地为各边设置边框样式。

只有当这个值不是 none 时边框才可能出现。

例子 1
border-style:dotted solid double dashed; ?上边框是点状
?右边框是实线
?下边框是双线
?左边框是虚线
例子 2
border-style:dotted solid double;?上边框是点状
?右边框和左边框是实线
?下边框是双线
例子 3
border-style:dotted solid;?上边框和下边框是点状
?右边框和左边框是实线
例子 4
border-style:dotted;?所有 4 个边框都是点状
■◆881■上边框属性                    简化命令：上边框■上边框■CSS border-top 属性
CSS 参考手册
定义和用法
border-top 简写属性把上边框的所有属性设置到一个声明中。

可以按顺序设置如下属性：

?border-top-width
?border-top-style
?border-top-color
如果不设置其中的某个值，也不会出问题，比如 border-top:solid #ff0000; 也是允许的。

■◆881■上边框的颜色                  简化命令：上框色■上框色■CSS border-top-color 属性
CSS 参考手册
定义和用法
border-top-color 设置元素的上边框的颜色。

只能定义纯色，而且只有当边框的样式是一个非 none 或 hidden 的值时边框才可能出现。

注释：请始终把 border-style 属性声明到 border-color 属性之前。元素必须在您改变其颜色之前获得边框。

■◆881■上边框的样式                  简化命令：上框样式■上框样式■CSS border-top-style 属性
CSS 参考手册
定义和用法
border-top-style 设置元素上边框的样式。

只有当这个值不是 none 时边框才可能出现。

在 CSS1 中，HTML 用户代理只需支持 solid 和 none。

■◆881■上边框的宽度                  简化命令：上框宽■上框宽■CSS border-top-width 属性
CSS 参考手册
定义和用法
border-top-width 属性设置元素的上边框的宽度。

只有当边框样式不是 none 时才起作用。如果边框样式是 none，边框宽度实际上会重置为 0。不允许指定负长度值。

注释：请始终在 border-top-width 属性之前声明 border-style 属性。元素只有在获得边框之后，才能改变其边框的宽度。

■◆881■四条边框的宽度                简化命令：边框宽■边框宽■CSS border-width 属性
CSS 参考手册
定义和用法
border-width 简写属性为元素的所有边框设置宽度，或者单独地为各边边框设置宽度。

只有当边框样式不是 none 时才起作用。如果边框样式是 none，边框宽度实际上会重置为 0。不允许指定负长度值。

例子 1
border-width:thin medium thick 10px;?上边框是细边框
?右边框是中等边框
?下边框是粗边框
?左边框是 10px 宽的边框
例子 2
border-width:thin medium thick;?上边框是 10px
?右边框和左边框是中等边框
?下边框是粗边框
例子 3
border-width:thin medium;?上边框和下边框是细边框
?右边框和左边框是中等边框
例子 4
border-width:thin;?所有 4 个边框都是细边框
■◆881■所有的轮廓属性                简化命令：轮廓■轮廓■CSS outline 属性
CSS 参考手册
定义和用法
outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。

注释：轮廓线不会占据空间，也不一定是矩形。

outline 简写属性在一个声明中设置所有的轮廓属性。

可以按顺序设置如下属性：

?outline-color
?outline-style
?outline-width
如果不设置其中的某个值，也不会出问题，比如 outline:solid #ff0000; 也是允许的
■◆881■轮廓的颜色                    简化命令：轮廓色■轮廓色■CSS outline-color 属性
CSS 参考手册
定义和用法
outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。outline 属性可设置元素周围的轮廓线。

注释：请始终在 outline-color 属性之前声明 outline-style 属性。元素只有获得轮廓以后才能改变其轮廓的颜色。

注释：轮廓线不会占据空间，也不一定是矩形。

outline-color 属性设置一个元素整个轮廓中可见部分的颜色。要记住，轮廓的样式不能是 none，否则轮廓不会出现。

■◆881■轮廓的样式                    简化命令：轮廓样式■轮廓样式■CSS outline-style 属性
CSS 参考手册
定义和用法
outline-style 属性用于设置元素的整个轮廓的样式。样式不能是 none，否则轮廓不会出现。

outline （轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。outline 属性设置元素周围的轮廓线。

注释：请始终在 outline-color 属性之前声明 outline-style 属性。元素只有获得轮廓以后才能改变其轮廓的颜色。

注释：轮廓线不会占据空间，也不一定是矩形。

■◆881■轮廓的宽度                    简化命令：轮廓宽■轮廓宽■CSS outline-width 属性
CSS 参考手册
定义和用法
outline-width 属性设置元素整个轮廓的宽度，只有当轮廓样式不是 none 时，这个宽度才会起作用。如果样式为 none，宽度实际上会重置为 0。不允许设置负长度值。

outline（轮廓）是绘制于元素周围的一条线，位于边框边缘的外围，可起到突出元素的作用。outline 属性设置元素周围的轮廓线。

注释：请始终在 outline-width 属性之前声明 outline-style 属性。元素只有获得轮廓以后才能改变其轮廓的颜色。

注释：轮廓线不会占据空间，也不一定是矩形。

■◆881■文本的颜色                    简化命令：文本色■文本色■CSS color 属性
CSS 参考手册
定义和用法
color 属性规定文本的颜色。

这个属性设置了一个元素的前景色（在 HTML 表现中，就是元素文本的颜色）；光栅图像不受 color 影响。这个颜色还会应用到元素的所有边框，除非被 border-color 或另外某个边框颜色属性覆盖。

要设置一个元素的前景色，最容易的方法是使用 color 属性。

■◆881■文本方向                      简化命令：文本方向■文本方向■CSS direction 属性
CSS 参考手册
定义和用法
direction 属性规定文本的方向 / 书写方向。

该属性指定了块的基本书写方向，以及针对 Unicode 双向算法的嵌入和覆盖方向。不支持双向文本的用户代理可以忽略这个属性。

■◆881■字符间距                      简化命令：字间距■字间距■CSS letter-spacing 属性
CSS 参考手册
定义和用法
letter-spacing 属性增加或减少字符间的空白（字符间距）。

该属性定义了在文本字符框之间插入多少空间。由于字符字形通常比其字符框要窄，指定长度值时，会调整字母之间通常的间隔。因此，normal 就相当于值为 0。

注释：允许使用负值，这会让字母之间挤得更紧。

■◆881■行高                          简化命令：行高■行高■CSS line-height 属性
CSS 参考手册
定义和用法
line-height 属性设置行间的距离（行高）。

注释：不允许使用负值。

说明
该属性会影响行框的布局。在应用到一个块级元素时，它定义了该元素中基线之间的最小距离而不是最大距离。

line-height 与 font-size 的计算值之差（在 CSS 中成为“行间距”）分为两半，分别加到一个文本行内容的顶部和底部。可以包含这些内容的最小框就是行框。

原始数字值指定了一个缩放因子，后代元素会继承这个缩放因子而不是计算值。

■◆881■文本的水平对齐方式            简化命令：文横对齐■文横对齐■CSS text-align 属性
CSS 参考手册
定义和用法
text-align 属性规定元素中的文本的水平对齐方式。

该属性通过指定行框与哪个点对齐，从而设置块级元素内文本的水平对齐方式。通过允许用户代理调整行内容中字母和字之间的间隔，可以支持值 justify；不同用户代理可能会得到不同的结果。

■◆881■装饰效果                      简化命令：装饰效果■装饰效果■CSS text-decoration 属性
CSS 参考手册
定义和用法
text-decoration 属性规定添加到文本的修饰。

注释：修饰的颜色由 "color" 属性设置。

说明
这个属性允许对文本设置某种效果，如加下划线。如果后代元素没有自己的装饰，祖先元素上设置的装饰会“延伸”到后代元素中。不要求用户代理支持 blink。

■◆881■块首行的缩进                  简化命令：块首行缩进■块首行缩进■CSS text-indent 属性
CSS 参考手册
定义
text-indent 属性规定文本块中首行文本的缩进。

注释：允许使用负值。如果使用负值，那么首行会被缩进到左边。

注意：在 CSS 2.1 之前，text-indent 总是继承计算值，而不是声明值。

说明
用于定义块级元素中第一个内容行的缩进。这最常用于建立一个“标签页”效果。允许指定负值，这会产生一种“悬挂缩进”的效果。

■◆881■阴影效果                      简化命令：阴影效果■阴影效果■规定添加到文本的阴影效果。■◆881■大小写                        简化命令：大小写■大小写■CSS text-transform 属性
CSS 参考手册
定义和用法
text-transform 属性控制文本的大小写。

说明
这个属性会改变元素中的字母大小写，而不论源文档中文本的大小写。如果值为 capitalize，则要对某些字母大写，但是并没有明确定义如何确定哪些字母要大写，这取决于用户代理如何识别出各个“词”。

■◆881■文本方向                      简化命令：文本方向■文本方向■CSS unicode-bidi 属性
CSS 参考手册
定义
unicode-bidi 属性设置文本的方向。

继承性：Yes

说明
尽管 CSS 试图处理书写方向，但 Unicode 有一种更健壮的方式来处理方向性。利用属性 unicode-bidi，CSS 创作人员可以充分利用 Unicode 的某些功能。
■◆881■如何处理元素中的空白          简化命令：元素空白■元素空白■CSS white-space 属性
CSS 参考手册
定义和用法
white-space 属性设置如何处理元素内的空白。

这个属性声明建立布局过程中如何处理元素中的空白符。值 pre-wrap 和 pre-line 是 CSS 2.1 中新增的。

■◆881■单词间距                      简化命令：单词间距■单词间距■CSS word-spacing 属性
CSS 参考手册
定义
word-spacing 属性增加或减少单词间的空白（即字间隔）。

该属性定义元素中字之间插入多少空白符。针对这个属性，“字” 定义为由空白符包围的一个字符串。如果指定为长度值，会调整字之间的通常间隔；所以，normal 就等同于设置为 0。允许指定负长度值，这会让字之间挤得更紧。

注释：允许使用负值。

■◆881■所有字体属性                  简化命令：字体■字体■CSS font 属性
CSS 参考手册
定义和用法
font 简写属性在一个声明中设置所有字体属性。

注释：此属性也有第六个值："line-height"，可设置行间距。

说明
这个简写属性用于一次设置元素字体的两个或更多方面。使用 icon 等关键字可以适当地设置元素的字体，使之与用户计算机环境中的某个方面一致。注意，如果没有使用这些关键词，至少要指定字体大小和字体系列。

可以按顺序设置如下属性：

?font-style
?font-variant
?font-weight
?font-size/line-height
?font-family
可以不设置其中的某个值，比如 font:100% verdana; 也是允许的。未设置的属性会使用其默认值。

■◆881■字体系列                      简化命令：字体系列■字体系列■CSS font-family 属性
CSS 参考手册
定义和用法
font-family 规定元素的字体系列。

font-family 可以把多个字体名称作为一个“回退”系统来保存。如果浏览器不支持第一个字体，则会尝试下一个。也就是说，font-family 属性的值是用于某个元素的字体族名称或/及类族名称的一个优先表。浏览器会使用它可识别的第一个值。

有两种类型的字体系列名称：

?指定的系列名称：具体字体的名称，比如："times"、"courier"、"arial"。
?通常字体系列名称：比如："serif"、"sans-serif"、"cursive"、"fantasy"、"monospace"
提示：使用逗号分割每个值，并始终提供一个类族名称作为最后的选择。

注意：使用某种特定的字体系列（Geneva）完全取决于用户机器上该字体系列是否可用；这个属性没有指示任何字体下载。因此，强烈推荐使用一个通用字体系列名作为后路。

■◆881■字体尺寸                      简化命令：字体尺寸■字体尺寸■CSS font-size 属性
CSS 参考手册
定义和用法
font-size 属性可设置字体的尺寸。

说明
该属性设置元素的字体大小。注意，实际上它设置的是字体中字符框的高度；实际的字符字形可能比这些框高或矮（通常会矮）。

各关键字对应的字体必须比一个最小关键字相应字体要高，并且要小于下一个最大关键字对应的字体。

■◆881■规定 aspect 值                简化命令：aspect值■aspect值■CSS font-size-adjust 属性
CSS 参考手册
定义和用法
font-size-adjust 属性为某个元素规定一个 aspect 值，这样就可以保持首选字体的 x-height。

说明
字体的小写字母 "x" 的高度与 "font-size" 高度之间的比率被称为一个字体的 aspect 值。当字体拥有高的 aspect 值时，那么当此字体被设置为很小的尺寸时会更易阅读。举例：Verdana 的 aspect 值是 0.58（意味着当字体尺寸为 100px 时，它的 x-height 是 58px ）。Times New Roman 的 aspect 值是 0.46。这就意味着 Verdana 在小尺寸时比 Times New Roman 更易阅读。

■◆881■收缩或拉伸                    简化命令：收缩拉伸■收缩拉伸■CSS font-stretch 属性
CSS 参考手册
定义和用法
font-stretch 属性可对当前的 font-family 进行伸缩变形。

■◆881■字体样式                      简化命令：字体样式■字体样式■CSS font-style 属性
CSS 参考手册
定义和用法
font-style 属性定义字体的风格。

说明
该属性设置使用斜体、倾斜或正常字体。斜体字体通常定义为字体系列中的一个单独的字体。理论上讲，用户代理可以根据正常字体计算一个斜体字体。

■◆881■小型大写字母                  简化命令：小型大写■小型大写■CSS font-variant 属性
CSS 参考手册
定义和用法
font-variant 属性设置小型大写字母的字体显示文本，这意味着所有的小写字母均会被转换为大写，但是所有使用小型大写字体的字母与其余文本相比，其字体尺寸更小。

说明
该属性主要用于定义小型大写字母文本。理论上，用户代理可以根据正常字体计算出小型大写字母字体。

■◆881■字体的粗细                    简化命令：字体粗细■字体粗细■CSS font-weight 属性
CSS 参考手册
定义和用法
font-weight 属性设置文本的粗细。

说明
该属性用于设置显示元素的文本中所用的字体加粗。数字值 400 相当于 关键字 normal，700 等价于 bold。每个数字值对应的字体加粗必须至少与下一个最小数字一样细，而且至少与下一个最大数字一样粗。

■◆881■所有外边距属性                简化命令：外边距■外边距■CSS margin 属性
CSS 参考手册
定义和用法
margin 简写属性在一个声明中设置所有外边距属性。该属性可以有 1 到 4 个值。

说明
这个简写属性设置一个元素所有外边距的宽度，或者设置各边上外边距的宽度。

块级元素的垂直相邻外边距会合并，而行内元素实际上不占上下外边距。行内元素的的左右外边距不会合并。同样地，浮动元素的外边距也不会合并。允许指定负的外边距值，不过使用时要小心。

注释：允许使用负值。

例子 1
margin:10px 5px 15px 20px;?上外边距是 10px
?右外边距是 5px
?下外边距是 15px
?左外边距是 20px
例子 2
margin:10px 5px 15px;?上外边距是 10px
?右外边距和左外边距是 5px
?下外边距是 15px
例子 3
margin:10px 5px;?上外边距和下外边距是 10px
?右外边距和左外边距是 5px
例子 4
margin:10px;?所有 4 个外边距都是 10px
■◆881■下外边距                      简化命令：下外边距■下外边距■CSS margin-bottom 属性
CSS 参考手册
定义和用法
margin-bottom 属性设置元素的下外边距。

注释：允许使用负值。

■◆881■左外边距                      简化命令：左外边距■左外边距■CSS margin-left 属性
CSS 参考手册
定义和用法
margin-left 属性设置元素的左外边距。

注释：允许使用负值。

■◆881■右外边距                      简化命令：右外边距■右外边距■CSS margin-right 属性
CSS 参考手册
定义和用法
margin-right 属性设置元素的右外边距。

注释：允许使用负值。

■◆881■上外边距                      简化命令：上外边距■上外边距■CSS margin-top 属性
CSS 参考手册
定义和用法
margin-top 属性设置元素的上外边距。

注释：允许使用负值。

■◆881■所有内边距属性                简化命令：内边距■内边距■CSS padding 属性
CSS 参考手册
定义和用法
padding 简写属性在一个声明中设置所有内边距属性。

说明
这个简写属性设置元素所有内边距的宽度，或者设置各边上内边距的宽度。行内非替换元素上设置的内边距不会影响行高计算；因此，如果一个元素既有内边距又有背景，从视觉上看可能会延伸到其他行，有可能还会与其他内容重叠。元素的背景会延伸穿过内边距。不允许指定负边距值。

注释：不允许使用负值。

例子 1
padding:10px 5px 15px 20px;?上内边距是 10px
?右内边距是 5px
?下内边距是 15px
?左内边距是 20px
例子 2
padding:10px 5px 15px;?上内边距是 10px
?右内边距和左内边距是 5px
?下内边距是 15px
例子 3
padding:10px 5px;?上内边距和下内边距是 10px
?右内边距和左内边距是 5px
例子 4
padding:10px;?所有 4 个内边距都是 10px
■◆881■下内边距                      简化命令：下内边距■下内边距■CSS padding-bottom 属性
CSS 参考手册
定义和用法
padding-bottom 属性设置元素的下内边距（底部空白）。

说明
该属性设置元素下内边距的宽度。行内非替换元素上设置的下内边距不会影响行高计算，因此，如果一个元素既有内边距又有背景，从视觉上看可能延伸到其他行，有可能还会与其他内容重叠。不允许指定负内边距值。

注释：不允许使用负值。

■◆881■左内边距                      简化命令：左内边距■左内边距■CSS padding-left 属性
CSS 参考手册
定义和用法
padding-left 属性设置元素左内边距（空白）。

说明
该属性设置元素左内边距的宽度。行内非替换元素上设置的左内边距仅在元素所生成的第一个行内框的左边出现.

注释：不允许使用负值。

■◆881■右内边距                      简化命令：右内边距■右内边距■CSS padding-right 属性
CSS 参考手册
定义和用法
padding-right 属性设置元素右内边距（空白）。

注释：不允许使用负值。

说明
该属性设置元素右内边距的宽度。行内非替换元素上设置的右内边距仅在元素所生成的第一个行内框的右边出现.

■◆881■上内边距                      简化命令：上内边距■上内边距■CSS padding-top 属性
CSS 参考手册
定义和用法
padding-top 属性设置元素的上内边距（空间）。

说明
该属性设置元素上内边距的宽度。行内非替换元素上设置的上内边距不会影响行高计算，因此，如果一个元素既有内边距又有背景，从视觉上看可能延伸到其他行，有可能还会与其他内容重叠。不允许指定负内边距值。

注释：不允许使用负值。

■◆881■所有的列表属性                简化命令：列表■列表■CSS list-style 属性
CSS 参考手册
定义和用法
list-style 简写属性在一个声明中设置所有的列表属性。

说明
该属性是一个简写属性，涵盖了所有其他列表样式属性。由于它应用到所有 display 为 list-item 的元素，所以在普通的 HTML 和 XHTML 中只能用于 li 元素，不过实际上它可以应用到任何元素，并由 list-item 元素继承。

可以按顺序设置如下属性：

?list-style-type
?list-style-position
?list-style-image
可以不设置其中的某个值，比如 "list-style:circle inside;" 也是允许的。未设置的属性会使用其默认值。

■◆881■图象列表项标记                简化命令：图象标记■图象标记■CSS list-style-image 属性
CSS 参考手册
定义和用法
list-style-image 属性使用图像来替换列表项的标记。

说明
这个属性指定作为一个有序或无序列表项标志的图像。图像相对于列表项内容的放置位置通常使用 list-style-position 属性控制。

注释：请始终规定一个 "list-style-type" 属性以防图像不可用。

■◆881■列表项标记的放置位置          简化命令：标记位置■标记位置■CSS list-style-position 属性
CSS 参考手册
定义和用法
list-style-position 属性设置在何处放置列表项标记。

说明
该属性用于声明列表标志相对于列表项内容的位置。外部 (outside) 标志会放在离列表项边框边界一定距离处，不过这距离在 CSS 中未定义。内部 (inside) 标志处理为好像它们是插入在列表项内容最前面的行内元素一样。

■◆881■列表项标记的类型              简化命令：标记类型■标记类型■CSS list-style-type 属性
CSS 参考手册
定义和用法
list-style-type 属性设置列表项标记的类型
■◆881■水平补白                      简化命令：水平补白■水平补白■marker-offset后面可以是auto 或者 length

　　其中

　　auto : 　浏览器自动设置间距

　　length : 　由浮点数字和单位标识符组成的长度值。可为负值。请参阅长度单位 

　　marker-offset说明： 

　　设置或检索标记容器和主容器之间水平补白。即两个容器靠近的一边的间距。

　　目前IE5.5尚不支持此属性。

　　对应的脚本特性为markerOffset。请参阅我编写的其他书目。 

　　marker-offset代码示例：

li:before { display: marker; marker-offset: 5px; }

■◆881■插入生成内容                  简化命令：插入内容■插入内容■CSS content 属性
CSS 参考手册
定义和用法
content 属性与 :before 及 :after 伪元素配合使用，来插入生成内容。

说明
该属性用于定义元素之前或之后放置的生成内容。默认地，这往往是行内内容，不过该内容创建的框类型可以用属性 display 控制。

■◆881■递增或递减一个或多个计数器    简化命令：计数器增量■计数器增量■CSS counter-increment 属性
CSS 参考手册
定义和用法
counter-increment 属性设置某个选取器每次出现的计数器增量。默认增量是 1。

说明
利用这个属性，计数器可以递增（或递减）某个值，这可以是正值或负值。如果没有提供 number 值，则默认为 1。

注释：如果使用了 "display: none"，则无法增加计数。如使用 "visibility: hidden"，则可增加计数。

■◆881■创建或重置一个或多个计数器    简化命令：创置计数器■创置计数器■CSS counter-reset 属性
CSS 参考手册
定义和用法
counter-reset 属性设置某个选择器出现次数的计数器的值。默认为 0。

利用这个属性，计数器可以设置或重置为任何值，可以是正值或负值。如果没有提供 number，则默认为 0。

注释：如果使用 "display: none"，则无法重置计数器。如果使用 "visibility: hidden"，则可以重置计数器。

■◆881■嵌套引用的引号类型            简化命令：嵌套引号类型■嵌套引号类型■CSS quotes 属性
CSS 参考手册
定义和用法
quotes 属性设置嵌套引用（embedded quotation）的引号类型。

■◆881■高度                          简化命令：高度■高度■CSS height 属性
CSS 参考手册
定义和用法
height 属性设置元素的高度。

说明
这个属性定义元素内容区的高度，在内容区外面可以增加内边距、边框和外边距。

行内非替换元素会忽略这个属性。

■◆881■最大高度                      简化命令：最大高度■最大高度■CSS max-height 属性
CSS 参考手册
定义和用法
max-height 属性设置元素的最大高度。

说明
该属性值会对元素的高度设置一个最高限制。因此，元素可以比指定值矮，但不能比其高。不允许指定负值。

注释：max-height 属性不包括外边距、边框和内边距。

■◆881■最小高度                      简化命令：最小高度■最小高度■CSS min-height 属性
CSS 参考手册
定义和用法
min-height 属性设置元素的最小高度。

说明
该属性值会对元素的高度设置一个最低限制。因此，元素可以比指定值高，但不能比其矮。不允许指定负值。

■◆881■最小宽度                      简化命令：最小宽度■最小宽度■CSS min-width 属性
CSS 参考手册
定义和用法
min-width 属性设置元素的最小宽度。

说明
该属性值会对元素的宽度设置一个最小限制。因此，元素可以比指定值宽，但不能比其窄。不允许指定负值。

■◆881■宽度                          简化命令：宽度■宽度■CSS width 属性
CSS 参考手册
定义和用法
width 属性设置元素的宽度。

说明
这个属性定义元素内容区的宽度，在内容区外面可以增加内边距、边框和外边距。

行内非替换元素会忽略这个属性。

■◆881■元素的底部边缘                简化命令：底边缘■底边缘■CSS bottom 属性
CSS 参考手册
定义和用法
bottom 属性规定元素的底部边缘。该属性定义了定位元素下外边距边界与其包含块下边界之间的偏移。

注释：如果 "position" 属性的值为 "static"，那么设置 "bottom" 属性不会产生任何效果。

说明
对于 static 元素，为 auto；对于长度值，则为相应的绝对长度；对于百分比数值，为指定值；否则为 auto。

对于相对定义元素，如果 bottom 和 top 都是 auto，其计算值则都是 0；如果其中之一为 auto，则取另一个值的相反数；如果二者都不是 auto，bottom 将取 top 值的相反数。

■◆881■不允许其他浮动元素侧          简化命令：不许浮动侧■不许浮动侧■CSS clear 属性
CSS 参考手册
定义和用法
clear 属性规定元素的哪一侧不允许其他浮动元素。

说明
clear 属性定义了元素的哪边上不允许出现浮动元素。在 CSS1 和 CSS2 中，这是通过自动为清除元素（即设置了 clear 属性的元素）增加上外边距实现的。在 CSS2.1 中，会在元素上外边距之上增加清除空间，而外边距本身并不改变。不论哪一种改变，最终结果都一样，如果声明为左边或右边清除，会使元素的上外边框边界刚好在该边上浮动元素的下外边距边界之下。

■◆881■剪裁绝对定位元素              简化命令：剪裁■剪裁■CSS clip 属性
CSS 参考手册
定义和用法
clip 属性剪裁绝对定位元素。

当一幅图像的尺寸大于包含它的元素时会发生什么呢？"clip" 属性允许您规定一个元素的可见尺寸，这样此元素就会被修剪并显示为这个形状。

说明
这个属性用于定义一个剪裁矩形。对于一个绝对定义元素，在这个矩形内的内容才可见。出了这个剪裁区域的内容会根据 overflow 的值来处理。剪裁区域可能比元素的内容区大，也可能比内容区小。

■◆881■光标的类型                    简化命令：光标类型■光标类型■CSS cursor 属性
CSS 参考手册
定义和用法
cursor 属性规定要显示的光标的类型（形状）。

该属性定义了鼠标指针放在一个元素边界范围内时所用的光标形状（不过 CSS2.1 没有定义由哪个边界确定这个范围）。

■◆881■框的类型                      简化命令：框类型■框类型■CSS display 属性
CSS 参考手册
定义和用法
display 属性规定元素应该生成的框的类型。

说明
这个属性用于定义建立布局时元素生成的显示框类型。对于 HTML 等文档类型，如果使用 display 不谨慎会很危险，因为可能违反 HTML 中已经定义的显示层次结构。对于 XML，由于 XML 没有内置的这种层次结构，所有 display 是绝对必要的。

注释：CSS2 中有值 compact 和 marker，不过由于缺乏广泛的支持，已经从 CSS2.1 中去除了。

■◆881■框是否应该浮动                简化命令：框是否浮动■框是否浮动■CSS float 属性
CSS 参考手册
定义和用法
float 属性定义元素在哪个方向浮动。以往这个属性总应用于图像，使文本围绕在图像周围，不过在 CSS 中，任何元素都可以浮动。浮动元素会生成一个块级框，而不论它本身是何种元素。

如果浮动非替换元素，则要指定一个明确的宽度；否则，它们会尽可能地窄。

注释：假如在一行之上只有极少的空间可供浮动元素，那么这个元素会跳至下一行，这个过程会持续到某一行拥有足够的空间为止。

■◆881■元素的左边缘                  简化命令：左边缘■左边缘■CSS left 属性
CSS 参考手册
定义和用法
left 属性规定元素的左边缘。该属性定义了定位元素左外边距边界与其包含块左边界之间的偏移。

注释：如果 "position" 属性的值为 "static"，那么设置 "left" 属性不会产生任何效果。

说明
对于 static 元素，为 auto；对于长度值，则为相应的绝对长度；对于百分比数值，为指定值；否则为 auto。

对于相对定义元素，left 的计算值始终等于 right。

■◆881■当内容溢出元素框时发生的事情  简化命令：内容溢出■内容溢出■CSS overflow 属性
CSS 参考手册
定义和用法
overflow 属性规定当内容溢出元素框时发生的事情。

说明
这个属性定义溢出元素内容区的内容会如何处理。如果值为 scroll，不论是否需要，用户代理都会提供一种滚动机制。因此，有可能即使元素框中可以放下所有内容也会出现滚动条。

■◆881■元素的定位类型                简化命令：定位类型■定位类型■CSS position 属性
CSS 参考手册
定义和用法
position 属性规定元素的定位类型。

说明
这个属性定义建立元素布局所用的定位机制。任何元素都可以定位，不过绝对或固定元素会生成一个块级框，而不论该元素本身是什么类型。相对定位元素会相对于它在正常流中的默认位置偏移。

■◆881■元素的右边缘                  简化命令：右边缘■右边缘■CSS right 属性
CSS 参考手册
定义和用法
right 属性规定元素的右边缘。该属性定义了定位元素右外边距边界与其包含块右边界之间的偏移。

注释：如果 "position" 属性的值为 "static"，那么设置 "right" 属性不会产生任何效果。

说明
对于 static 元素，为 auto；对于长度值，则为相应的绝对长度；对于百分比数值，为指定值；否则为 auto。

对于相对定义元素，left 的计算值始终等于 right。

■◆881■元素的顶部边缘                简化命令：顶部边缘■顶部边缘■CSS top 属性
CSS 参考手册
定义和用法
top 属性规定元素的顶部边缘。该属性定义了一个定位元素的上外边距边界与其包含块上边界之间的偏移。

注释：如果 "position" 属性的值为 "static"，那么设置 "top" 属性不会产生任何效果。

说明
对于 static 元素，为 auto；对于长度值，则为相应的绝对长度；对于百分比数值，为指定值；否则为 auto。

对于相对定义元素，如果 top 和 bottom 都是 auto，其计算值则都是 0；如果其中之一为 auto，则取另一个值的相反数；如果二者都不是 auto，bottom 将取 top 值的相反数。

■◆881■垂直对齐方式                  简化命令：竖对齐■竖对齐■CSS vertical-align 属性
CSS 参考手册
定义和用法
vertical-align 属性设置元素的垂直对齐方式。

说明
该属性定义行内元素的基线相对于该元素所在行的基线的垂直对齐。允许指定负长度值和百分比值。这会使元素降低而不是升高。在表单元格中，这个属性会设置单元格框中的单元格内容的对齐方式。

■◆881■元素是否可见                  简化命令：可见■可见■CSS visibility 属性
CSS 参考手册
定义和用法
visibility 属性规定元素是否可见。

提示：即使不可见的元素也会占据页面上的空间。请使用 "display" 属性来创建不占据页面空间的不可见元素。

说明
这个属性指定是否显示一个元素生成的元素框。这意味着元素仍占据其本来的空间，不过可以完全不可见。值 collapse 在表中用于从表布局中删除列或行。

■◆881■元素的堆叠顺序                简化命令：堆叠顺序■堆叠顺序■CSS z-index 属性
CSS 参考手册
定义和用法
z-index 属性设置元素的堆叠顺序。拥有更高堆叠顺序的元素总是会处于堆叠顺序较低的元素的前面。

注释：元素可拥有负的 z-index 属性值。

注释：Z-index 仅能在定位元素上奏效（例如 position:absolute;）！

说明
该属性设置一个定位元素沿 z 轴的位置，z 轴定义为垂直延伸到显示区的轴。如果为正数，则离用户更近，为负数则表示离用户更远。

■◆881■元素后的分页行为              简化命令：后分页■后分页■CSS page-break-after 属性
CSS 参考手册
定义和用法
page-break-after 属性设置元素后的 page-breaking 行为。

尽管可以用 always 强制放上分页符，但是无法保证避免分页符的插入，创作人员最多只能要求用户代理尽可能避免插入分页。

应用于：position 值为 relative 或 static 的非浮动块级元素。

注释：请尽可能少地使用分页属性，并且避免在表格、浮动元素、带有边框的块元素中使用分页属性。

■◆881■元素前的分页行为              简化命令：前分页■前分页■CSS page-break-before 属性
CSS 参考手册
定义和用法
page-break-before 属性设置元素前的 page-breaking 行为。

尽管可以用 always 强制放上分页符，但是无法保证避免分页符的插入，创作人员最多只能要求用户代理尽可能避免插入分页。

应用于：position 值为 relative 或 static 的非浮动块级元素。

注释：请尽可能少地使用分页属性，并且避免在表格、浮动元素、带有边框的块元素中使用分页属性。

■◆881■元素内部的分页行为            简化命令：内分页■内分页■CSS page-break-inside 属性
CSS 参考手册
定义和用法
page-break-inside 属性设置元素内部的 page-breaking 行为。

尽管可以用 always 强制放上分页符，但是无法保证避免分页符的插入，创作人员最多只能要求用户代理尽可能避免插入分页。

应用于：position 值为 relative 或 static 的非浮动块级元素。

注释：请尽可能少地使用分页属性，并且避免在表格、浮动元素、带有边框的块元素中使用分页属性。

■◆881■是否合并表格边框              简化命令：表格边框合并■表格边框合并■CSS border-collapse 属性
CSS 参考手册
定义和用法
border-collapse 属性设置表格的边框是否被合并为一个单一的边框，还是象在标准的 HTML 中那样分开显示
■◆881■相邻单元格边框之间的距离      简化命令：邻格框距离■邻格框距离■CSS border-spacing 属性
CSS 参考手册
定义和用法
border-spacing 属性设置相邻单元格的边框间的距离（仅用于“边框分离”模式）。

注释：某些版本的IE浏览器不支持此属性。

说明
该属性指定分隔边框模型中单元格边界之间的距离。在指定的两个长度值中，第一个是水平间隔，第二个是垂直间隔。除非 border-collapse 被设置为 separate，否则将忽略这个属性。尽管这个属性只应用于表，不过它可以由表中的所有元素继承。

■◆881■表格标题的位置                简化命令：表格标题位置■表格标题位置■CSS caption-side 属性
CSS 参考手册
定义和用法
caption-side 属性设置表格标题的位置。

说明
该属性指定了表标题相对于表框的放置位置。表标题显示为好像它是表之前（或之后）的一个块级元素。

■◆881■是否显示表格中的空单元格      简化命令：空单元格显示■空单元格显示■CSS empty-cells 属性
CSS 参考手册
定义和用法
empty-cells 属性设置是否显示表格中的空单元格（仅用于“分离边框”模式）。

注释：某些版本的 IE 浏览器不支持此属性。

说明
该属性定义了不包含任何内容的表单元格如何表示。如果显示，就会绘制出单元格的边框和背景。除非 border-collapse 设置为 separate，否则将忽略这个属性。

■◆881■用来显示表格单元格、行、列的算法规则简化命令：格行列算法规则■格行列算法规则■CSS table-layout 属性
CSS 参考手册
定义和用法
tableLayout 属性用来显示表格单元格、行、列的算法规则。

固定表格布局：
固定表格布局与自动表格布局相比，允许浏览器更快地对表格进行布局。

在固定表格布局中，水平布局仅取决于表格宽度、列宽度、表格边框宽度、单元格间距，而与单元格的内容无关。

通过使用固定表格布局，用户代理在接收到第一行后就可以显示表格。

自动表格布局：
在自动表格布局中，列的宽度是由列单元格中没有折行的最宽的内容设定的。

此算法有时会较慢，这是由于它需要在确定最终的布局之前访问表格中所有的内容。

说明
该属性指定了完成表布局时所用的布局算法。固定布局算法比较快，但是不太灵活，而自动算法比较慢，不过更能反映传统的 HTML 表。

■◆-1■HTML标签以及标签特有属性■■■◆978■声明                简化命令：声明■声明■定义和用法
<!DOCTYPE> 声明位于文档中的最前面的位置，处于 <html> 标签之前。此标签可告知浏览器文档使用哪种 HTML 或 XHTML 规范。

该标签可声明三种 DTD 类型，分别表示严格版本、过渡版本以及基于框架的 HTML 文档。

■◆978■网页                简化命令：页■页■定义和用法
此元素可告知浏览器其自身是一个 HTML 文档。

<html> 与 </html> 标签限定了文档的开始点和结束点，在它们之间是文档的头部和主体。正如您所了解的那样，文档的头部由 <head> 标签定义，而主体由 <body> 标签定义。
■◆978■主体                简化命令：体■体■HTML <body> 标签
定义和用法
body 元素定义文档的主体。

body 元素包含文档的所有内容（比如文本、超链接、图像、表格和列表等等。）
■◆981■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆981■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆981■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆981■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆981■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆981■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆981■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆981■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆981■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆981■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆981■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆981■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆981■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆981■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆981■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆981■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆981■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆981■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆981■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆981■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆981■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆981■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆981■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆981■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆981■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆981■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆981■链接颜色            简化命令：链色■链色■HTML <body> 标签的 alink 属性
HTML <body> 标签
定义和用法
alink 属性规定文档中活动链接（active link）的的颜色。
注释：当链接被点击时，该链接就处于活动状态。
实例
文档中活动链接的颜色被设置为绿色：
<html>
<body alink="green">
<p><a href="http://www.w3school.com.cn">W3School.com.cn</a></p>
<p><a href="http://www.w3school.com.cn/html/">HTML Tutorial</a></p>
</body>
</html>
TIY■◆981■背景图像            简化命令：景图■景图■HTML <body> 标签的 background 属性
HTML <body> 标签
定义和用法
background 属性规定规定文档的背景图像。
注释：当链接被点击时，该链接就处于活动状态。
实例
为文档规定一幅背景图像：
<html>
<body background="bgimage.jpg">
<h1>Hello world!</h1>
<p><a href="http://www.w3school.com.cn">Visit W3School.com.cn!</a></p>
</body>
</html>■◆981■背景颜色            简化命令：景色■景色■HTML <body> 标签的 bgcolor 属性
HTML <body> 标签
定义和用法
bgcolor 属性规定文档的背景颜色。
实例
为文档规定背景颜色：
<html>
<body bgcolor="#E6E6FA">
<p><a href="http://www.w3school.com.cn">W3School.com.cn</a></p>
<p><a href="http://www.w3school.com.cn/html/">HTML Tutorial</a></p>
</body>
</html>■◆981■未访问链接颜色      简化命令：未访色■未访色■HTML <body> 标签的 link 属性
HTML <body> 标签
定义和用法
link 属性规定文档中未访问链接的默认颜色。
实例
将文档中的默认链接颜色设置为蓝色：
<html>
<body link="blue">
<p><a href="http://www.w3school.com.cn">W3School.com.cn</a></p>
<p><a href="http://www.w3school.com.cn/html/">HTML Tutorial</a></p>
</body>
</html>■◆981■文本颜色            简化命令：文色■文色■HTML <body> 标签的 text 属性
HTML <body> 标签
定义和用法
text 属性规定 HTML 文档的文本颜色。
实例
设置文档中的文本颜色：
<html>
<body text="green">
<p><a href="http://www.w3school.com.cn">W3School.com.cn</a></p>
<p><a href="http://www.w3school.com.cn/html/">HTML Tutorial</a></p>
</body>
</html>■◆981■已被访问链接颜色    简化命令：已访色■已访色■HTML <body> 标签的 vlink 属性
HTML <body> 标签
定义和用法
vlink 属性文档中已被访问链接的颜色。
实例
将文档中已被访问的链接颜色设置为红色：
<html>
<body vlink="red">
<p><a href="http://www.w3school.com.cn">W3School.com.cn</a></p>
<p><a href="http://www.w3school.com.cn/html/">HTML Tutorial</a></p>
</body>
</html>■◆978■标题1               简化命令：题1■题1■定义和用法
<h1> - <h6> 标签可定义标题。<h1> 定义最大的标题。<h6> 定义最小的标题。

由于 h 元素拥有确切的语义，因此请您慎重地选择恰当的标签层级来构建文档的结构。因此，请不要利用标题标签来改变同一行中的字体大小。相反，我们应当使用层叠样式表定义来达到漂亮的显示效果。

如果您希望了解更多有关 HTML 标签选择和使用的信息，请阅读《Web 品质》。
■◆1014■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1014■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1014■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1014■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1014■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1014■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1014■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1014■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1014■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1014■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1014■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1014■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1014■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1014■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1014■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1014■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1014■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1014■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1014■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1014■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1014■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1014■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1014■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1014■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1014■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1014■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1014■标题的水平对齐      简化命令：横对齐■横对齐■HTML <h1> - <h6> 标签的 align 属性
HTML <h1> - <h6> 标签
定义和用法
align 属性规定标题的水平对齐方式。
实例
居中对齐的 HTML 标题：
<h1 align="center">This is heading 1</h1>
TIY■◆978■标题2               简化命令：题2■题2■ ■◆1042■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1042■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1042■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1042■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1042■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1042■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1042■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1042■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1042■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1042■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1042■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1042■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1042■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1042■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1042■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1042■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1042■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1042■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1042■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1042■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1042■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1042■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1042■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1042■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1042■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1042■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1042■标题的水平对齐      简化命令：横对齐■横对齐■HTML <h1> - <h6> 标签的 align 属性
HTML <h1> - <h6> 标签
定义和用法
align 属性规定标题的水平对齐方式。
实例
居中对齐的 HTML 标题：
<h1 align="center">This is heading 1</h1>■◆978■标题3               简化命令：题3■题3■ ■◆1070■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1070■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1070■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1070■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1070■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1070■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1070■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1070■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1070■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1070■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1070■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1070■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1070■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1070■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1070■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1070■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1070■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1070■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1070■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1070■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1070■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1070■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1070■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1070■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1070■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1070■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1070■标题的水平对齐      简化命令：横对齐■横对齐■HTML <h1> - <h6> 标签的 align 属性
HTML <h1> - <h6> 标签
定义和用法
align 属性规定标题的水平对齐方式。
实例
居中对齐的 HTML 标题：
<h1 align="center">This is heading 1</h1>■◆978■标题4               简化命令：题4■题4■ ■◆1098■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1098■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1098■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1098■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1098■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1098■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1098■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1098■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1098■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1098■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1098■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1098■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1098■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1098■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1098■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1098■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1098■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1098■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1098■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1098■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1098■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1098■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1098■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1098■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1098■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1098■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1098■标题的水平对齐      简化命令：横对齐■横对齐■HTML <h1> - <h6> 标签的 align 属性
HTML <h1> - <h6> 标签
定义和用法
align 属性规定标题的水平对齐方式。
实例
居中对齐的 HTML 标题：
<h1 align="center">This is heading 1</h1>■◆978■标题5               简化命令：题5■题5■ ■◆1126■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1126■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1126■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1126■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1126■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1126■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1126■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1126■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1126■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1126■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1126■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1126■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1126■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1126■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1126■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1126■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1126■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1126■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1126■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1126■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1126■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1126■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1126■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1126■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1126■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1126■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1126■标题的水平对齐      简化命令：横对齐■横对齐■HTML <h1> - <h6> 标签的 align 属性
HTML <h1> - <h6> 标签
定义和用法
align 属性规定标题的水平对齐方式。
实例
居中对齐的 HTML 标题：
<h1 align="center">This is heading 1</h1>■◆978■标题6               简化命令：题6■题6■ ■◆1154■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1154■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1154■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1154■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1154■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1154■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1154■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1154■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1154■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1154■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1154■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1154■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1154■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1154■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1154■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1154■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1154■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1154■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1154■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1154■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1154■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1154■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1154■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1154■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1154■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1154■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1154■标题的水平对齐      简化命令：横对齐■横对齐■HTML <h1> - <h6> 标签的 align 属性
HTML <h1> - <h6> 标签
定义和用法
align 属性规定标题的水平对齐方式。
实例
居中对齐的 HTML 标题：
<h1 align="center">This is heading 1</h1>■◆978■段落                简化命令：段■段■HTML <p> 标签
定义和用法
<p> 标签定义段落。

p 元素会自动在其前后创建一些空白。浏览器会自动添加这些空间，您也可以在样式表中规定。
■◆1182■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1182■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1182■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1182■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1182■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1182■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1182■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1182■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1182■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1182■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1182■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1182■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1182■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1182■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1182■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1182■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1182■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1182■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1182■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1182■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1182■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1182■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1182■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1182■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1182■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1182■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1182■段落中文本的对齐    简化命令：横对齐■横对齐■HTML <p> 标签的 align 属性
HTML <p> 标签
定义和用法
align 属性规定段落中文本的对齐方式。
实例
右对齐的段落：
<p align="right">This is some text in a very short paragraph</p>■◆978■换行符              简化命令：尾■尾■HTML <br> 标签
定义和用法
<br> 可插入一个简单的换行符。

<br> 标签是空标签（意味着它没有结束标签，因此这是错误的：<br></br>）。在 XHTML 中，把结束标签放在开始标签中，也就是 <br />。

请注意，<br> 标签只是简单地开始新的一行，而当浏览器遇到 <p> 标签时，通常会在相邻的段落之间插入一些垂直的间距。
■◆978■水平线              简化命令：横线■横线■HTML <hr> 标签
定义和用法
<hr> 标签在 HTML 页面中创建一条水平线。

水平分隔线（horizontal rule）可以在视觉上将文档分隔成各个部分。
■◆1211■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1211■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1211■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1211■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1211■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1211■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1211■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1211■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1211■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1211■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1211■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1211■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1211■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1211■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1211■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1211■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1211■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1211■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1211■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1211■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1211■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1211■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1211■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1211■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1211■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1211■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1211■水平线的水平对齐    简化命令：横对齐■横对齐■HTML <hr> 标签的 align 属性
HTML <hr> 标签
定义和用法
align 属性规定水平线的水平对齐方式。
注释：除非 width 属性设置为小于 100%，否则 align 属性不会有任何效果。
实例
居中对齐的水平线：
<hr align="center" width="50%" />■◆1211■颜色为纯色          简化命令：纯■纯■HTML <hr> 标签的 noshade 属性
HTML <hr> 标签
定义和用法
noshade 属性规定水平线的颜色呈现为纯色，而不是有阴影的颜色。
实例
没有阴影效果的水平线：
<hr noshade="noshade" />■◆1211■水平线的高度        简化命令：尺寸■尺寸■HTML <hr> 标签的 size 属性
HTML <hr> 标签
定义和用法
size 属性规定水平线的高度，以像素计。
实例
高度为 50 像素的水平线：
<hr size="50" />■◆1211■水平线的宽度        简化命令：宽■宽■HTML <hr> 标签的 width 属性
HTML <hr> 标签
定义和用法
width 属性规定水平线的宽度，以像素计或百分比计。
实例
宽度为 50% 的水平线：
<hr width="50%" />■◆978■粗体文本            简化命令：粗■粗■定义和用法
以下的元素均是字体样式元素。我们并不被反对使用这些标签。但是如果您只是希望通过这些标签单纯地改变文本的样式，建议您使用样式表来取得更加丰富的效果。

■◆978■字体                简化命令：字■字■HTML <font> 标签
定义和用法
<font> 规定文本的字体、字体尺寸、字体颜色。
■◆1243■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1243■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1243■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1243■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1243■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1243■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1243■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1243■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1243■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1243■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1243■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1243■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1243■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1243■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1243■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1243■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1243■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1243■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1243■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1243■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1243■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1243■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1243■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1243■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1243■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1243■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1243■文本的颜色          简化命令：色■色■HTML <font> 标签的 color 属性
HTML <font> 标签
定义和用法
color 属性规定 font 元素中文本的颜色。
实例
规定文本的颜色：
<font color="red">This is some text!</font>■◆1243■文本的字体          简化命令：字体■字体■HTML <font> 标签的 face 属性
HTML <font> 标签
定义和用法
face 属性规定 font 元素中文本的字体。
实例
规定文本的字体：
<font face="verdana">This is some text!</font>■◆1243■尺寸大小            简化命令：尺寸■尺寸■HTML <font> 标签的 size 属性
HTML <font> 标签
定义和用法
size 属性规定 font 元素中文本的尺寸大小。
实例
规定文本的大小：
<font size="5">This is some text!</font>
TIY
浏览器支持
所有主流浏览器都支持 size 属性。■◆978■斜体文本            简化命令：斜■斜■ ■◆978■强调文本            简化命令：强■强■定义和用法
以下元素都是短语元素。虽然这些标签定义的文本大多会呈现出特殊的样式，但实际上，这些标签都拥有确切的语义。

我们并不反对使用它们，但是如果您只是为了达到某种视觉效果而使用这些标签的话，我们建议您使用样式表，那么做会达到更加丰富的效果。

■◆978■大号文本            简化命令：大■大■定义和用法
以下的元素均是字体样式元素。我们并不被反对使用这些标签。但是如果您只是希望通过这些标签单纯地改变文本的样式，建议您使用样式表来取得更加丰富的效果。

■◆978■强烈强调文本        简化命令：强强■强强■定义和用法
以下元素都是短语元素。虽然这些标签定义的文本大多会呈现出特殊的样式，但实际上，这些标签都拥有确切的语义。

我们并不反对使用它们，但是如果您只是为了达到某种视觉效果而使用这些标签的话，我们建议您使用样式表，那么做会达到更加丰富的效果。

■◆978■小号文本            简化命令：小■小■定义和用法
以下的元素均是字体样式元素。我们并不被反对使用这些标签。但是如果您只是希望通过这些标签单纯地改变文本的样式，建议您使用样式表来取得更加丰富的效果。

■◆978■上标文本            简化命令：上标■上标■HTML <sup> 标签
定义和用法
<sup> 标签可定义上标文本。

包含在 <sup> 标签和其结束标签 </sup> 中的内容将会以当前文本流中字符高度的一半来显示，但是与当前文本流中文字的字体和字号都是一样的。

提示：这个标签在向文档添加脚注以及表示方程式中的指数值时非常有用。如果和 <a> 标签结合起来使用，就可以创建出很好的超链接脚注。
■◆978■下标文本            简化命令：下标■下标■HTML <sub> 标签
定义和用法
<sub> 标签可定义下标文本。

包含在 <sub> 标签和其结束标签 </sub> 中的内容将会以当前文本流中字符高度的一半来显示，但是与当前文本流中文字的字体和字号都是一样的。

提示：无论是 <sub> 标签还是和它对应的 <sup> 标签，在数学等式、科学符号和化学公式中都非常有用。
■◆978■文本方向            简化命令：文方向■文方向■HTML <bdo> 标签
定义和用法
bdo 元素可覆盖默认的文本方向。
■◆1280■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1280■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1280■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1280■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1280■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1280■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1280■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1280■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1280■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1280■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1280■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1280■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1280■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1280■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1280■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1280■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1280■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1280■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1280■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1280■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1280■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1280■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1280■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1280■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1280■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1280■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1280■文本方向            简化命令：文向■文向■可选的属性
DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.
属性	值	描述	DTD
dir	
ltr
rtl
定义文字的方向	STF
■◆978■下划线文本          简化命令：下划线■下划线■HTML <u> 标签
定义和用法
<u> 标签可定义下划线文本。
■◆978■预格式文本          简化命令：预格式■预格式■HTML <pre> 标签
定义和用法
pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。

<pre> 标签的一个常见应用就是用来表示计算机的源代码。

可以导致段落断开的标签（例如标题、<p> 和 <address> 标签）绝不能包含在 <pre> 所定义的块里。尽管有些浏览器会把段落结束标签解释为简单地换行，但是这种行为在所有浏览器上并不都是一样的。

pre 元素中允许的文本可以包括物理样式和基于内容的样式变化，还有链接、图像和水平分隔线。当把其他标签（比如 <a> 标签）放到 <pre> 块中时，就像放在 HTML/XHTML 文档的其他部分中一样即可。请看下面的例子：

■◆1309■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1309■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1309■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1309■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1309■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1309■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1309■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1309■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1309■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1309■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1309■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1309■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1309■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1309■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1309■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1309■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1309■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1309■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1309■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1309■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1309■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1309■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1309■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1309■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1309■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1309■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1309■每行的最大字符数    简化命令：宽■宽■选的属性
属性	值	描述	DTD
width	number	定义每行的最大字符数（通常是 40、80 或 132）。	TF■◆978■计算机代码文本      简化命令：机文■机文■定义和用法
以下元素都是短语元素。虽然这些标签定义的文本大多会呈现出特殊的样式，但实际上，这些标签都拥有确切的语义。

我们并不反对使用它们，但是如果您只是为了达到某种视觉效果而使用这些标签的话，我们建议您使用样式表，那么做会达到更加丰富的效果。

■◆978■打字机文本          简化命令：打字■打字■呈现类似打字机或者等宽的文本效果。■◆978■键盘文本            简化命令：键盘■键盘■定义键盘文本。它表示文本是从键盘上键入的。它经常用在与计算机相关的文档或手册中。■◆978■文本变量部分        简化命令：变量■变量■定义变量。您可以将此标签与 <pre> 及 <code> 标签配合使用。■◆978■定义项目            简化命令：术语■术语■定义一个定义项目。■◆978■计算机代码样本      简化命令：样本■样本■定义样本文本。■◆978■预格式文本          简化命令：预文■预文■不赞成使用。定义预格式文本。■◆978■只取首字母缩写      简化命令：首字母■首字母■HTML <acronym> 标签
定义和用法
<acronym> 元素可定义只取首字母缩写，比如 "NATO"。通过对只取首字母缩写进行标记，您就能够为浏览器、拼写检查程序、翻译系统以及搜索引擎分度器提供有用的信息。
■◆978■缩写                简化命令：缩写■缩写■HTML <abbr> 标签
定义和用法
表示一个缩写形式，比如 "Inc."、"etc."。通过对缩写词语进行标记，您就能够为浏览器、拼写检查程序、翻译系统以及搜索引擎分度器提供有用的信息。

<abbr> 标签最初是在 HTML 4.0 中引入的，表示它所包含的文本是一个更长的单词或短语的缩写形式。

浏览器可能会根据这个信息改变对这些文本的显示方式，或者用其他文本代替。也许当前流行的浏览器对 <abbr> 标签中包含的文本还没有任何处理方式，但是我们无法预测将来的版本将会如何实现该标签。
■◆978■联系信息            简化命令：地址■地址■HTML <address> 标签
定义和用法
<address> 可定义一个地址（比如电子邮件地址）。您应当使用它来定义地址、签名或者文档的作者身份。

不论创建的文档是简短扼要还是冗长完整，都应该确保每个文档都附加了一个地址，这样做不仅为读者提供了反馈的渠道，还可以增加文档的可信度。
■◆978■块引用              简化命令：块■块■HTML <blockquote> 标签
定义和用法
<blockquote> 标签定义块引用。

<blockquote> 与 </blockquote> 之间的所有文本都会从常规文本中分离出来，经常会在左、右两边进行缩进（增加外边距），而且有时会使用斜体。也就是说，块引用拥有它们自己的空间。
■◆1347■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1347■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1347■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1347■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1347■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1347■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1347■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1347■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1347■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1347■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1347■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1347■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1347■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1347■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1347■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1347■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1347■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1347■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1347■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1347■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1347■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1347■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1347■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1347■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1347■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1347■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1347■引用的来源          简化命令：引用源■引用源■HTML <blockquote> cite 属性
HTML <blockquote> 标签
定义和用法
cite 属性规定引用的来源。

该属性的值是一个包含在引号中并指向联机文档的 URL，以及（如果有可能的话）引用在该文档中的确切位置。
实例
下面这个 blockquote 元素中的 cite 属性指定了引用的来源：

<blockquote cite="http://www.wwf.org">
WWF's ultimate goal is to build a future where people live in harmony with nature.
</blockquote>
■◆978■居中文本            简化命令：居中■居中■HTML <center> 标签
定义和用法
对其所包括的文本进行水平居中。
HTML 与 XHTML 之间的差异
在 HTML 4.01 中，center 元素不被赞成使用。

在 XHTML 1.0 Strict DTD 中，center 元素不被支持。
提示和注释：
注释：提示：请使用 CSS 样式来居中文本
■◆978■短的引用            简化命令：短引■短引■HTML <q> 标签
定义和用法
<q> 标签定义短的引用。

浏览器经常在引用的内容周围添加引号。
■◆1376■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1376■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1376■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1376■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1376■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1376■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1376■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1376■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1376■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1376■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1376■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1376■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1376■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1376■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1376■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1376■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1376■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1376■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1376■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1376■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1376■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1376■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1376■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1376■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1376■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1376■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1376■引用的来源          简化命令：引用源■引用源■HTML <q> cite 属性
HTML <q> 标签
定义和用法
cite 属性规定引用的来源。

该属性的值是一个包含在引号中并指向联机文档的 URL，以及（如果有可能的话）引用在该文档中的确切位置。
实例
下面这个 q 元素中的 cite 属性指定了引用的来源：

<p>WWF's goal is to:
<q cite="http://www.wwf.org">
build a future where people live in harmony with nature
</q> we hope they succeed.</p>
亲自试一试
■◆978■引用                简化命令：引用源■引用源■定义引用。可使用该标签对参考文献的引用进行定义，比如书籍或杂志的标题。■◆978■被插入文本          简化命令：插入■插入■HTML <ins> 标签
定义和用法
<ins> 标签定义已经被插入文档中的文本。
■◆1405■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1405■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1405■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1405■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1405■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1405■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1405■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1405■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1405■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1405■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1405■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1405■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1405■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1405■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1405■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1405■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1405■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1405■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1405■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1405■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1405■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1405■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1405■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1405■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1405■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1405■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1405■指向文档            简化命令：引用源■引用源■HTML <ins> 标签的 cite 属性
HTML <ins> 标签
定义和用法
cite 属性指向一个文档的 URL，该文档解释了文本被插入或修改的原因。
实例
在 ins 元素中使用 cite 属性：

<p>My favorite color is <del>blue</del> <ins cite="why_inserted.htm">red</ins>!</p>■◆1405■规定日期和时间      简化命令：时间■时间■HTML <ins> 标签的 datetime 属性
HTML <ins> 标签
定义和用法
datetime 属性规定文本被插入或修改的日期和时间。
实例
在 ins 元素中使用 datetime 属性：

<p>My favorite color is <del>blue</del> 
<ins datetime="2009-08-08T21:55:06Z">red</ins>!</p>TIY
■◆978■被删除文本          简化命令：删除■删除■HTML <del> 标签
定义和用法
定义文档中已被删除的文本。
■◆1434■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1434■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1434■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1434■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1434■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1434■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1434■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1434■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1434■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1434■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1434■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1434■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1434■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1434■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1434■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1434■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1434■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1434■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1434■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1434■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1434■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1434■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1434■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1434■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1434■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1434■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1434■指向文档            简化命令：引用源■引用源■HTML <del> 标签的 cite 属性
HTML <del> 标签
定义和用法
cite 属性指向一个文档的 URL，该文档解释了文本被删除的原因。
实例
在 del 元素中使用 cite 属性：

a dozen is <del cite="why_deleted.htm">20</del> 12 pieces■◆1434■规定日期和时间      简化命令：时间■时间■HTML <del> 标签的 datetime 属性
HTML <del> 标签
定义和用法
datetime 属性规定文本被删除的日期和时间。
实例
在 del 元素中使用 datetime 属性：

a dozen is <del datetime="2009-08-08T21:55:06Z">20</del> 12 pieces亲自试一试
■◆978■加删除线文本        简化命令：删线■删线■HTML <strike> 标签
定义和用法
<strike> 标签可定义加删除线文本定义。
■◆978■加删除线文本        简化命令：加删线■加删线■HTML <strike> 标签
定义和用法
<strike> 标签可定义加删除线文本定义。
■◆978■锚                  简化命令：锚■锚■HTML <a> 标签
定义和用法
<a> 标签可定义锚。锚 (anchor) 有两种用法：

?通过使用 href 属性，创建指向另外一个文档的链接（或超链接）
?通过使用 name 或 id 属性，创建一个文档内部的书签（也就是说，可以创建指向文档片段的链接）
<a> 元素最重要的属性是 href 属性，它指定链接的目标。

在所有浏览器中，链接的默认外观是：

?未被访问的链接带有下划线而且是蓝色的
?已被访问的链接带有下划线而且是紫色的
?活动链接带有下划线而且是红色的
提示：您可能已经注意到了，W3School 站点内的链接外观与默认的链接外观非常不同。您可以使用 CSS 伪类 向文本超链接添加复杂而多样的样式。
■◆1465■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1465■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1465■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1465■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1465■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1465■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1465■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1465■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1465■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1465■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1465■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1465■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1465■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1465■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1465■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1465■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1465■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1465■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1465■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1465■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1465■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1465■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1465■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1465■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1465■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1465■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1465■字符编码            简化命令：编码■编码■HTML <a> 标签的 charset 属性
HTML <a> 标签
定义和用法
<a> 标签的 charset 属性用于指定作为链接目标的文档中所使用的字符编码。

charset 属性的值必须是标准字符集的名称，例如 "UTF-8"，默认值是 "ISO-8859-1"。
实例
<a charset="gb2312" href="http://www.w3school.com.cn">www.W3School.com.cn</a>■◆1465■链接的坐标          简化命令：坐标■坐标■HTML <a> 标签的 coords 属性
HTML <a> 标签
定义和用法
coords 属性与 shape 属性配合，可以规定 object 或 img 元素中链接的尺寸、形状和位置。

注释：左上角的坐标是 0,0。

提示：如需创建能够在所有浏览器中运行的图像映射，请使用 area 元素。
实例
<object data="planets.gif" alt="Planets" type="image/gif" usemap="#Map1">
  <map name="Map1">
  <a href="sun.htm" shape="rect" coords="0,0,110,260">Sun</a>
  <a href="mercur.htm" shape="circle" coords="129,161,10">Mercury</a>
  <a href="venus.htm" shape="circle" coords="180,139,14">Venus</a>
  </map>
</object>
■◆1465■目标的 URL          简化命令：目标■目标■HTML <a> 标签的 href 属性
HTML <a> 标签
定义和用法
<a> 标签的 href 属性用于指定超链接目标的 URL。

href 属性的值可以是任何有效文档的相对或绝对 URL，包括片段标识符和 JavaScript 代码段。如果用户选择了 <a> 标签中的内容，那么浏览器会尝试检索并显示 href 属性指定的 URL 所表示的文档，或者执行 JavaScript 表达式、方法和函数的列表。
实例
href 属性规定链接的目标：

<a href="http://www.w3school.com.cn">W3School</a>TIY
提示和注释
注意：<a> 标签中必须提供 href 属性或 name 属性。
制作文本链接
一个引用其他文档的简单 <a> 标签可以是下列形式：

<a href="http://www.w3school.com.cn/index.html">W3School 在线教程</a>浏览器用特殊效果显示短语“W3School 在线教程”（通常是带下划线的蓝色文本），这样用户就会知道它是一个可以链接到其他文档的超链接。就像这样：

W3School 在线教程

用户还可以利用浏览器中的选项来自己指定文本颜色、设置链接前和链接后链接文本的颜色。

提示：可以使用 CSS 伪类向文本超链接添加复杂而多样的样式。
制作图像链接
更复杂的锚还可以包含图像。下面这个 LOGO 是一个图像链接，点击该图像，可以返回 W3school 的首页：

<a href="http://www.w3school.com.cn/index.html">
<img src="/i/w3school_logo_white.gif" />
</a>上面的代码会为 W3School 的 LOGO 添加一个返回首页的超链接：

 
大多数图形浏览器都会在作为锚的一部分的图像周围放置特殊的边框。通过在 <img> 标签中把图像的 border 属性设置为 0 可以删除超链接的边框。也可以使用 CSS 的边框属性来全局性地改变元素的边框样式。
语法
<a href="value">属性值
值 描述 
URL 超链接的 URL。可能的值： 
?绝对 URL - 指向另一个站点（比如 href="http://www.example.com/index.htm"）
?相对 URL - 指向站点内的某个文件（href="index.htm"）
?锚 URL - 指向页面中的锚（href="#top"）
 
■◆1465■被链接文档的语言    简化命令：被链接语言■被链接语言■HTML <a> 标签的 hreflang 属性
HTML <a> 标签
定义和用法
<a> 标签的 hreflang 属性用于指定被链接文档的语言。

仅在使用 href 属性时才可以指定 hreflang 属性。和 lang 属性类似，hreflang 属性的值也是 ISO 标准的双字符语言代码。和 lang 属性不同的是，hreflang 属性不会指定标签中的内容所使用的语言，而是指定被 href 属性调用的文档所使用的语言。
实例
hreflang="zh" 表明 w3school 是一个中文网站：

<a href="http://www.w3school.com.cn" hreflang="zh">W3School</a>TIY
浏览器支持
主流的浏览器几乎都不支持 hreflang 属性。
语法
<a hreflang="value">属性值
值 描述 
language_code 双字符的语言代码，指定被链接文档的语言。

如需查看所有可用的语言代码，请访问我们的 语言代码集参考手册。
 
■◆1465■锚的名称            简化命令：名■名■HTML <a> 标签的 name 属性
HTML <a> 标签
定义和用法
name 属性用于指定锚（anchor）的名称。

name 属性可以创建（大型）文档内的书签。

<a> 标签内必须提供 href 或 name 属性。

延伸阅读：使用 name 属性还是 id 属性
实例
通过 name 属性，我们可以制作一个目录列表：

<a href="#C1">第一章</a>
<a href="#C2">第二章</a>
<a href="#C3">第三章</a>
<a href="#C3">第四章</a>
...
亲自试一试
浏览器支持
主流的浏览器几乎都支持 name 属性。
语法
<a name="value">属性值
值 描述 
anchor_name 锚的名称。 
延伸阅读：使用 name 属性还是 id 属性？
在 HTML 4.0 之前的版本中，只有使用 <a> 标签的 name 属性才能创建片段标识符。随着 HTML 4.0 中 id 属性的出现，所有 HTML 或 XHTML 元素都可以是片段标识符。这是因为 id 标识符几乎可以用在所有的标签中。<a> 标签为了能够和以前的版本相兼容而保留了 name 属性，同时也可以使用 id 属性。这些属性可以相互交换使用，可以把 id 属性看作是 name 属性的升级版本。name 和 id 属性都可以与 href 属性结合起来使用，这样一个 <a> 标签就可以同时作为超链接和片段标识符使用。

可以简单地将片段标识符看作是对许多编程语言中普遍使用的 goto 语句标签的 HTML 模拟。<a> 标签中的 name 属性或者 <a> 或其他标签中的 id 属性会在文档中放置一个标识。当标签用于链接到该文档时，就等于告诉浏览器要转到（goto）该标识。

id 或 name 属性的值可以是引号引起来的任何字符串。字符串必须是唯一的标记，不能在同一文档中的其他 name 或 id 属性中重复使用，但是可以在不同的文档中再次使用。

■◆1465■当前文档与被链接文档的关系简化命令：正关系■正关系■HTML <a> 标签的 rel 属性
HTML <a> 标签
定义和用法
<a> 标签的 rel 属性用于指定当前文档与被链接文档的关系。

用于 <a> 标签的可选属性 rel 和 rev 分别表示源文档与目标文档之间正式的关系和方向。rel 属性指定从源文档到目标文档的关系，而 rev 属性则指定从目标文档到源文档的关系。这两种属性可以在 <a> 标签中同时使用。

rel 或 rev 属性的值都是以空格分隔的关系列表。实际的关系名和它们的含义取决于你自己：HTML 或 XHTML 标准并没有正式提出这两种属性。例如，一系列文档中的某个文档可能会在链接中包含它的关系：

<a href="part_12.html" rel="next" rev="prev">从源到目标的关系是移动到下一个文档，而从目标到源的关系则是返回前一个文档。

提示：创作者也许希望定义 W3C 中没有描述过的其他链接类型。如果这样做的话，则应该使用 profile 来引用用于定义链接类型的约定。如需获得更多信息，请参阅 head 元素的 profile 属性。
实例
带有 rel 属性的链接：

<a rel="friend" href="http://www.w3c.com/">w3c</a>亲自试一试
浏览器支持
几乎没有浏览器支持 rel 属性。

注释：虽然在理论上讲，浏览器可以利用 rel 和 rev 属性改变锚内容的外观、或者自动构建文档浏览菜单，其他工具也可以使用这些属性来构建特殊的链接集合、目录和索引，但是只有极少数浏览器才会利用这些属性来改变链接的外观。

提示：尽管浏览器不会以任何方式使用该属性，不过搜索引擎可以利用该属性获得更多有关链接的信息。
语法
<a rel="value">属性值
值 描述 
alternate 文档的可选版本（例如打印页、翻译页或镜像）。 
stylesheet 文档的外部样式表。 
start 集合中的第一个文档。 
next 集合中的下一个文档。 
prev 集合中的前一个文档。 
contents 文档目录。 
index 文档索引。 
glossary 文档中所用字词的术语表或解释。 
copyright 包含版权信息的文档。 
chapter 文档的章。 
section 文档的节。 
subsection 文档的子段。 
appendix 文档附录。 
help 帮助文档。 
bookmark 相关文档。 
    
nofollow Google 使用 "nofollow"，用于指定 Google 搜索引擎不要跟踪链接。 
licence   
tag   
friend   
■◆1465■当前文档与被链接文档的关系简化命令：反关系■反关系■HTML <a> 标签的 rev 属性
HTML <a> 标签
定义和用法
<a> 标签的 rev 属性用于指定当前文档与被链接文档的关系。

用于 <a> 标签的可选属性 rel 和 rev 分别表示源文档与目标文档之间正式的关系和方向。rel 属性指定从源文档到目标文档的关系，而 rev 属性则指定从目标文档到源文档的关系。这两种属性可以在 <a> 标签中同时使用。

rel 或 rev 属性的值都是以空格分隔的关系列表。实际的关系名和它们的含义取决于你自己：HTML 或 XHTML 标准并没有正式提出这两种属性。例如，一系列文档中的某个文档可能会在链接中包含它的关系：

<a href="part_12.html" rel="next" rev="prev">从源到目标的关系是移动到下一个文档，而从目标到源的关系则是返回前一个文档。

提示：创作者也许希望定义 W3C 中没有描述过的其他链接类型。如果这样做的话，则应该使用 profile 来引用用于定义链接类型的约定。如需获得更多信息，请参阅 head 元素的 profile 属性。
实例
带有 rev 属性的链接：

<a rev="friend" href="http://www.w3c.com/">w3c</a>亲自试一试
浏览器支持
几乎没有浏览器支持 rev 属性。

注释：虽然在理论上讲，浏览器可以利用 rel 和 rev 属性改变锚内容的外观、或者自动构建文档浏览菜单，其他工具也可以使用这些属性来构建特殊的链接集合、目录和索引，但是只有极少数浏览器才会利用这些属性来改变链接的外观。

提示：尽管浏览器不会以任何方式使用该属性，不过搜索引擎可以利用该属性获得更多有关链接的信息。
语法
<a rev="value">■◆1465■链接的形状          简化命令：形状■形状■HTML <a> 标签的 shape 属性
HTML <a> 标签
定义和用法
shape 属性与 coords 属性配合，可以规定 object 或 img 元素中链接的尺寸、形状和位置。

提示：如需创建能够在所有浏览器中运行的图像映射，请使用 area 元素。
实例
<object data="planets.gif" alt="Planets" type="image/gif" usemap="#Map1">
  <map name="Map1">
  <a href="sun.htm" shape="rect" coords="0,0,110,260">Sun</a>
  <a href="mercur.htm" shape="circle" coords="129,161,10">Mercury</a>
  <a href="venus.htm" shape="circle" coords="180,139,14">Venus</a>
  </map>
</object>
亲自试一试
浏览器支持
只有 Firefox 和 Opera 支持 shape 属性。
语法
<a shape="value">属性值
值 描述 
default 规定全部区域。 
rect 定义矩形区域。 
circle 定义圆形。 
poly 定义多边形区域。 
■◆1465■在何处打开          简化命令：何处■何处■HTML <a> 标签的 target 属性
HTML <a> 标签
定义和用法
<a> 标签的 target 属性规定在何处打开链接文档。

如果在一个 <a> 标签内包含一个 target 属性，浏览器将会载入和显示用这个标签的 href 属性命名的、名称与这个目标吻合的框架或者窗口中的文档。如果这个指定名称或 id 的框架或者窗口不存在，浏览器将打开一个新的窗口，给这个窗口一个指定的标记，然后将新的文档载入那个窗口。从此以后，超链接文档就可以指向这个新的窗口。

打开新窗口
被指向的超链接使得创建高效的浏览工具变得很容易。例如，一个简单的内容文档的列表，可以将文档重定向到一个单独的窗口：

<h3>Table of Contents</h3>
<ul>
  <li><a href="pref.html" target="view_window">Preface</a></li>
  <li><a href="chap1.html" target="view_window">Chapter 1</a></li>
  <li><a href="chap2.html" target="view_window">Chapter 2</a></li>
  <li><a href="chap3.html" target="view_window">Chapter 3</a></li>
</ul>
亲自试一试

当用户第一次选择内容列表中的某个链接时，浏览器将打开一个新的窗口，将它标记为 "view_window"，然后在其中显示希望显示的文档内容。如果用户从这个内容列表中选择另一个链接，且这个 "view_window" 仍处于打开状态，浏览器就会再次将选定的文档载入那个窗口，取代刚才的那些文档。

在整个过程中，这个包含了内容列表的窗口是用户可以访问的。通过单击窗口中的一个连接，可使另一个窗口的内容发生变化。

在框架中打开窗口
不用打开一个完整的浏览器窗口，使用 target 更通常的方法是在一个 <frameset> 显示中将超链接内容定向到一个或者多个框架中。可以将这个内容列表放入一个带有两个框架的文档的其中一个框架中，并用这个相邻的框架来显示选定的文档：

<frameset cols="100,*">
  <frame src="toc.html">
  <frame src="pref.html" name="view_frame">
</frameset> 
亲自试一试

当浏览器最初显示这两个框架的时候，左边这个框架包含目录，右边这个框架包含前言。

这是 "toc.html" 的源代码：

<h3>Table of Contents</h3>
<ul>
  <li><a href="pref.html" target="view_frame">Preface</a></li>
  <li><a href="chap1.html" target="view_frame">Chapter 1</a></li>
  <li><a href="chap2.html" target="view_frame">Chapter 2</a></li>
  <li><a href="chap3.html" target="view_frame">Chapter 3</a></li>
</ul>
请注意，在文档 "toc.html" 中，每个链接的目标都是 "view_frame"，也就是右边的框架。

当用户从左边框架中的目录中选择一个链接时，浏览器会将这个关联的文档载入并显示在右边这个 "view_frame" 框架中。当其他链接被选中时，右边这个框架中的内容也会发生变化，而左边这个框架始终保持不变。
特殊的目标
有 4 个保留的目标名称用作特殊的文档重定向操作：

_blank
浏览器总在一个新打开、未命名的窗口中载入目标文档。

_self
这个目标的值对所有没有指定目标的 <a> 标签是默认目标，它使得目标文档载入并显示在相同的框架或者窗口中作为源文档。这个目标是多余且不必要的，除非和文档标题 <base> 标签中的 target 属性一起使用。

_parent
这个目标使得文档载入父窗口或者包含来超链接引用的框架的框架集。如果这个引用是在窗口或者在顶级框架中，那么它与目标 _self 等效。

_top
这个目标使得文档载入包含这个超链接的窗口，用 _top 目标将会清除所有被包含的框架并将文档载入整个浏览器窗口。

提示：这些 target 的所有 4 个值都以下划线开始。任何其他用一个下划线作为开头的窗口或者目标都会被浏览器忽略，因此，不要将下划线作为文档中定义的任何框架 name 或 id 的第一个字符。
语法
<a target="value">属性值
值 描述 
_blank 在新窗口中打开被链接文档。 
_self 默认。在相同的框架中打开被链接文档。 
_parent 在父框架集中打开被链接文档。 
_top 在整个窗口中打开被链接文档。 
framename 在指定的框架中打开被链接文档。 
■◆1465■目标 URL 的 MIME 类型简化命令：类型■类型■规定目标 URL 的 MIME 类型。■◆978■外部资源            简化命令：资源■资源■HTML <link> 标签
定义和用法
<link> 标签定义文档与外部资源的关系。

<link> 标签最常见的用途是链接样式表。
实例
链接一个外部样式表：

<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
</head>
■◆1502■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1502■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1502■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1502■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1502■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1502■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1502■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1502■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1502■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1502■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1502■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1502■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1502■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1502■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1502■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1502■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1502■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1502■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1502■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1502■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1502■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1502■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1502■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1502■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1502■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1502■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1502■被链接文档字符编码  简化命令：编码■编码■HTML <link> 标签的 charset 属性
HTML <link> 标签
定义和用法
charset 属性规定被链接文档的字符编码方式。

现代浏览器的默认字符集是 ISO-8859-1。
实例
在下面的例子中，charset 属性指示被链接文档是用日文编写的：

<head>
<link href="domoarigato.htm" rel="parent" charset="ISO-2022-JP" />
</head>
浏览器支持
几乎没有主流浏览器支持 charset 属性。
语法
<link charset="value">属性值
值 描述 
character_set 所链接文档的字符集。常用的字符集有：

?UTF-8 - Unicode 字符编码
?ISO-8859-1 - 拉丁字母表的字符编码
在理论上，可以使用任何字符集，但并不是所有浏览器都能够理解它们。某种字符集使用的范围越广，浏览器就越有可能理解它。

如需查看所有可用的字符集，请访问我们的 字符集参考手册。
 
HTML <link> 标签
■◆1502■被链接文档位置      简化命令：目标■目标■HTML <link> 标签的 href 属性
HTML <link> 标签
定义和用法
href 属性规定被链接文档的位置（URL）。
实例
在下面的例子中，href 属性指向了一个外部样式表的位置：

<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
</head>
TIY
提示和注释
注释：如果需要，应该对所有的 URL 进行 URL 编码。
语法
<link href="value">属性值
值 描述 
URL 超链接的 URL。可能的值：

?绝对 URL - 指向另一个站点（比如 href="http://www.example.com/theme.css"）
?相对 URL - 指向站点内的某个文件（href="/themes/theme.css"）
 
■◆1502■被链接文档语言      简化命令：被链接语言■被链接语言■HTML <link> 标签的 hreflang 属性
HTML <link> 标签
定义和用法
hreflang 属性规定被链接文档中文本的语言。
实例
在下面的例子中，hreflang 属性指示被链接文档是用日文编写的：

<head>
<link href="domoarigato.htm" rel="parent" charset="ISO-2022-JP" hreflang="ja" />
</head>
浏览器支持
几乎没有主流浏览器支持 hreflang 属性。
语法
<link hreflang="value">属性值
值 描述 
language_code 值为双字母的语言代码，规定被链接文档的语言。

如需查看所有可用的语言代码，请访问我们的语言代码参考手册。
 
HTML <link> 标签
■◆1502■显示设备            简化命令：设备■设备■HTML <link> 标签的 media 属性
HTML <link> 标签
定义和用法
media 属性规定被链接文档将显示在什么设备上。

media 属性用于为不同的媒介类型规定不同的样式。
实例
两种不同的样式表，针对两种不同的媒介类型（计算机屏幕和打印）：

<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
<link rel="stylesheet" type="text/css" href="print.css" media="print"/>
</head>
TIY
浏览器支持
所有浏览器都支持值为 "screen"、"print" 以及 "all" 的 media 属性。

提示：在全屏模式中，Opera 也支持 "projection" 属性值。
语法
<link media="value">属性值
值 描述 
screen 计算机屏幕（默认）。 
tty 电传打字机以及类似的使用等宽字符网格的媒介。 
tv 电视机类型设备（低分辨率、有限的滚屏能力）。 
projection 放映机。 
handheld 手持设备（小屏幕、有限带宽）。 
print 打印预览模式/打印页面。 
braille 盲人点字法反馈设备。 
aural 语音合成器。 
all 适用于所有设备。 
■◆1502■当前与被链接文档关系简化命令：正关系■正关系■HTML <link> 标签的 rel 属性
HTML <link> 标签
定义和用法
rel 属性规定当前文档与被链接文档之间的关系。
实例
在下面的例子中，rel 属性指示被链接的文档是一个样式表：

<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
</head>
TIY
浏览器支持
只有 rel 属性的 "stylesheet" 值得到了所有浏览器的支持。其他值只得到了部分地支持。
语法
<link rel="value">属性值
值 描述 
alternate 文档的替代版本（比如打印页、翻译或镜像）。 
stylesheet 文档的外部样式表。 
start 集合中的第一个文档。 
next 集合中的下一个文档。 
prev 集合中的上一个文档。 
contents 文档的目录。 
index 文档的索引。 
glossary 在文档中使用的词汇的术语表（解释）。 
copyright 包含版权信息的文档。 
chapter 文档的章。 
section 文档的节。 
subsection 文档的小节。 
appendix 文档的附录。 
help 帮助文档。 
bookmark 相关文档。 
■◆1502■被链接与当前关系    简化命令：反关系■反关系■HTML <link> 标签的 rev 属性
HTML <link> 标签
定义和用法
rev 属性规定被链接文档与当前文档之间的关系。

rev 属性与 rel 属性是相反的。
实例
在下面的例子中，rev 属性指示当前文档是 "wildcats.htm" 的父页面：

<head>
<link rev="parent" href="intro.html" />
</head>
浏览器支持
几乎没有浏览器支持 rev 属性。
语法
<link rev="value">属性值
值 描述 
alternate 文档的替代版本（比如打印页、翻译或镜像）。 
stylesheet 文档的外部样式表。 
start 集合中的第一个文档。 
next 集合中的下一个文档。 
prev 集合中的上一个文档。 
contents 文档的目录。 
index 文档的索引。 
glossary 在文档中使用的词汇的术语表（解释）。 
copyright 包含版权信息的文档。 
chapter 文档的章。 
section 文档的节。 
subsection 文档的小节。 
appendix 文档的附录。 
help 帮助文档。 
bookmark 相关文档。 
■◆1502■在哪加载文档        简化命令：何处■何处■HTML <link> 标签的 target 属性
HTML <link> 标签
定义和用法
target 属性规定在哪个窗口或框架中加载被链接文档。
实例
在下面的例子中，会在新窗口中加载被链接文档：

<head>
<link rel="parent" href="index.html" target="_blank" />
</head>
浏览器支持
几乎没有浏览器支持 target 属性。
语法
<link target="value">属性值
值 描述 
_blank 在新窗口中打开被链接文档。 
_self 默认。在相同的框架中打开被链接文档。 
_parent 在父框架集中打开被链接文档。 
_top 在整个窗口中打开被链接文档。 
framename 在指定的框架中打开被链接文档。 
■◆1502■ MIME 类型          简化命令：类型■类型■HTML <link> 标签的 type 属性
HTML <link> 标签
定义和用法
type 属性规定被链接文档的 MIME 类型。

该属性最常见的 MIME 类型是 "text/css"，该类型描述样式表。
实例
在下面的例子中，会在新窗口中加载被链接文档：

<head>
<link rel="stylesheet" type="text/css" href="theme.css" />
</head>
TIY
语法
<link type="value">属性值
值 描述 
MIME_type 被链接文档的 MIME 类型。 
■◆978■框架集窗口或框架    简化命令：框架■框架■HTML <frame> 标签
定义和用法
<frame> 标签定义 frameset 中的一个特定的窗口（框架）。

frameset 中的每个框架都可以设置不同的属性，比如 border、scrolling、noresize 等等。
■◆1537■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1537■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1537■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1537■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1537■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1537■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1537■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1537■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1537■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1537■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1537■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1537■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1537■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1537■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1537■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1537■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1537■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1537■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1537■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1537■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1537■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1537■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1537■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1537■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1537■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1537■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1537■框架周围的边框      简化命令：框架边框■框架边框■HTML <frame> 标签的 frameborder 属性
HTML <frame> 标签
定义和用法
frameborder 属性规定是否显示框架周围的边框。

提示：出于实用性方面的原因，最好不用设置该属性，请使用 CSS 来应用边框样式和颜色。

CSS 实例：frame 边框
实例
不带边框的双框架页面：

<html>

<frameset cols="50%,50%">
<frame src="frame_a.htm" frameborder="0" />
<frame src="frame_b.htm" frameborder="0" />
</frameset>

</html>
TIY
语法
<frame frameborder="value">属性值
值 描述 
1 有边框（默认值）。 
0 无边框。 
■◆1537■指向描述页面        简化命令：描述页■描述页■HTML <frame> 标签的 longdesc 属性
HTML <frame> 标签
定义和用法
longdesc 属性规定指向一个页面的 URL，该页面包含有关框架内容的长描述。

由于浏览器对 longdesc 属性的支持性非常差，没有必要使用该属性。

提示：如需为某个 frame 提供长描述（如果有必要的话），只要简单地创建一个指向描述页面的链接即可（该链接对任何人都是可见的）。
实例
longdesc 属性指向了带有框架内容长描述的页面：

<html>

<frameset cols="50%,50%">
<frame src="frame_a.htm" longdesc="w3school.txt" />
<frame src="frame_b.htm" />
</frameset>

</html>
TIY
语法
<frame longdesc="value">属性值
值 描述 
URL 规定框架的内容描述页面的 URL。

可能的值：

?绝对 URL - 指向其他站点（比如 src="www.example.com/description.txt"）
?相对 URL - 指向站点内的文件（比如 src="description.txt"）
 
■◆1537■上边距和下边距      简化命令：上下边距■上下边距■HTML <frame> 标签的 marginheight 属性
HTML <frame> 标签
定义和用法
marginheight 属性规定框架内容与框架的上方和下方之间的高度，以像素计。
实例
第一个框架的上边距和下边距是 50 像素，第二个框架的上边距和下边距是 0：

<html>

<frameset cols="50%,50%">
<frame src="frame_a.htm" marginheight="50" />
<frame src="frame_b.htm" marginheight="0" />
</frameset>

</html>
TIY
语法
<frame marginheight="value">属性值
值 描述 
pixels 规定框架的上边距和下边距。 
■◆1537■左边距和右边距      简化命令：左右边距■左右边距■HTML <frame> 标签的 marginwidth 属性
HTML <frame> 标签
定义和用法
marginwidth 属性规定框架内容与框架的左侧和右侧之间的高度，以像素计。
实例
第一个框架的左边距和右边距是 50 像素，第二个框架的上边距和下边距是 0：

<html>

<frameset cols="50%,50%">
<frame src="frame_a.htm" marginwidth="50" />
<frame src="frame_b.htm" marginwidth="0" />
</frameset>

</html>
TIY
语法
<frame marginwidth="value">属性值
值 描述 
pixels 规定框架的左边距和右边距。 
■◆1537■框架的名称          简化命令：名■名■HTML <frame> 标签的 name 属性
HTML <frame> 标签
定义和用法
name 属性规定框架的名称。

frame 元素的 name 属性用于在 JavaScript 中引用元素，或者作为链接的目标。
实例
被命名的框架：

<html>

<frameset cols="50%,50%">
<frame src="frame_a.htm" name="frame_a" />
<frame src="frame_b.htm" />
</frameset>

</html>
TIY
语法
<frame name="value">属性值
值 描述 
name 框架的名称。 
■◆1537■固定框架大小        简化命令：固定尺寸■固定尺寸■HTML <frame> 标签的 noresize 属性
HTML <frame> 标签
定义和用法
noresize 属性规定用户无法调整框架的大小。

默认地，可以通过拖动框架之间的“墙壁”来改变框架的大小，该属性可以锁定框架的大小。
实例
无法调整大小的框架：

<html>

<frameset cols="50%,50%">
<frame src="frame_a.htm" noresize="noresize" />
<frame src="frame_b.htm" />
</frameset>

</html>
TIY
语法
<frame noresize="noresize">属性值
值 描述 
noresize 用户无法调整框架的大小。 
HTML <frame> 标签
■◆1537■滚动条              简化命令：滚动条■滚动条■HTML <frame> 标签的 scrolling 属性
HTML <frame> 标签
定义和用法
scrolling 属性规定是否在框架中显示滚动条。

默认地，如果内容大于框架，就会出现滚动条。
实例
总是显示滚动条的框架：

<html>

<frameset cols="50%,50%">
<frame src="frame_a.htm" scrolling="yes" />
<frame src="frame_b.htm" />
</frameset>

</html>
TIY
语法
<frame scrolling="value">属性值
值 描述 
auto 在需要的时候显示滚动条。 
yes 始终显示滚动条（即使不需要）。 
no 从不显示滚动条（即使需要）。 
■◆1537■框架中文档URL       简化命令：路径■路径■HTML <frame> 标签的 src 属性
HTML <frame> 标签
定义和用法
src 属性规定在框架中显示的文档的 URL。
实例
src 属性规定在框架中显示的文档的位置：

<html>

<frameset cols="50%,50%">
<frame src="frame_a.htm" />
<frame src="frame_b.htm" />
</frameset>

</html>
TIY
语法
<frame src="value">属性值
值 描述 
URL 规定要在框架中显示的文档的地址。

可能的值：

?绝对 URL - 指向其他站点（比如 src="www.example.com/index.html"）
?相对 URL - 指向站点内的文件（比如 src="index.html"）
 
■◆978■框架集              简化命令：框架集■框架集■HTML <frameset> 标签
定义和用法
frameset 元素可定义一个框架集。它被用来组织多个窗口（框架）。每个框架存有独立的文档。在其最简单的应用中，frameset 元素仅仅会规定在框架集中存在多少列或多少行。您必须使用 cols 或 rows 属性。
实例
简单的三框架页面：

<html>

<frameset cols="25%,50%,25%">
  <frame src="frame_a.htm" />
  <frame src="frame_b.htm" />
  <frame src="frame_c.htm" />
</frameset>

</html>
■◆1572■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1572■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1572■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1572■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1572■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1572■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1572■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1572■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1572■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1572■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1572■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1572■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1572■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1572■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1572■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1572■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1572■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1572■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1572■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1572■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1572■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1572■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1572■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1572■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1572■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1572■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1572■行框架              简化命令：行■行■HTML <frameset> 标签的 cols 属性和 rows 属性
作用和用法
<frameset> 标签有一个必需的属性：要么是 rows，要么是 cols，这取决于您的选择，它们定义了文档窗口中框架或嵌套的框架集的行或列的大小及数目。

这两个属性都接受用引号括起来并用逗号分开的值列表，这些数值指定了框架的绝对（像素点）或相对（百分比或其余空间）宽度（对列而言），或者绝对或相对高度（对行而言）。这些属性值的数目决定了浏览器将会在文档窗口中显示多少行或列的框架。

与表格一样，浏览器在显示时会尽可能接近给定的框架集尺寸。但是，浏览器不会为了能够容纳下超出边沿的框架集而扩展文档窗口的边界，也不会在指定的框架没有填满整个窗口时用空白区域来填满窗口。相反，浏览器会根据一个框架在行和列中相对于其他框架的大小来分配空间，这样就能够填满整个文档窗口了。（注意到一个主框架文档中没有滚动条了吗？）
例子
例子 1
下面的代码将创建 3 行框架：

<frameset rows="150,300,150">其中的每行都贯穿整个文档窗口。第一和最后一个框架被设为 150 像素高，第二行设置成 300 像素高。

实际上，除非浏览器窗口正好是 600 像素高，否则浏览器将会自动按照比例延伸或压缩第一和最后一个框架，使得这两个框架都占据 1/4 的窗口空间。中间行将会占据剩下 1/2 的窗口空间。

例子 2
用窗口尺寸的百分比表示的框架行和列尺寸数据更加实际。

例如，下面这个示例与刚才那个示例的效果相同：

<frameset rows="25%,50%,25%">当然，如果这些百分比加起来不是 100%，浏览器也会自动按照比例重新给出每行尺寸以消除差异。

例子 3
如果你像我们一样，那么将问题综合起来就不是一件难事。可能有的框架设计人员正为同样的困难而感到苦恼，这就解释了为什么他们要在 <frameset> 的 rows 和 cols 值上加上星号。它告诉浏览器要在将相邻的框架放入框架集之后，给剩下的空间分配各自的行或列。

例如，当浏览器遇到下列框架标签时：

<frameset cols="100, *">上面的例子会生成一个宽为固定的 100 像素的列，然后再生成另一个框架列，该列会占据框架集中其余所有的空间。

例子 4
您还可以对多个列或行属性值使用星号。在这样的情况下，相应的行或列将对可用空间进行等分，例如：

<frameset rows="*, 100, *">这条语句在框架集的中间生成一个 100 像素高的行，并在这行的上边和下边各生成一个相同尺寸的行。

例子 5
如果在星号前放置一个整数值，相应的行或列就会相对地获得更多的可用空间。例如：

<frameset cols="10%, 3*, *, *">它生成了 4 列：第一列占据整个框架集宽度的 10%。然后浏览器把其他空间的 3/5 分配给第二个框架，第三个和第四个框架各分配其余空间的 1/5。

从上面的例子可以发现，使用星号（尤其是用数值作为前缀），可以很容易地在一个框架集中分割剩下的空间。
提示和注释
提示：需要注意的是，浏览器允许用户手动地为单个框架文档的行或列重新确定大小，并因此改变每个框架在框架显示中各自占据的相对比例，除非你显式地告诉浏览器不要这样做。为了防止这种情况，可以在 <frame> 标签中使用 noresize 属性。
■◆1572■列框架              简化命令：列■列■HTML <frameset> 标签的 cols 属性和 rows 属性
作用和用法
<frameset> 标签有一个必需的属性：要么是 rows，要么是 cols，这取决于您的选择，它们定义了文档窗口中框架或嵌套的框架集的行或列的大小及数目。

这两个属性都接受用引号括起来并用逗号分开的值列表，这些数值指定了框架的绝对（像素点）或相对（百分比或其余空间）宽度（对列而言），或者绝对或相对高度（对行而言）。这些属性值的数目决定了浏览器将会在文档窗口中显示多少行或列的框架。

与表格一样，浏览器在显示时会尽可能接近给定的框架集尺寸。但是，浏览器不会为了能够容纳下超出边沿的框架集而扩展文档窗口的边界，也不会在指定的框架没有填满整个窗口时用空白区域来填满窗口。相反，浏览器会根据一个框架在行和列中相对于其他框架的大小来分配空间，这样就能够填满整个文档窗口了。（注意到一个主框架文档中没有滚动条了吗？）
例子
例子 1
下面的代码将创建 3 行框架：

<frameset rows="150,300,150">其中的每行都贯穿整个文档窗口。第一和最后一个框架被设为 150 像素高，第二行设置成 300 像素高。

实际上，除非浏览器窗口正好是 600 像素高，否则浏览器将会自动按照比例延伸或压缩第一和最后一个框架，使得这两个框架都占据 1/4 的窗口空间。中间行将会占据剩下 1/2 的窗口空间。

例子 2
用窗口尺寸的百分比表示的框架行和列尺寸数据更加实际。

例如，下面这个示例与刚才那个示例的效果相同：

<frameset rows="25%,50%,25%">当然，如果这些百分比加起来不是 100%，浏览器也会自动按照比例重新给出每行尺寸以消除差异。

例子 3
如果你像我们一样，那么将问题综合起来就不是一件难事。可能有的框架设计人员正为同样的困难而感到苦恼，这就解释了为什么他们要在 <frameset> 的 rows 和 cols 值上加上星号。它告诉浏览器要在将相邻的框架放入框架集之后，给剩下的空间分配各自的行或列。

例如，当浏览器遇到下列框架标签时：

<frameset cols="100, *">上面的例子会生成一个宽为固定的 100 像素的列，然后再生成另一个框架列，该列会占据框架集中其余所有的空间。

例子 4
您还可以对多个列或行属性值使用星号。在这样的情况下，相应的行或列将对可用空间进行等分，例如：

<frameset rows="*, 100, *">这条语句在框架集的中间生成一个 100 像素高的行，并在这行的上边和下边各生成一个相同尺寸的行。

例子 5
如果在星号前放置一个整数值，相应的行或列就会相对地获得更多的可用空间。例如：

<frameset cols="10%, 3*, *, *">它生成了 4 列：第一列占据整个框架集宽度的 10%。然后浏览器把其他空间的 3/5 分配给第二个框架，第三个和第四个框架各分配其余空间的 1/5。

从上面的例子可以发现，使用星号（尤其是用数值作为前缀），可以很容易地在一个框架集中分割剩下的空间。
提示和注释
提示：需要注意的是，浏览器允许用户手动地为单个框架文档的行或列重新确定大小，并因此改变每个框架在框架显示中各自占据的相对比例，除非你显式地告诉浏览器不要这样做。为了防止这种情况，可以在 <frame> 标签中使用 noresize 属性。
■◆978■针对不支持框架替代内容简化命令：否框架■否框架■HTML <noframes> 标签
定义和用法
noframes 元素可为那些不支持框架的浏览器显示文本。noframes 元素位于 frameset 元素内部。
■◆978■内联框架            简化命令：内框架■内框架■HTML <iframe> 标签
定义和用法
iframe 元素会创建包含另外一个文档的内联框架（即行内框架）。
■◆1602■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1602■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1602■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1602■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1602■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1602■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1602■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1602■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1602■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1602■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1602■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1602■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1602■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1602■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1602■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1602■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1602■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1602■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1602■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1602■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1602■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1602■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1602■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1602■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1602■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1602■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1602■水平和垂直对齐      简化命令：横对齐■横对齐■HTML <iframe> 标签的 align 属性
HTML <iframe> 标签
定义和用法
align 属性规定 iframe 相对于周围元素的水平和垂直对齐方式。

iframe 元素是行内元素（不会在页面上插入新行），这意味着文本和其他元素可以围绕在其周围。所以，align 属性可以帮助我们规定 iframe 相对于周围元素的对齐方式。
实例
右对齐的 iframe：

<iframe src ="/index.html" align="right">
<p>Your browser does not support iframes.</p>
</iframe>
TIY
浏览器支持
尽管我们不赞成使用 align 属性，但是几乎所有浏览器都支持该属性。
兼容性提示
在 HTML 4.01 中，不赞成使用 iframe 元素的 align 属性，在 XHTML 1.0 Strict DTD 中，不支持该属性。

请使用 CSS 代替。

CSS 语法：<iframe style="float:right">

CSS 实例：向右浮动 iframe

在我们的 CSS 教程中，您可以找到更多有关 float 属性的知识。
语法
<iframe align="value">属性值
值 描述 
left 向左对齐 iframe。 
right 向右对齐 iframe。 
middle 居中对齐 iframe。 
top 在顶部对齐 iframe。 
bottom 在底部对齐 iframe。 
HTML <iframe> 标签
■◆1602■周围边框            简化命令：框架边框■框架边框■HTML <iframe> 标签的 frameborder 属性
HTML <iframe> 标签
定义和用法
frameborder 属性规定是否显示 iframe 周围的边框。

提示：出于实用性方面的原因，最好不用设置该属性，请使用 CSS 来应用边框样式和颜色。

CSS 实例：iframe 边框。
实例
右对齐的 iframe：

<iframe src ="/index.html" frameborder="0">
<p>Your browser does not support iframes.</p>
</iframe>
TIY
语法
<iframe frameborder="value">属性值
值 描述 
1 有边框（默认值）。 
0 关闭边框。 
■◆1602■高度                简化命令：高■高■HTML <iframe> 标签的 height 属性
HTML <iframe> 标签
定义和用法
height 属性规定 iframe 的高度。
实例
带有带有制定高度和宽度的 iframe：

<iframe src ="/index.html" width="400" height="300">
<p>Your browser does not support iframes.</p>
</iframe>
TIY
语法
<iframe height="value">属性值
值 描述 
pixels 以像素计的高度值（比如 "100px"）。 
percent 以包含元素百分比计的高度值（比如 "20%"）。 
■◆1602■较长描述            简化命令：描述页■描述页■HTML <iframe> 标签的 longdesc 属性
HTML <iframe> 标签
定义和用法
longdesc 属性规定指向某个页面的 URL，该页面包含了有关 iframe 的较长描述。

由于浏览器对 longdesc 属性的支持性非常差，没有必要使用该属性。

提示：如需为某个 iframe 提供长描述（如果有必要的话），只要简单地创建一个指向描述页面的链接即可（该链接对任何人都是可见的）。
实例
带有 longdesc 属性的 iframe，这个属性指向了带有长描述的页面：

<iframe src ="/index.html" longdesc="w3school.txt">
<p>Your browser does not support iframes.</p>
</iframe>
浏览器支持
主流浏览器几乎都不支持 longdesc 属性。
语法
<iframe longdesc="value">属性值
值 描述 
URL 规定 iframe 的内容描述页面的 URL。

可能的值：

?绝对 URL - 指向其他站点（比如 src="www.example.com/description.txt"）
?相对 URL - 指向站点内的文件（比如 src="description.txt"）
 
■◆1602■顶部和底部边距      简化命令：上下边距■上下边距■HTML <iframe> 标签的 marginheight 属性
HTML <iframe> 标签
定义和用法
marginheight 属性规定 iframe 的顶部和底部的空白边距，以像素计。
实例
带有 50 像素顶部和底部空白边距的 iframe：

<iframe src ="/index.html" marginheight="50px">
<p>Your browser does not support iframes.</p>
</iframe>
TIY
语法
<iframe marginheight="value">属性值
值 描述 
pixels 规定 iframe 的顶部和底部的空白边距，以像素计。 
■◆1602■左边和右边边距      简化命令：左右边距■左右边距■HTML <iframe> 标签的 marginwidth 属性
HTML <iframe> 标签
定义和用法
marginwidth 属性规定 iframe 的左边和右边的空白边距，以像素计。
实例
带有 50 像素左侧和右侧空白边距的 iframe：

<iframe src ="/index.html" marginwidth="50px">
<p>Your browser does not support iframes.</p>
</iframe>
TIY
语法
<iframe marginwidth="value">属性值
值 描述 
pixels 规定 iframe 的左边和右边的空白边距，以像素计。 
■◆1602■名称                简化命令：名■名■HTML <iframe> 标签的 name 属性
HTML <iframe> 标签
定义和用法
name 属性规定 iframe 的名称。

iframe 元素的 name 属性用于在 JavaScript 中引用元素，或者作为链接的目标。
实例
作为链接目标的 iframe：

<iframe src="demo_iframe.htm" name="iframe_a">
  <p>Your browser does not support iframes.</p>
</iframe>
<a href="http://www.w3school.com.cn" target="iframe_a">W3School.com.cn</a>
TIY
语法
<iframe name="value">属性值
值 描述 
name 规定 iframe 的名称。 
■◆1602■滚动条              简化命令：滚动条■滚动条■HTML <iframe> 标签的 scrolling 属性
HTML <iframe> 标签
定义和用法
scrolling 属性规定是否在 iframe 中显示滚动条。

默认地，如果内容超出了 iframe，滚动条就会出现在 iframe 中。
实例
带有滚动条的 iframe：

<iframe src ="/index.html" scrolling="yes">
<p>Your browser does not support iframes.</p>
</iframe>
TIY
语法
<iframe scrolling="value">属性值
值 描述 
auto 在需要的情况下出现滚动条（默认值）。 
yes 始终显示滚动条（即使不需要）。 
no 从不显示滚动条（即使需要）。 
■◆1602■文档的 URL          简化命令：路径■路径■HTML <iframe> 标签的 src 属性
HTML <iframe> 标签
定义和用法
src 属性规定在 iframe 中显示的文档的 URL。
实例
带有滚动条的 iframe：

<iframe src="/index.html">
<p>Your browser does not support iframes.</p>
</iframe>
TIY
语法
<iframe src="value">属性值
值 描述 
URL 规定显示在 iframe 中的文档的地址。

可能的值：

?绝对 URL - 指向其他站点（比如 src="www.example.com/index.html"）
?相对 URL - 指向站点内的文件（比如 src="index.html"）
 
■◆1602■宽度                简化命令：宽■宽■HTML <iframe> 标签的 width 属性
HTML <iframe> 标签
定义和用法
width 属性规定 iframe 的宽度。
实例
带有带有制定高度和宽度的 iframe：

<iframe src ="/index.html" width="400" height="300">
<p>Your browser does not support iframes.</p>
</iframe>
TIY
语法
<iframe width="value">属性值
值 描述 
pixels 以像素计的宽度值（比如 "100px"）。 
percent 以包含元素百分比计的宽度值（比如 "20%"）。 
■◆978■表单                简化命令：表单■表单■HTML <form> 标签
定义和用法
<form> 标签用于为用户输入创建 HTML 表单。

表单能够包含 input 元素，比如文本字段、复选框、单选框、提交按钮等等。

表单还可以包含 menus、textarea、fieldset、legend 和 label 元素。

表单用于向服务器传输数据。
■◆1639■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1639■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1639■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1639■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1639■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1639■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1639■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1639■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1639■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1639■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1639■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1639■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1639■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1639■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1639■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1639■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1639■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1639■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1639■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1639■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1639■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1639■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1639■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1639■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1639■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1639■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1639■提交表单目的地页面  简化命令：发送地址■发送地址■HTML <form> 标签的 action 属性
HTML <form> 标签
定义和用法
必需的 action 属性规定当提交表单时，向何处发送表单数据。
实例
下面的表单拥有两个输入字段以及一个提交按钮，当提交表单时，表单数据会提交到名为 "form_action.asp" 的页面：

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="submit" value="Submit" />
</form>
TIY
语法
<form action="value">属性值
值 描述 
URL 向何处发送表单数据。

可能的值：

?绝对 URL - 指向其他站点（比如 src="www.example.com/example.htm"）
?相对 URL - 指向站点内的文件（比如 src="example.htm"）
 
■◆1639■文件类型            简化命令：文件类型■文件类型■HTML <form> 标签的 accept 属性
HTML <form> 标签
定义和用法
accept 属性规定能够通过文件上传进行提交的文件类型。

提示：请避免使用该属性。应该在服务器端验证文件上传。
实例
在表单中使用 accept 属性（允许上传两种类型的文件：gif 和 jpeg）：

<form action="form_action.asp" accept="image/gif, image/jpeg">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <p>Your image: <input type="file" name="pic" id="pic" /></p>
  <input type="submit" value="Submit" />
</form>
TIY
浏览器支持
注释：几乎没有浏览器正确地支持 accept 属性。
语法
<form accept="value">属性值
值 描述 
MIME_type 允许被提交的一个或多个 MIME 类型。

如需规定多个 MIME 类型，请使用逗号分隔它们。
 
■◆1639■表单数据所接受的字符集简化命令：服务字符集■服务字符集■HTML <form> 标签的 accept-charset 属性
HTML <form> 标签
定义和用法
accept-charset 属性规定服务器处理表单数据所接受的字符集。

accept-charset 属性允许您指定一系列字符集，服务器必须支持这些字符集，从而得以正确解释表单中的数据。

该属性的值是用引号包含字符集名称列表。如果可接受字符集与用户所使用的字符即不相匹配的话，浏览器可以选择忽略表单或是将该表单区别对待。

此属性的默认值是 "unknown"，表示表单的字符集与包含表单的文档的字符集相同。

提示：请避免使用该属性。应该在服务器端验证文件上传。
实例
在表单中使用 accept-charset 属性：

<form action="form_action.asp" accept-charset="ISO-8859-1">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="submit" value="Submit" />
</form>
TIY
浏览器支持
除了 Internet Explorer，accept-charset 属性得到几乎所有浏览器的支持。

注释：accept-charset 属性无法在 Internet Explorer 中正确地工作。如果 accept-charset 属性设置为 "ISO-8859-1"，IE 将发送以 "Windows-1252" 编码的数据。
语法
<form accept-charset="value">属性值
值 描述 
character_set 服务器能够处理的一个或多个字符集。如需规定多个字符集，请使用逗号分隔它们。

常用的字符集有：

?UTF-8 - Unicode 字符编码
?ISO-8859-1 - 拉丁字母表的字符编码
在理论上，可以使用任何字符集，但并不是所有浏览器都能够理解它们。某种字符集使用的范围越广，浏览器就越有可能理解它。

如需查看所有可用的字符集，请访问我们的 字符集参考手册。
 
■◆1639■表单数据编码        简化命令：数据编码■数据编码■HTML <form> 标签的 enctype 属性
HTML <form> 标签
定义和用法
enctype 属性规定在发送到服务器之前应该如何对表单数据进行编码。

默认地，表单数据会编码为 "application/x-www-form-urlencoded"。就是说，在发送到服务器之前，所有字符都会进行编码（空格转换为 "+" 加号，特殊符号转换为 ASCII HEX 值）。
实例
在下面的例子中，表单数据会在未编码的情况下进行发送：

<form action="form_action.asp" enctype="text/plain">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="submit" value="Submit" />
</form>
TIY
语法
<form enctype="value">属性值
值 描述 
application/x-www-form-urlencoded 在发送前编码所有字符（默认） 
multipart/form-data 不对字符编码。

在使用包含文件上传控件的表单时，必须使用该值。
 
text/plain 空格转换为 "+" 加号，但不对特殊字符编码。 
HTML <form> 标签
■◆1639■如何发送            简化命令：方式■方式■HTML <form> 标签的 method 属性
HTML <form> 标签
定义和用法
method 属性规定如何发送表单数据（表单数据发送到 action 属性所规定的页面）。

表单数据可以作为 URL 变量（method="get"）或者 HTTP post （method="post"）的方式来发送。
实例
在下面的例子中，表单数据将通过 method 属性附加到 URL 上：

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="submit" value="Submit" />
</form>
TIY
method 属性
浏览器使用 method 属性设置的方法将表单中的数据传送给服务器进行处理。共有两种方法：POST 方法和 GET 方法。

如果采用 POST 方法，浏览器将会按照下面两步来发送数据。首先，浏览器将与 action 属性中指定的表单处理服务器建立联系，一旦建立连接之后，浏览器就会按分段传输的方法将数据发送给服务器。

在服务器端，一旦 POST 样式的应用程序开始执行时，就应该从一个标志位置读取参数，而一旦读到参数，在应用程序能够使用这些表单值以前，必须对这些参数进行解码。用户特定的服务器会明确指定应用程序应该如何接受这些参数。

另一种情况是采用 GET 方法，这时浏览器会与表单处理服务器建立连接，然后直接在一个传输步骤中发送所有的表单数据：浏览器会将数据直接附在表单的 action URL 之后。这两者之间用问号进行分隔。

一般浏览器通过上述任何一种方法都可以传输表单信息，而有些服务器只接受其中一种方法提供的数据。可以在 <form> 标签的 method （方法）属性中指明表单处理服务器要用方法来处理数据，使 POST 还是 GET。
POST 还是 GET？
如果表单处理服务器既支持 POST 方法又支持 GET 方法，那么你该选择哪种方法呢？下面是有关这方面的一些规律：

?如果希望获得最佳表单传输性能，可以采用 GET 方法发送只有少数简短字段的小表单。
?一些服务器操作系统在处理可以立即传递给应用程序的命令行参数时，会限制其数目和长度，在这种情况下，对那些有许多字段或是很长的文本域的表单来说，就应该采用 POST 方法来发送。
?如果你在编写服务器端的表单处理应用程序方面经验不足，应该选择 GET 方法。如果采用 POST 方法，就要在读取和解码方法做些额外的工作，也许这并不很难，但是也许你不太愿意去处理这些问题。
?如果安全性是个问题，那么我们建议选用 POST 方法。GET 方法将表单参数直接放在应用程序的 URL 中，这样网络窥探者可以很轻松地捕获它们，还可以从服务器的日志文件中进行摘录。如果参数中包含了信用卡帐号这样的敏感信息，就会在不知不觉中危及用户的安全。而 POST 应用程序就没有安全方面的漏洞，在将参数作为单独的事务传输给服务器进行处理时，至少还可以采用加密的方法。
?如果想在表单之外调用服务器端的应用程序，而且包括向其传递参数的过程，就要采用 GET 方法，因为该方法允许把表单这样的参数包括进来作为 URL 的一部分。而另一方面，使用 POST 样式的应用程序却希望在 URL 后还能有一个来自浏览器额外的传输过程，其中传输的内容不能作为传统 <a> 标签的内容。
明确传递参数
前面的一些建议也可以作为选择此种方式的一定解释。假设你有一个很简单的表单，其中只包含 x 和 y 这两个参数。在对这些元素的值进行编码时，它们的形式如下所示：

x=28&y=66如果表单采用了 method=GET，那么用来引用服务器端应用程序的 URL 将如下所示：

http://www.example.com/example/program?x=28&y=66在任何时候我们都可以创建一个传统的 <a> 标签，用它在调用带有所需参数值的表单，其形式如下所示： 

<a href="http://www.example.com/example/program?x=28&y=66">唯一的问题是，分隔参数所用的 & 符号也是字符实体中的插入符号。如果在 <a> 标签的 href 属性中放入一个 & 符号，浏览器就会将其后面的字符替换成相应的字符实体。

为了防止出现这种情况，我们必须用它的实体对等物来替换 & 符号，也就是用 "&#38;" 或 "&amp;" 来替换。替换之后，上面的那个引用服务器应用程序的非表单示例将如下所示：

<a href="http://www.example.com/example/program?x=28&amp;y=66">由于这样还是不能在 URL 中使用 & 符号，并且有可能在将来带来混乱，因此我们鼓励服务器设置最后也能够接受用分号作为参数分隔符。您也可以看看自己的服务器文档，了解服务器是否支持这种功能。
语法
<form target="value">属性值
值 描述 
_blank 在新窗口中打开。 
_self 默认。在相同的框架中打开。 
_parent 在父框架集中打开。 
_top 在整个窗口中打开。 
framename 在指定的框架中打开。 
■◆1639■名称                简化命令：名■名■HTML <form> 标签的 name 属性
HTML <form> 标签
定义和用法
name 属性规定表单的名称。

form 元素的 name 属性提供了一种在脚本中引用表单的方法。
实例
带有 name 属性的 HTML 表单：

<form action="form_action.asp" method="get" name="myForm">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="button" onclick="formSubmit()" value="Send form data!" />
</form>
TIY
语法
<form name="value">属性值
值 描述 
name 表单的名称。 
HTML <form> 标签
■◆1639■在何处打开 action URL简化命令：何处■何处■HTML <form> 标签的 target 属性
HTML <form> 标签
定义和用法
target 属性规定在何处打开 action URL。
实例
在下面的例子中，在 action 属性中规定的页面会在新窗口中打开：

<form action="form_action.asp" method="get" target="_blank">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="submit" value="Submit" />
</form>
TIY
兼容性注释
在 HTML 4.01 中，不赞成使用 form 元素的 target 属性；在 XHTML 1.0 Strict DTD 中，不支持该属性。
语法
<form target="value">属性值
值 描述 
_blank 在新窗口中打开。 
_self 默认。在相同的框架中打开。 
_parent 在父框架集中打开。 
_top 在整个窗口中打开。 
framename 在指定的框架中打开。 
■◆978■输入控件            简化命令：输入■输入■HTML <input> 标签
定义和用法
<input> 标签用于搜集用户信息。

根据不同的 type 属性值，输入字段拥有很多种形式。输入字段可以是文本字段、复选框、掩码后的文本控件、单选按钮、按钮等等。
■◆1673■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1673■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1673■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1673■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1673■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1673■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1673■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1673■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1673■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1673■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1673■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1673■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1673■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1673■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1673■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1673■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1673■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1673■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1673■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1673■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1673■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1673■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1673■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1673■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1673■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1673■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1673■上传文件类型        简化命令：文件类型■文件类型■HTML <input> 标签的 accept 属性
HTML <input> 标签
定义和用法
accept 属性只能与 <input type="file"> 配合使用。它规定能够通过文件上传进行提交的文件类型。

提示：请避免使用该属性。应该在服务器端验证文件上传。
实例
在文件上传中使用 accept 属性，本例中的输入字段可以接受 GIF 和 JPEG 两种图像：

<form>
  <input type="file" name="pic" id="pic" accept="image/gif, image/jpeg" />
</form>
如果不限制图像的格式，可以写为：accept="image/*"。
语法
<input accept="value">属性值
值 描述 
MIME_type 用逗号隔开的 MIME 类型列表。 
■◆1673■对齐方式            简化命令：横对齐■横对齐■HTML <input> 标签的 align 属性
HTML <input> 标签
定义和用法
align 属性只能与 <input type="image"> 配合使用。它规定图像输入相对于周围其他元素的对齐方式。
实例
下面的表单拥有两个输入字段以及一个图像形式的提交按钮：

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="image" src="submit.jpg" alt="Submit" align="right" />
  <p>This is some text This is some text This is some text.</p>
</form>
亲自试一试
浏览器支持
只有 "left" 和 "right" 值得到所有浏览器的支持。
兼容性注释
在 HTML 4.01 中，不赞成使用 input 元素的 align 属性。在 XHTML 1.0 Strict DTD 中不支持该属性。

请使用 CSS 代替。

CSS 语法：<input type="image" style="float:right" />

CSS 实例: 对齐 input 图像

在我们的 CSS 教程中，您可以找到更多有关 float 属性 的细节。
语法
<input accept="value">属性值
值 描述 
left 左对齐图像（默认）。 
right 右对齐对象。 
top 上对齐图像。 
middle 居中对齐图像。 
bottom 下对齐图像。 
■◆1673■替代文本            简化命令：替文■替文■HTML <input> 标签的 alt 属性
HTML <input> 标签
定义和用法
alt 属性只能与 <input type="image"> 配合使用。它为图像输入规定替代文本。

alt 属性为用户由于某些原因无法查看图像时提供了备选的信息。

注释：即使 alt 属性不是必需的属性，但是当输入类型为 image 时，仍然应该设置该属性。如果不使用该属性，就有可能对文本浏览器或非可视的浏览器造成使用障碍。
实例
下面的表单拥有两个输入字段以及一个图像形式的提交按钮：

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="image" src="submit.jpg" alt="Submit" align="right" />
</form>
亲自试一试
浏览器支持
除了 Safari，所有主流的浏览器都支持 "alt" 属性。
语法
<input alt="value">属性值
值 描述 
value 图像 input 的替代文本。 
■◆1673■被选中              简化命令：被选■被选■HTML <input> 标签的 checked 属性
HTML <input> 标签
定义和用法
checked 属性规定在页面加载时应该被预先选定的 input 元素。

checked 属性 与 <input type="checkbox"> 或 <input type="radio"> 配合使用。

checked 属性也可以在页面加载后，通过 JavaScript 代码进行设置。
实例
带有一个预选定复选框的 HTML 表单：

<form action="form_action.asp" method="get">
<input type="checkbox" name="vehicle" value="Car" checked="checked" /> I have a car
</form>
亲自试一试
语法
<input checked="value">属性值
值 描述 
checked 预先选定复选框或单选按钮。 
■◆1673■禁用 input 元素     简化命令：禁用■禁用■HTML <input> 标签的 disabled 属性
HTML <input> 标签
定义和用法
disabled 属性规定应该禁用 input 元素。

被禁用的 input 元素既不可用，也不可点击。可以设置 disabled 属性，直到满足某些其他的条件为止（比如选择了一个复选框等等）。然后，就需要通过 JavaScript 来删除 disabled 值，将 input 元素的值切换为可用。

注释：disabled 属性无法与 <input type="hidden"> 一起使用。
实例
带有一个禁用输入字段的 HTML 表单：

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" disabled="disabled" /></p>
  <input type="submit" value="Submit" />
</form>
亲自试一试
语法
<input disabled="value">属性值
值 描述 
disabled 禁用一个 input 元素。 
■◆1673■最大长度            简化命令：最大长■最大长■HTML <input> 标签的 maxlength 属性
HTML <input> 标签
定义和用法
maxlength 属性规定输入字段的最大长度，以字符个数计。

maxlength 属性与 <input type="text"> 或 <input type="password"> 配合使用。
实例
下面这个 HTML 表单带有最大长度分别是 85 和 55 个字符的两个输入字段：

<form action="form_action.asp" method="get">
  <p>Name: <input type="text" name="fullname" maxlength="85" /></p>
  <p>Email: <input type="text" name="email" maxlength="55" /></p>
  <input type="submit" value="Submit" />
</form>
亲自试一试
语法
<input maxlength="value">属性值
值 描述 
characters 输入字段中允许的最大字符数。 
■◆1673■名称                简化命令：名■名■HTML <input> 标签的 name 属性
HTML <input> 标签
定义和用法
name 属性规定 input 元素的名称。

name 属性用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据。

注释：只有设置了 name 属性的表单元素才能在提交表单时传递它们的值。
实例
带有两个文本字段和一个提交按钮的 HTML 表单：

<form action="form_action.asp" method="get">
  <p>Name: <input type="text" name="fullname" /></p>
  <p>Email: <input type="text" name="email" /></p>
  <input type="submit" value="Submit" />
</form>
亲自试一试
语法
<input name="value">属性值
值 描述 
name 元素的名称。 
■◆1673■字段为只读          简化命令：只读■只读■HTML <input> 标签的 readonly 属性
HTML <input> 标签
定义和用法
readonly 属性规定输入字段为只读。

只读字段是不能修改的。不过，用户仍然可以使用 tab 键切换到该字段，还可以选中或拷贝其文本。

readonly 属性可以防止用户对值进行修改，直到满足某些条件为止（比如选中了一个复选框）。然后，需要使用 JavaScript 消除 readonly 值，将输入字段切换到可编辑状态。

readonly 属性可与 <input type="text"> 或 <input type="password"> 配合使用。
实例
带有两个文本字段和一个提交按钮的 HTML 表单：

<form action="form_action.asp" method="get">
  Name:<input type="text" name="email" />
  Country:<input type="text" name="country" value="China" readonly="readonly" />
  <input type="submit" value="Submit" />
</form>
亲自试一试
语法
<input readonly="value">属性值
值 描述 
readonly 把输入字段设置为只读。 
■◆1673■字段的宽度          简化命令：尺寸■尺寸■HTML <input> 标签的 size 属性
HTML <input> 标签
定义和用法
size 属性规定输入字段的宽度。

对于 <input type="text"> 和 <input type="password">，size 属性定义的是可见的字符数。而对于其他类型，size 属性定义的是以像素为单位的输入字段宽度。
实例
下面这个 HTML 表单分别有两个输入字段，宽度分别是 35 个字符和 18 个字符：

<form action="form_action.asp" method="get">
  <p>Email: <input type="text" name="email" size="35" /></p>
  <p>PIN: <input type="text" name="pin" maxlength="18" size="18" /></p>
  <input type="submit" value="Submit" />
</form>
亲自试一试
兼容性提示
由于 size 属性是一个可视化的设计属性，我们推荐您使用 CSS 来代替它。

CSS 语法：<input style="width:100px" />

CSS 实例：设置输入字段的宽度。

在 W3School 的 CSS 教程中，您可以找到更多有关 width 属性 的细节。
语法
<input size="value">属性值
值 描述 
characters/pixels input 元素的宽度。 
■◆1673■按钮显示的图像      简化命令：路径■路径■HTML <input> 标签的 src 属性
HTML <input> 标签
定义和用法
src 属性只能与 <input type="image"> 配合使用。它规定作为提交按钮显示的图像的 URL。

src 属性必须与 <input type="image"> 同时使用。
实例
下面的表单拥有两个输入字段以及一个图像形式的提交按钮：

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="image" src="submit.jpg" alt="Submit" align="right" />
</form>
亲自试一试
语法
<input src="value">属性值
值 描述 
URL 作为提交按钮使用的图像的 URL。

可能的值：

?绝对 URL - 指向另一个站点（比如 src="www.example.com/submit.gif"）
?相对 URL - 指向网站内的文件（比如 src="submit.gif"）
 
■◆1673■input元素类型       简化命令：类型■类型■HTML <input> 标签的 type 属性
HTML <input> 标签
定义和用法
type 属性规定 input 元素的类型。
实例
下面的表单拥有两个输入字段以及一个提交按钮：

<form action="form_action.asp" method="get">
  <p>First name: <input type="text" name="fname" /></p>
  <p>Last name: <input type="text" name="lname" /></p>
  <input type="submit" value="Submit" />
</form>
亲自试一试（您在页面下面可以找到更多例子）
语法
<input type="value">属性值
值 描述 
button 定义可点击按钮（多数情况下，用于通过 JavaScript 启动脚本）。 
checkbox 定义复选框。 
file 定义输入字段和 "浏览"按钮，供文件上传。 
hidden 定义隐藏的输入字段。 
image 定义图像形式的提交按钮。 
password 定义密码字段。该字段中的字符被掩码。 
radio 定义单选按钮。 
reset 定义重置按钮。重置按钮会清除表单中的所有数据。 
submit 定义提交按钮。提交按钮会把表单数据发送到服务器。 
text 定义单行的输入字段，用户可在其中输入文本。默认宽度为 20 个字符。 
■◆1673■input 元素设定值    简化命令：值■值■HTML <input> 标签的 value 属性
HTML <input> 标签
定义和用法
value 属性为 input 元素设定值。

对于不同的输入类型，value 属性的用法也不同：

?type="button", "reset", "submit" - 定义按钮上的显示的文本
?type="text", "password", "hidden" - 定义输入字段的初始值
?type="checkbox", "radio", "image" - 定义与输入相关联的值
注释：<input type="checkbox"> 和 <input type="radio"> 中必须设置 value 属性。

注释：value 属性无法与 <input type="file"> 一同使用。
实例
下面的表单拥有两个输入字段以及一个提交按钮 - 它们都带有预定义的值：

<form action="form_action.asp" method="get">
  First name: <input type="text" name="fname" value="George" /><br />
  Last name: <input type="text" name="lname" value="Bush" /><br />
  <input type="submit" value="Submit form" />
</form>亲自试一试
语法
<input value="value">属性值
值 描述 
value input 元素的值。 
HTML <input> 标签
■◆978■多行文本输入        简化命令：文区■文区■HTML <textarea> 标签
定义和用法
<textarea> 标签定义多行的文本输入控件。

文本区中可容纳无限数量的文本，其中的文本的默认字体是等宽字体（通常是 Courier）。

可以通过 cols 和 rows 属性来规定 textarea 的尺寸，不过更好的办法是使用 CSS 的 height 和 width 属性。

注释：在文本输入区内的文本行间，用 "%OD%OA" （回车/换行）进行分隔。

提示：可以通过 <textarea> 标签的 wrap 属性设置文本输入区内的换行模式
■◆1712■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1712■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1712■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1712■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1712■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1712■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1712■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1712■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1712■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1712■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1712■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1712■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1712■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1712■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1712■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1712■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1712■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1712■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1712■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1712■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1712■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1712■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1712■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1712■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1712■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1712■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1712■可见宽度            简化命令：列■列■HTML <textarea> 标签的 cols 属性
HTML <textarea> 标签
定义和用法
cols 属性规定 textarea 的可见宽度。
实例
一个 25 个字符宽 3 行高的文本区：

<textarea rows="3" cols="20">
在w3school，你可以找到你所需要的所有的网站建设教程。
</textarea>
TIY
语法
<textarea cols="value">属性值
值 描述 
number 规定文本区的宽度（以平均字符数计）。 
■◆1712■可见行数            简化命令：行■行■HTML <textarea> 标签的 rows 属性
HTML <textarea> 标签
定义和用法
rows 属性规定 textarea 的可见高度。
实例
一个 25 个字符宽 3 行高的文本区：

<textarea rows="3" cols="20">
在w3school，你可以找到你所需要的所有的网站建设教程。
</textarea>
TIY
语法
<textarea rows="value">属性值
值 描述 
number 规定文本区的高度（以行数计）。 
■◆1712■禁用文本区          简化命令：禁用■禁用■HTML <textarea> 标签的 disabled 属性
HTML <textarea> 标签
定义和用法
disabled 属性规定禁用文本区。被禁用的文本区既不可用，也不可点击。

可以设置 disabled 属性，直到满足某些条件（比如选择一个复选框），才恢复用户对该文本区的使用。然后，可以使用 JavaScript 来清除 disabled 属性，以使文本区变为可用状态。
实例
一个被禁用的文本区：

<textarea rows="3" cols="20" disabled="disabled">
在w3school，你可以找到你所需要的所有的网站建设教程。
</textarea>
TIY
语法
<textarea disabled="value">属性值
值 描述 
disabled 规定应该禁用该文本区。 
■◆1712■名称                简化命令：名■名■HTML <textarea> 标签的 name 属性
HTML <textarea> 标签
定义和用法
name 属性为文本区规定名称。

name 属性用于在 JavaScript 中对元素进行引用，或者在表单提交之后，对表单数据进行引用。
实例
一个带有 name 属性的文本区：

<textarea rows="3" cols="20" name="W3School_text">
在w3school，你可以找到你所需要的所有的网站建设教程。
</textarea>
TIY
语法
<textarea name="value">属性值
值 描述 
name_of_textarea 规定文本区的名称。 
■◆1712■文本区为只读        简化命令：只读■只读■HTML <textarea> 标签的 readonly 属性
HTML <textarea> 标签
定义和用法
readonly 属性规定文本区为只读。

在只读的文本区中，无法对内容进行修改，但用户可以通过 tab 键切换到该控件，选取或复制其中的内容。

可以设置 readonly 属性，直到满足某些条件（比如选择一个复选框），才恢复用户对该文本区的使用。然后，可以使用 JavaScript 来清除 readonly 属性，以使文本区变为可编辑状态。
实例
一个带有 name 属性的文本区：

<textarea rows="3" cols="20" readonly="readonly">
在w3school，你可以找到你所需要的所有的网站建设教程。
</textarea>
TIY
语法
<textarea readonly="value">属性值
值 描述 
readonly 规定文本区为只读。 
■◆978■按钮                简化命令：按钮■按钮■HTML <button> 标签
定义和用法
<button> 标签定义一个按钮。

在 button 元素内部，您可以放置内容，比如文本或图像。这是该元素与使用 input 元素创建的按钮之间的不同之处。

<button> 控件 与 <input type="button"> 相比，提供了更为强大的功能和更丰富的内容。<button> 与 </button> 标签之间的所有内容都是按钮的内容，其中包括任何可接受的正文内容，比如文本或多媒体内容。例如，我们可以在按钮中包括一个图像和相关的文本，用它们在按钮中创建一个吸引人的标记图像。

唯一禁止使用的元素是图像映射，因为它对鼠标和键盘敏感的动作会干扰表单按钮的行为。

请始终为按钮规定 type 属性。Internet Explorer 的默认类型是 "button"，而其他浏览器中（包括 W3C 规范）的默认值是 "submit"。
■◆1744■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1744■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1744■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1744■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1744■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1744■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1744■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1744■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1744■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1744■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1744■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1744■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1744■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1744■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1744■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1744■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1744■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1744■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1744■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1744■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1744■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1744■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1744■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1744■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1744■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1744■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1744■禁用按钮            简化命令：禁用■禁用■HTML <button> 标签的 disabled 属性
HTML <button> 标签
定义和用法
disabled 属性规定禁用按钮。

被禁用的按钮既不可用，也不可点击。

可以设置 disabled 属性，直到满足某些条件（比如选择一个复选框），才恢复用户对该按钮的使用。然后，可以使用 JavaScript 来清除 disabled 属性，以使文本区变为可用状态。
实例
一个被禁用的按钮：

<button type="button" disabled="disabled">Click Me!</button>TIY
语法
<button disabled="value">属性值
值 描述 
disabled 规定应该禁用该按钮。 
■◆1744■名称                简化命令：名■名■HTML <button> 标签的 name 属性
HTML <button> 标签
定义和用法
name 属性为按钮规定名称。

name 属性用于在 JavaScript 中对元素进行引用，或者在表单提交之后，对表单数据进行引用。

提示：不同的 button 元素可以共享相同的名称。这就允许您标记带有相同名称的若干按钮，以便在表单中使用时能够提交不同的值。
实例
两个按钮带有相同的名称，在单击它们时提交不同的值：

<form action="demo_button_name.asp" method="get">
  Choose your favorite subject:
  <button name="subject" type="submit" value="HTML">HTML</button>
  <button name="subject" type="submit" value="CSS">CSS</button>
</form>
TIY
语法
<button name="value">属性值
值 描述 
name 规定按钮的名称。 
■◆1744■按钮的类型          简化命令：类型■类型■HTML <button> 标签的 type 属性
HTML <button> 标签
定义和用法
type 属性规定按钮的类型。

提示：请始终为按钮规定 type 属性。Internet Explorer 的默认类型是 "button"，而其他浏览器中（包括 W3C 规范）的默认值是 "submit"。
实例
两个 button 元素，一个是提交按钮，另一个是重置按钮：

<form action="form_action.asp" method="get">
  First name: <input type="text" name="fname" />
  Last name: <input type="text" name="lname" />
  <button type="submit" value="Submit">Submit</button>
  <button type="reset" value="Reset">Reset</button>
</form>
TIY
语法
<button type="value">属性值
值 描述 
submit 该按钮是提交按钮（除了 Internet Explorer，该值是其他浏览器的默认值）。 
button 该按钮是可点击的按钮（Internet Explorer 的默认值）。 
reset 该按钮是重置按钮（清除表单数据）。 
■◆1744■初始值              简化命令：值■值■HTML <button> 标签的 value 属性
HTML <button> 标签
定义和用法
value 属性规定与按钮关联的初始值。

重要事项：如果在 HTML 表单中使用 button 元素，不同的浏览器会提交不同的值。Internet Explorer 将提交 <button> 与 <button/> 之间的文本，而其他浏览器将提交 value 属性的内容。请在 HTML 表单中使用 input 元素来创建按钮。
实例
两个按钮带有相同的名称，在单击它们时提交不同的值：

<form action="demo_button_name.asp" method="get">
  Choose your favorite subject:
  <button name="subject" type="submit" value="HTML">HTML</button>
  <button name="subject" type="submit" value="CSS">CSS</button>
</form>
TIY
语法
<button value="value">属性值
值 描述 
value 规定要发送的值。 
■◆978■下拉列表            简化命令：下拉表■下拉表■HTML <select> 标签
定义和用法
select 元素可创建单选或多选菜单。

当提交表单时，浏览器会提交选定的项目，或者收集用逗号分隔的多个选项，将其合成一个单独的参数列表，并且在将 <select> 表单数据提交给服务器时包括 name 属性。
■◆1775■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1775■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1775■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1775■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1775■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1775■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1775■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1775■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1775■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1775■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1775■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1775■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1775■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1775■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1775■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1775■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1775■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1775■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1775■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1775■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1775■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1775■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1775■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1775■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1775■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1775■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1775■禁用                简化命令：禁用■禁用■HTML <select> 标签的 disabled 属性
HTML <select> 标签
定义和用法
disabled 属性规定禁用下拉列表。被禁用的下拉列表既不可用，也不可点击。

可以设置 disabled 属性，直到满足某些条件（比如选择一个复选框），才恢复用户对该下拉列表的使用。然后，可以使用 JavaScript 来清除 disabled 属性，以使下拉列表变为可用状态。
实例
一个被禁用的下拉列表：

<select disabled="disabled">
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
TIY
浏览器支持
所有浏览器都支持 disabled 属性。
语法
<select disabled="value">属性值
值 描述 
disabled 规定应该禁用该下拉列表。 
■◆1775■可同时选择多个      简化命令：多选■多选■HTML <select> 标签的 multiple 属性
HTML <select> 标签
定义和用法
multiple 属性规定可同时选择多个选项。

在不同操作系统中，选择多个选项的差异：

?对于 windows：按住 Ctrl 按钮来选择多个选项
?对于 Mac：按住 command 按钮来选择多个选项
由于上述差异的存在，同时由于需要告知用户可以使用多项选择，对用户更友好的方式是使用复选框。

提示：可以把 multiple 属性与 size 属性配合使用，来定义可见选项的数目。
实例
允许在下拉列表中进行多选：

<select multiple="multiple" size="2">
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
TIY
浏览器支持
所有浏览器都支持 multiple 属性。
语法
<select multiple="value">属性值
值 描述 
multiple 规定可同时选择多个选项。 
■◆1775■名称                简化命令：名■名■HTML <select> 标签的 name 属性
HTML <select> 标签
定义和用法
name 属性规定 select 元素的名称。

name 属性用于对提交到服务器后的表单数据进行标识，或者在客户端通过 JavaScript 引用表单数据。
实例
带有 name 属性的下拉列表：

<select name="carlist">
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
TIY
浏览器支持
所有浏览器都支持 name 属性。
语法
<select name="value">属性值
值 描述 
name 下拉列表的名称。 
■◆1775■可见选项的数目      简化命令：尺寸■尺寸■HTML <select> 标签的 size 属性
HTML <select> 标签
定义和用法
size 属性规定下拉列表中可见选项的数目。

如果 size 属性的值大于 1，但是小于列表中选项的总数目，浏览器会显示出滚动条，表示可以查看更多选项。
实例
在下拉列表中 size 属性显示两个选项：

<select size="2">
  <option value ="volvo">Volvo</option>
  <option value ="saab">Saab</option>
  <option value="opel">Opel</option>
  <option value="audi">Audi</option>
</select>
TIY
浏览器支持
所有浏览器都支持 size 属性。
语法
<select size="value">属性值
值 描述 
number 下拉列表中可见选项的数目。 
■◆978■选择列表中相关选项  简化命令：相关■相关■HTML <optgroup> 标签
定义和用法
<optgroup> 标签定义选项组。

optgroup 元素用于组合选项。当您使用一个长的选项列表时，对相关的选项进行组合会使处理更加容易。
■◆1806■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1806■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1806■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1806■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1806■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1806■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1806■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1806■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1806■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1806■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1806■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1806■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1806■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1806■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1806■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1806■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1806■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1806■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1806■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1806■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1806■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1806■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1806■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1806■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1806■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1806■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1806■选项组规定描述      简化命令：标注■标注■HTML <optgroup> 标签的 label 属性
HTML <optgroup> 标签
定义和用法
label 属性为选项组规定描述。
实例
通过 <optgroup> 标签把相关的选项组合在一起：

<select>
  <optgroup label="Swedish Cars">
    <option value ="volvo">Volvo</option>
    <option value ="saab">Saab</option>
  </optgroup>

  <optgroup label="German Cars">
    <option value ="mercedes">Mercedes</option>
    <option value ="audi">Audi</option>
  </optgroup>
</select>
TIY
浏览器支持
所有主流浏览器都支持 label 属性。
语法
<optgroup label="value">属性值
值 描述 
text 有关被包含选项的描述内容。 
■◆1806■禁用                简化命令：禁用■禁用■HTML <optgroup> 标签的 disabled 属性
HTML <optgroup> 标签
定义和用法
disabled 属性规定禁用该选项组。被禁用的选项组既不可用，也不可点击。

可以设置 disabled 属性，直到满足某些条件（比如选择一个复选框），才恢复用户对该选项组的使用。然后，可以使用 JavaScript 来清除 disabled 属性，以使选项组变为可用状态。
实例
一个禁用的选项组：

<select>
  <optgroup label="German Cars" disabled="disabled">
    <option value="mercedes">Mercedes</option>
    <option value="audi">Audi</option>
  </optgroup>
</select>
TIY
浏览器支持
除了 Internet Explorer，所有主流浏览器都支持 label 属性。

注释：Safari 2.0 或更早的版本不支持该属性。IE 8 或更新的版本支持该属性。
语法
<optgroup disabled="value">属性值
值 描述 
disabled 禁用选项组。 
■◆978■选择列表中选项      简化命令：选项■选项■HTML <option> 标签
定义和用法
option 元素定义下拉列表中的一个选项（一个条目）。

浏览器将 <option> 标签中的内容作为 <select> 标签的菜单或是滚动列表中的一个元素显示。

option 元素位于 select 元素内部。
■◆1835■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1835■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1835■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1835■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1835■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1835■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1835■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1835■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1835■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1835■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1835■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1835■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1835■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1835■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1835■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1835■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1835■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1835■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1835■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1835■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1835■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1835■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1835■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1835■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1835■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1835■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1835■禁用                简化命令：禁用■禁用■HTML <option> 标签的 disabled 属性
HTML <option> 标签
定义和用法
disabled 属性规定某个选项应该被禁用。被禁用的选项既不可用，也不可点击。

可以设置 disabled 属性，直到满足某些条件（比如选择一个复选框），才恢复用户对该选项的使用。然后，可以使用 JavaScript 来清除 disabled 属性，以使选项变为可用状态。
实例
带有 4 个选项的下拉列表，一个选项已被禁用：

<select>
  <option>Volvo</option>
  <option>Saab</option>
  <option disabled="disabled">Opel</option>
  <option>Audi</option>
</select>
TIY
浏览器支持
除了 Internet Explorer，所有浏览器都支持 disabled 属性。

注释：Safari 2.0 或更早的版本不支持该属性。IE 8 或更新的版本支持该属性。
语法
<option disabled="value">属性值
值 描述 
disabled 规定应该禁用选项。 
■◆1835■更短版本            简化命令：标注■标注■HTML <option> 标签的 label 属性
HTML <option> 标签
定义和用法
label 属性规定更短版本的选项。

下拉列表中会显示出所规定的更短版本。
实例
在 option 元素中使用 label 属性：

<select>
  <option label="Volvo">Volvo (Latin for "I roll")</option>
  <option label="Saab">Saab (Swedish Aeroplane AB)</option>
</select>
TIY
浏览器支持
只有 IE 7+ 支持 label 属性。
语法
<option label="value">属性值
值 描述 
text 选项的更短的版本。 
■◆1835■选中状态            简化命令：选中■选中■HTML <option> 标签的 selected 属性
HTML <option> 标签
定义和用法
selected 属性规定在页面加载时预先选定该选项。

被预选的选项会显示在下拉列表最前面的位置。

也可以在页面加载后通过 JavaScript 设置 selected 属性。
实例
带有预先选定的选项的下拉列表：

<select>
  <option>Volvo</option>
  <option selected="selected">Saab</option>
  <option>Mercedes</option>
  <option>Audi</option>
</select>
TIY
浏览器支持
所有浏览器都支持 selected 属性。
语法
<option selected="value">属性值
值 描述 
selected 预先选择一个选项。 
■◆1835■被发送到服务器的值  简化命令：值■值■HTML <option> 标签的 value 属性
HTML <option> 标签
定义和用法
value 属性规定在表单被提交时被发送到服务器的值。

<option> 与 <option/> 之间的值是浏览器显示在下拉列表中的内容，而 value 属性中的值是表单被提交时被发送到服务器的值。

注释：如果没有指定 value 属性，选项的值将设置为 <option> 标签中的内容。
实例
带有发送到服务器的值的下拉列表：

<select>
  <option value="volvo">Volvo XC90</option>
  <option value="saab">Saab 95</option>
  <option value="mercedes">Mercedes SLK</option>
  <option value="audi">Audi TT</option>
</select>
TIY
浏览器支持
所有浏览器都支持 value 属性。
语法
<option value="value">属性值
值 描述 
value 发送到服务器的值。 
■◆978■input 元素标注      简化命令：标注■标注■HTML <label> 标签
定义和用法
<label> 标签为 input 元素定义标注（标记）。

label 元素不会向用户呈现任何特殊效果。不过，它为鼠标用户改进了可用性。如果您在 label 元素内点击文本，就会触发此控件。就是说，当用户选择该标签时，浏览器就会自动将焦点转到和标签相关的表单控件上。

<label> 标签的 for 属性应当与相关元素的 id 属性相同。
■◆1866■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1866■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1866■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1866■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1866■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1866■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1866■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1866■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1866■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1866■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1866■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1866■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1866■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1866■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1866■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1866■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1866■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1866■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1866■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1866■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1866■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1866■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1866■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1866■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1866■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1866■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1866■表单元素绑定        简化命令：绑定■绑定■HTML <label> 标签的 for 属性
HTML <label> 标签
定义和用法
for 属性规定 label 与哪个表单元素绑定。

隐式和显式的联系
标记通常以下面两种方式中的一种来和表单控件相联系：将表单控件作为标记标签的内容，这样的就是隐式形式，或者为 <label> 标签下的 for 属性命名一个目标表单 id，这样就是显式形式。

例如，在 XHTML 中：

显式的联系：
<label for="SSN">Social Security Number:</label>
<input type="text" name="SocSecNum" id="SSn" />

隐式的联系：
<label>Date of Birth: <input type="text" name="DofB" /></label>
第一个标记是以显式形式将文本 "Social Security Number:" 和表单的社会安全号码的文本输入控件 ("SocSecNum") 联系起来，它的 for 属性的值和控件的 id 一样，都是 SSN。第二个标记 ("Date of Birth:") 不需要 for 属性，它的相关控件也不需要 id 属性，它们是通过在 <label> 标签中放入 <input> 标签来隐式地连接起来的。
实例
带有两个输入字段和相关标记的简单 HTML 表单：

<form>
  <label for="male">Male</label>
  <input type="radio" name="sex" id="male" />
  <br />
  <label for="female">Female</label>
  <input type="radio" name="sex" id="female" />
</form>
TIY
浏览器支持
所有主流浏览器都支持 for 属性。

Safari 2 或更早的版本不支持 for 属性。
语法
<label for="value">属性值
值 描述 
element_id label 要绑定的元素的 id。 
■◆978■表单元素边框        简化命令：分组框■分组框■HTML <fieldset> 标签
定义和用法
fieldset 元素可将表单内的相关元素分组。

<fieldset> 标签将表单内容的一部分打包，生成一组相关表单的字段。

当一组表单元素放到 <fieldset> 标签内时，浏览器会以特殊方式来显示它们，它们可能有特殊的边界、3D 效果，或者甚至可创建一个子表单来处理这些元素。

<fieldset> 标签没有必需的或唯一的属性。

■◆978■fieldset 元素标题   简化命令：分组标题■分组标题■HTML <legend> 标签
定义和用法
legend 元素为 fieldset 元素定义标题（caption）。
■◆1895■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1895■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1895■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1895■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1895■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1895■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1895■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1895■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1895■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1895■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1895■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1895■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1895■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1895■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1895■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1895■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1895■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1895■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1895■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1895■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1895■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1895■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1895■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1895■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1895■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1895■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1895■对齐方式            简化命令：横对齐■横对齐■HTML <legend> 标签的 align 属性
HTML <legend> 标签
定义和用法
align 属性规定 fieldset 中标题的对齐方式。
实例
组合表单中的相关元素：

<form>
  <fieldset>
    <legend align="right">health information</legend>
    height: <input type="text" />
    weight: <input type="text" />
  </fieldset>
</form>
TIY
浏览器支持
所有浏览器都支持 align 属性的 "left" 和 "right" 值，除了 opera。"bottom" 值在所有浏览器中都不起作用。
兼容性注释
在 HTML 4 中，不赞成使用 align 属性；在 XHTML Strict DTD 中，不支持该属性。
语法
<legend align="value">属性值
值 描述 
left 对标题进行左对齐。 
right 对标题进行右对齐。 
top 对标题进行上对齐。 
bottom 对标题进行下对齐。 
■◆978■与文档相关的可搜索索引简化命令：相关索引■相关索引■不赞成使用。定义与文档相关的可搜索索引。■◆978■无序列表            简化命令：无序列表■无序列表■HTML <ul> 标签
定义和用法
<ul> 标签定义无序列表。
■◆1924■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1924■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1924■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1924■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1924■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1924■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1924■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1924■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1924■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1924■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1924■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1924■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1924■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1924■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1924■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1924■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1924■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1924■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1924■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1924■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1924■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1924■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1924■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1924■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1924■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1924■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1924■紧凑小巧            简化命令：紧凑■紧凑■HTML <ul> 标签的 compact 属性
HTML <ul> 标签
定义和用法
compact 属性规定列表呈现的效果比正常情况更小巧，这是通过减少行间距以及对列表进行缩进来实现的。
实例
在无序列表中使用 compact 属性：

<ul compact="compact">
   <li>HTML</li>
   <li>XHTML</li>
   <li>CSS</li>
</ul>
TIY
浏览器支持
任何主流浏览器都不支持 compact 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 ul 元素的 compact 属性；在 XHTML 1.0 Strict DTD 中，不支持 ul 元素的 compact 属性。

请使用 CSS 代替。

CSS 语法：<ul style="line-height: 80%">

CSS 实例：缩小列表中的行高

在我们的 CSS 教程中，您可以找到更多有关 line-height 属性 的细节。
语法
<ul compact="value">属性值
值 描述 
compact 规定列表呈现更紧凑小巧的效果。 
■◆1924■项目符号            简化命令：类型■类型■HTML <ul> 标签的 type 属性
HTML <ul> 标签
定义和用法
type 属性规定列表的项目符号的类型。
实例
在无序列表中使用 type 属性：

<ul type="square">
   <li>HTML</li>
   <li>XHTML</li>
   <li>CSS</li>
</ul>
TIY
浏览器支持
尽管不赞成使用 type 属性，不过所有浏览器都支持 type 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 ul 元素的 type 属性；在 XHTML 1.0 Strict DTD 中，不支持 ul 元素的 type 属性。

请使用 CSS 代替。

CSS 语法：<ul style="list-style-type:square">

CSS 实例：列表样式类型

在我们的 CSS 教程中，您可以找到更多有关 list-style-type 属性 的细节。
语法
<ul type="value">属性值
值 描述 
disc 默认值。实心圆。 
circle 空心圆。 
square 实心方块。 
■◆978■有序列表            简化命令：有序列表■有序列表■HTML <ol> 标签
定义和用法
<ol> 标签定义有序列表。
■◆1953■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1953■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1953■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1953■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1953■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1953■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1953■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1953■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1953■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1953■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1953■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1953■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1953■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1953■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1953■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1953■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1953■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1953■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1953■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1953■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1953■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1953■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1953■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1953■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1953■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1953■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1953■紧凑小巧            简化命令：紧凑■紧凑■HTML <ol> 标签的 compact 属性
HTML <ol> 标签
定义和用法
compact 属性规定列表呈现的效果比正常情况更小巧，这是通过减少行间距以及对列表进行缩进来实现的。
实例
在有序列表中使用 compact 属性：

<ol compact="compact">
   <li>HTML</li>
   <li>XHTML</li>
   <li>CSS</li>
</ol>
TIY
浏览器支持
任何主流浏览器都不支持 compact 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 ol 元素的 compact 属性；在 XHTML 1.0 Strict DTD 中，不支持 ol 元素的 compact 属性。

请使用 CSS 代替。

CSS 语法：<ol style="line-height: 80%">

CSS 实例：缩小列表中的行高

在我们的 CSS 教程中，您可以找到更多有关 line-height 属性 的细节。
语法
<ol compact="value">属性值
值 描述 
compact 规定列表呈现更紧凑小巧的效果。 
■◆1953■开始点              简化命令：开始■开始■HTML <ol> 标签的 start 属性
HTML <ol> 标签
定义和用法
start 属性规定有序列表的开始点。
实例
在有序列表中使用 start 属性：

<ol start="5">
   <li>HTML</li>
   <li>XHTML</li>
   <li>CSS</li>
</ol>
TIY
浏览器支持
尽管不赞成使用 start 属性，不过所有浏览器都支持 start 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 ol 元素的 start 属性；在 XHTML 1.0 Strict DTD 中，不支持 ol 元素的 start 属性。

注释：目前，仍然没有 start 属性的 CSS 替代方案。
语法
<ol start="value">属性值
值 描述 
number 数字。有序列表的开始点。 
■◆1953■符号的类型          简化命令：类型■类型■HTML <ol> 标签的 type 属性
HTML <ol> 标签
定义和用法
type 属性规定有序列表的项目符号的类型。
实例
在有序列表中使用 type 属性：

<ol type="I">
   <li>HTML</li>
   <li>XHTML</li>
   <li>CSS</li>
</ol>
TIY
浏览器支持
尽管不赞成使用 type 属性，不过所有浏览器都支持 type 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 ol 元素的 type 属性；在 XHTML 1.0 Strict DTD 中，不支持 ol 元素的 type 属性。

请使用 CSS 代替。

CSS 语法：<ol style="list-style-type:upper-roman">

CSS 实例：列表样式类型

在我们的 CSS 教程中，您可以找到更多有关 list-style-type 属性 的细节。
语法
<ol type="value">属性值
值 描述 
1 默认值。数字有序列表。（1、2、3、4） 
a 按字母顺序排列的有序列表，小写。（a、b、c、d） 
A 按字母顺序排列的有序列表，大写。（A、B、C、D） 
i 罗马字母，小写。（i, ii, iii, iv） 
I 罗马字母，大写。（I, II, III, IV） 
■◆978■列表项目            简化命令：列表项目■列表项目■HTML <li> 标签
定义和用法
<li> 标签定义列表项目。

<li> 标签可用在有序列表 (<ol>) 和无序列表 (<ul>) 中。
■◆1983■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆1983■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆1983■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆1983■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆1983■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆1983■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆1983■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆1983■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆1983■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆1983■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆1983■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆1983■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆1983■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆1983■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆1983■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆1983■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆1983■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆1983■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆1983■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆1983■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆1983■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆1983■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆1983■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆1983■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆1983■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆1983■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆1983■符号的类型          简化命令：类型■类型■HTML <li> 标签的 type 属性
HTML <ul> 标签
定义和用法
type 属性规定列表中的列表项目的项目符号的类型。
实例
在无序和有序的 HTML 列表中使用 type 属性：

<ol>
  <li>Coffee</li>
  <li type="a">Tea</li>
  <li>Milk</li>
</ol>

<ul>
  <li>Coffee</li>
  <li type="square">Tea</li>
  <li>Milk</li>
</ul>
TIY
浏览器支持
尽管不赞成使用 type 属性，不过所有浏览器都支持 type 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 li 元素的 type 属性；在 XHTML 1.0 Strict DTD 中，不支持 li 元素的 type 属性。

请使用 CSS 代替。

CSS 语法：<li style="list-style-type:square">

CSS 实例：列表样式类型

在我们的 CSS 教程中，您可以找到更多有关 list-style-type 属性 的细节。
语法
<li type="value">属性值
有序列表的属性值：

值 描述 
1 数字顺序的有序列表（默认值）（1, 2, 3, 4）。 
a 字母顺序的有序列表，小写（a, b, c, d）。 
A 字母顺序的有序列表，大写（a, b, c, d）。 
i 罗马数字，小写（i, ii, iii, iv）。 
I 罗马数字，大写（i, ii, iii, iv）。 

无序列表的属性值：

值 描述 
disc 默认值。实心圆。 
circle 空心圆。 
square 实心方块。 
■◆1983■列表项目数字        简化命令：值■值■HTML <li> 标签的 value 属性
HTML <ul> 标签
定义和用法
value 属性规定规定列表项目的数字。接下来的列表项目会从该数字开始进行升序排列。
实例
在有序的 HTML 列表中使用 value 属性：

<ol>
  <li>Coffee</li>
  <li>Tea</li>
  <li>Milk</li>
  <li value="100">Water</li>
  <li>Juice</li>
  <li>Beer</li>
</ol>
TIY
浏览器支持
尽管不赞成使用 value 属性，不过所有浏览器都支持 value 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 li 元素的 value 属性；在 XHTML 1.0 Strict DTD 中，不支持 li 元素的 value 属性。

注释：目前，还没有可替代 value 属性的 CSS 解决方案。
语法
<li value="number">属性值
值 描述 
number 当前列表项目的数字（序号）。 
HTML <ul> 标签
■◆978■目录列表            简化命令：目录列表■目录列表■HTML <dir> 标签
不赞成使用 dir 元素！
定义和用法
<dir> 标签定义目录列表。
■◆2012■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2012■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2012■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2012■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2012■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2012■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2012■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2012■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2012■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2012■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2012■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2012■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2012■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2012■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2012■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2012■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2012■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2012■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2012■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2012■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2012■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2012■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2012■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2012■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2012■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2012■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2012■紧凑小巧            简化命令：紧凑■紧凑■HTML <dir> 标签的 compact 属性
HTML <dir> 标签
定义和用法
compact 属性规定列表呈现的效果比正常情况更小巧，这是通过减少行间距以及对列表进行缩进来实现的。
实例
在目录列表中使用 compact 属性：

<dir compact="compact">
   <li>HTML</li>
   <li>XHTML</li>
   <li>CSS</li>
</dir>
TIY
浏览器支持
任何主流浏览器都不支持 compact 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 dir 元素的 compact 属性；在 XHTML 1.0 Strict DTD 中，不支持 dir 元素的 compact 属性。

请使用 CSS 代替。

CSS 语法：<dir style="line-height: 80%">

CSS 实例：缩小列表中的行高

在我们的 CSS 教程中，您可以找到更多有关 line-height 属性的细节。
语法
<dir compact="value">属性值
值 描述 
compact 规定列表呈现更紧凑小巧的效果。 
■◆978■定义列表            简化命令：定义列表■定义列表■HTML <dl> 标签
定义和用法
<dl> 标签定义了定义列表（definition list）。

<dl> 标签用于结合 <dt> （定义列表中的项目）和 <dd> （描述列表中的项目）。
■◆978■定义列表中项目      简化命令：定义项目■定义项目■HTML <dt> 标签
定义和用法
<dt> 标签定义了定义列表中的项目（即术语部分）。
■◆978■定义列表中项目描述  简化命令：定义描述■定义描述■HTML <dd> 标签
定义和用法
<dd> 在定义列表中定义条目的定义部分。
■◆978■菜单列表            简化命令：菜单■菜单■HTML <menu> 标签
定义和用法
<menu> 标签可定义一个菜单列表。
HTML 与 XHTML 之间的差异
在 HTML 4.01 中，menu 元素不被赞成使用。

在 XHTML 1.0 Strict DTD 中，menu 元素不被支持。
■◆2043■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2043■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2043■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2043■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2043■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2043■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2043■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2043■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2043■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2043■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2043■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2043■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2043■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2043■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2043■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2043■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2043■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2043■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2043■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2043■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2043■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2043■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2043■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2043■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2043■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2043■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2043■Deprecated. Use styles instead简化命令：紧凑■紧凑■DTD 指示此属性允许在哪种 DTD 中使用。S=Strict, T=Transitional, F=Frameset.

属性 值 描述 DTD 
compact compact_rendering Deprecated. Use styles instead TF 
■◆978■图像                简化命令：图■图■HTML <img> 标签
定义和用法
img 元素向网页中嵌入一幅图像。

请注意，从技术上讲，<img> 标签并不会在网页中插入图像，而是从网页上链接图像。<img> 标签创建的是被引用图像的占位空间。

<img> 标签有两个必需的属性：src 属性 和 alt 属性。

■◆2071■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2071■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2071■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2071■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2071■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2071■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2071■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2071■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2071■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2071■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2071■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2071■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2071■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2071■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2071■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2071■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2071■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2071■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2071■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2071■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2071■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2071■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2071■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2071■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2071■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2071■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2071■替代文本            简化命令：替文■替文■HTML <img> 标签的 alt 属性
HTML <img> 标签
定义和用法
alt 属性是一个必需的属性，它规定在图像无法显示时的替代文本。

假设由于下列原因用户无法查看图像，alt 属性可以为图像提供替代的信息：

?网速太慢
?src 属性中的错误
?浏览器禁用图像
?用户使用的是屏幕阅读器
<img> 标签的 alt 属性指定了替代文本，用于在图像无法显示或者用户禁用图像显示时，代替图像显示在浏览器中的内容。

我们强烈推荐您在文档的每个图像中都使用这个属性。这样即使图像无法显示，用户还是可以看到关于丢失了什么东西的一些信息。而且对于残疾人来说，alt 属性通常是他们了解图像内容的唯一方式。
实例
<img src="/i/eg_tulip.jpg"  alt="上海鲜花港 - 郁金香" />亲自试一试

如果无法显示图像，浏览器将显示替代文本，就像这样：

 
此外，当用户把鼠标移到图像上方，最新的浏览器会在一个文本框中显示描述性文本。下面的代码在 alt 属性中为图像添加了描述性文本：

您可以把鼠标移动到下面的照片上，看看相应的效果：

 
红圈中的文本框是用户把鼠标移动到图像上时，IE7 浏览器所显示的效果：

 提示和注释：
注释：alt 属性的值是一个最多可以包含 1024 个字符的字符串，其中包括空格和标点。这个字符串必须包含在引号中。这段 alt 文本中可以包含对特殊字符的实体引用，但它不允许包含其他类别的标记，尤其是不允许有任何样式标签。

注释：当用户把鼠标移动到 img 元素上时，Internet Explorer 会显示出 alt 属性的值。这种行为并不正确。所有其他的浏览器正在向规范靠拢，只要当图像无法显示时，才会显示出替代文本。

提示：如果需要为图像创建工具提示，请使用 title 属性。
语法
<a alt="value">属性值
值 描述 
text 规定图像的替代文本

alt 文本的使用原则：

?如果图像包含信息 - 使用 alt 描述图像
?如果图像在 a 元素中 - 使用 alt 描述目标链接
?如果图像仅供装饰 - 使用 alt=""
 
■◆2071■图像文件URL         简化命令：路径■路径■HTML <img> 标签的 src 属性
HTML <img> 标签
定义和用法
<img> 标签的 src 属性是必需的。它的值是图像文件的 URL，也就是引用该图像的文件的的绝对路径或相对路径。

提示：为了整理文档的存储，创作者通常会把图像文件存放在一个单独的文件夹中，而且通常会将这些目录命名为 "pics" 或者 "images" 之类的名称。在 W3School 在线教程中，我们的工程师把大部分常用的图像都存放到一个名为 "i" 的文件夹中，"i"是 "images" 的缩写，这样做的好处是可以最大程度地简化路径。
实例
在下面的例子中，我们在页面中插入一幅 W3School 的工程师在上海鲜花港拍摄的郁金香照片，该照片文件的名称是 "eg_tulip.jpg"，存放在服务器上的 "i" 文件夹中。这是源代码：

<img src="/i/eg_tulip.jpg" />以上代码的效果：

 
提示：您可以在我们的在线测试工具中亲自试一试，如果您把例子中的文件名更改为"eg_chinarose.jpg"，会看到一幅月季花的照片。就像这样：

源代码：

<img src="/i/eg_chinarose.jpg" />以上代码的效果：

 语法
<a src="value">属性值
值 描述 
URL 规定图像的 URL。

可能的值：

?绝对 URL - 指向其他站点（比如 src="http://www.example.com/"）
?相对 URL - 指向站点内的文件（比如 src="/i/image.gif"）
 
■◆2071■对齐方式            简化命令：横对齐■横对齐■HTML <img> 标签的 align 属性
HTML <img> 标签
定义和用法
<img> 标签的 align 属性定义了图像相对于周围元素的水平和垂直对齐方式。

详细说明
标准没有定义图像相对于其他文字和与其处于同一行中的其他图像的对齐关系。HTML 图像在行中出现时通常只伴有一行文字。而通常的印刷媒体，像杂志，则把文字在图像的周围进行环绕，这样就会有很多行文字与图像相邻，而不只是一行。

幸运的是，文档设计者可以通过 <img> 标签的 align 属性来控制带有文字包围的图像的对齐方式。HTML 和 XHTML 标准指定了 5 种图像对齐属性值：left、right、top 、middle 和 bottom。left 和 right 值会把图像周围与其相连的文本转移到相应的边界中；其余的三个值将图像与其相邻的文字在垂直方向上对齐。Netscape 又增加了 4 种垂直对齐属性：texttop、absmiddle、baseline 和 absbottom，Internet Explorer 则增加了 center。

注意：不同的浏览器以及同一浏览器的不同版本对 align 属性的某些值的处理方式是不同的。

注意：HTML 4.01 不推荐使用 align 属性，XHTML 1.0 Strict DTD 不支持该属性，同时 HTML 5 也不再支持该属性。
实例
设置文本中的图像的对齐方式：

<img src="/i/eg_cute.gif" align="middle" />亲自试一试
浏览器支持
虽然不赞成使用 align，但是几乎所有浏览器都支持该属性。
兼容性注释
不赞成使用 align 属性和 <center> 标签
HTML 4 和 XHTML 中不再推荐使用所有标准中的 align 属性，当然包括 <img> 的 align 属性，以便使用样式表。同时不再使用 <center> 标签。

然而，该属性及标签在 HTML 创作者中非常流行，并且现在流行的浏览器都能很好地支持它们。所以，虽然我们期望 align 和 <center> 将来有一天会消失，但还需要等待很长一段时间。

解决方案
如果您不想使用 align 和 <center> 时该怎么办呢？您可以使用 HTML/XHTML 表格来对齐内容。不过更好的方案是使用样式。例如，margin-left 属性 可以对图像进行缩进，而 float 属性 可以实现文本包围图像的效果。

实例
<img style="float:right" />亲自试一试
语法
<img align="value" />属性值
值 描述 
left 把图像对齐到左边 
right 把图像对齐到右边 
middle 把图像与中央对齐 
top 把图像与顶部对齐 
bottom 把图像与底部对齐 
■◆2071■边框                简化命令：边框■边框■HTML <img> 标签的 border 属性
HTML <img> 标签
定义和用法
<img> 标签的 border 属性规定图像周围的边框的宽度，就是说可以增加或去掉图像的边框。

注释：默认地，图像是没有边框的（除非图像在 a 元素内部）。

浏览器通常会把代表超链接的图像（例如包含在 <a> 标签中的图像）显示在两个像素宽的边框里面，以表示读者可以通过选择这个图像来访问相关联的文档。

使用 border 属性和一个用像素表示的宽度值就可以去掉 (border="0") 或加宽图像的边框。

注意：该属性在 HTML 4 和 XHTML 中也不再被推荐使用了，同样是应该被样式所代替，但却依然被流行浏览器很好地支持着。

延伸阅读：去掉图像的边框
实例
下面的 HTML 可以产生不同粗细的图像边框：

<html>

<body>
<a href="/index.html">
<img src="/i/eg_logo_w3school.gif" border="1" />
</a>

<br />

<a href="/index.html">
<img src="/i/eg_logo_w3school.gif" border="2" />
</a>

<br />

<a href="/index.html">
<img src="/i/eg_logo_w3school.gif" border="4" />
</a>

<br />

<a href="/index.html">
<img src="/i/eg_logo_w3school.gif" border="8" />
</a>
</body>

</html>
亲自试一试
浏览器支持
尽管不推荐使用 border 属性，但是所有主流浏览器均支持该属性。
提示和注释
注释：HTML 4.01 不推荐使用图像的 "border" 属性。在 XHTML 1.0 Strict DTD 和 HTML 5 中，不再支持该属性。

提示：请使用 CSS 的边框属性 来改变元素的边框样式。您可以在一个外部样式表中使用 CSS 边框属性，为站点上的所有图像设置一致的边框。与单独为一个图像设置 border 属性相比，这种方式无疑拥有更高的效率。
兼容性注释
不推荐使用 img 元素的 border 属性；在 HTML 4.01 Strict 以及 XHTML 1.0 Strict DTD 中，不支持 img 元素的 border 属性。

请使用 CSS 代替。

CSS 语法：<img style="border:5px solid black">

CSS 实例：图像边框

在我们的 CSS 教程中，您可以找到更多有关 border 属性 的细节。
语法
<img border="value" />属性值
值 描述 
pixels 边框的宽度，以像素为单位。 
■◆2071■高度                简化命令：高■高■HTML <img> 标签的 height 和 width 属性
HTML <img> 标签
定义和用法
<img> 标签的 height 和 width 属性设置图像的尺寸。

提示：为图像指定 height 和 width 属性是一个好习惯。如果设置了这些属性，就可以在页面加载时为图像预留空间。如果没有这些属性，浏览器就无法了解图像的尺寸，也就无法为图像保留合适的空间，因此当图像加载时，页面的布局就会发生变化。（下面的篇幅详细解释了这个观点）。

提示：请不要通过 height 和 width 属性来缩放图像。如果通过 height 和 width 属性来缩小图像，那么用户就必须下载大容量的图像（即使图像在页面上看上去很小）。正确的做法是，在网页上使用图像之前，应该通过软件把图像处理为合适的尺寸。

延伸阅读：详解 height 和 width 属性
实例
将图像宽度和高度分别设置为 200 像素：

<img src="/i/mouse.jpg" height="200" width="200" />亲自试一试
更多实例
改变图像大小 - 制作填充图像
height 和 width 属性有一种隐藏的特性，就是人们无需指定图像的实际大小，也就是说，这两个值可以比实际的尺寸大一些或小一些。浏览器会自动调整图像，使其适应这个预留空间的大小。使用这种方法就可以很容易地为大图像创建其缩略图，以及放大很小的图像。但需要注意的是：浏览器还是必须要下载整个文件，不管它最终显示的尺寸到底是多大，而且，如果没有保持其原来的宽度和高度比例，图像会发生扭曲。

使用 height 和 width 属性的另外一种技巧，是可以非常容易地实现对页面区域的填充，同时还可以改善文档的性能。设想一下，如果你想在文档中放置一个彩色的横条。您不需要创建一个具有完整尺寸的图像，相反，您只要创建一个宽度和高度都为 1 个像素的图像，并把自己希望使用的颜色赋给它。然后使用 height 和 width 属性把它扩展到更大的尺寸。

<img src="/i/ct_1px.gif" width="200px" height="30px" />这是上面这段 HTML 的效果，这个颜色彩条是用只有一个像素的图像制成的：

 
使用百分比值
使用 width 属性的最后一个技巧是使用百分比值来代替像素的绝对值。这将使浏览器按照与浏览器显示窗口的一定比例来缩放图像。因此，如果要创建一个宽度与显示窗口宽度相同，高度为 30 个像素的彩色横条，可以这样实现：

<img src="/i/ct_1px.gif" width="60%" height="30px" />当文档窗口的大小改变时，这个图像的大小也会随之改变：

 
提示：如果提供了一个百分比形式的 width 值而忽略了 height，那么不管是放大还是缩小，浏览器都将保持图像的宽高比例。这意味着图像的高度与宽度之比将不会发生变化，图像也就不会发生扭曲。

请看下面的 HTML：

<img src="/i/ct_1px.gif" width="20%" />也就是说，如果只设置图像 ct_1px.gif 的 width 属性的百分比值，会得到一个矩形图像（这是因为原始的 ct_1px.gif 就是一个只有 1px 宽和高的矩形）：

 
提示：您可以在我们的在线测试工具中亲自试一试！

提示：我们提供以上例子的目的是为了使您更好地理解 height 和 width 属性的用法。如果您只是需要大面积的纯色块来装饰页面，那么更好的办法是使用 CSS 来创建背景色。
浏览器支持
所有浏览器均支持 height 和 width 属性。
语法
<img height="value" />或者：

<img width="value" />属性值
值 描述 
pixels 以像素为单位的高度或宽度值。 
percent 以包含元素的百分比计的高度或宽度值。 
■◆2071■宽度                简化命令：宽■宽■HTML <img> 标签的 height 和 width 属性
HTML <img> 标签
定义和用法
<img> 标签的 height 和 width 属性设置图像的尺寸。

提示：为图像指定 height 和 width 属性是一个好习惯。如果设置了这些属性，就可以在页面加载时为图像预留空间。如果没有这些属性，浏览器就无法了解图像的尺寸，也就无法为图像保留合适的空间，因此当图像加载时，页面的布局就会发生变化。（下面的篇幅详细解释了这个观点）。

提示：请不要通过 height 和 width 属性来缩放图像。如果通过 height 和 width 属性来缩小图像，那么用户就必须下载大容量的图像（即使图像在页面上看上去很小）。正确的做法是，在网页上使用图像之前，应该通过软件把图像处理为合适的尺寸。

延伸阅读：详解 height 和 width 属性
实例
将图像宽度和高度分别设置为 200 像素：

<img src="/i/mouse.jpg" height="200" width="200" />亲自试一试
更多实例
改变图像大小 - 制作填充图像
height 和 width 属性有一种隐藏的特性，就是人们无需指定图像的实际大小，也就是说，这两个值可以比实际的尺寸大一些或小一些。浏览器会自动调整图像，使其适应这个预留空间的大小。使用这种方法就可以很容易地为大图像创建其缩略图，以及放大很小的图像。但需要注意的是：浏览器还是必须要下载整个文件，不管它最终显示的尺寸到底是多大，而且，如果没有保持其原来的宽度和高度比例，图像会发生扭曲。

使用 height 和 width 属性的另外一种技巧，是可以非常容易地实现对页面区域的填充，同时还可以改善文档的性能。设想一下，如果你想在文档中放置一个彩色的横条。您不需要创建一个具有完整尺寸的图像，相反，您只要创建一个宽度和高度都为 1 个像素的图像，并把自己希望使用的颜色赋给它。然后使用 height 和 width 属性把它扩展到更大的尺寸。

<img src="/i/ct_1px.gif" width="200px" height="30px" />这是上面这段 HTML 的效果，这个颜色彩条是用只有一个像素的图像制成的：

 
使用百分比值
使用 width 属性的最后一个技巧是使用百分比值来代替像素的绝对值。这将使浏览器按照与浏览器显示窗口的一定比例来缩放图像。因此，如果要创建一个宽度与显示窗口宽度相同，高度为 30 个像素的彩色横条，可以这样实现：

<img src="/i/ct_1px.gif" width="60%" height="30px" />当文档窗口的大小改变时，这个图像的大小也会随之改变：

 
提示：如果提供了一个百分比形式的 width 值而忽略了 height，那么不管是放大还是缩小，浏览器都将保持图像的宽高比例。这意味着图像的高度与宽度之比将不会发生变化，图像也就不会发生扭曲。

请看下面的 HTML：

<img src="/i/ct_1px.gif" width="20%" />也就是说，如果只设置图像 ct_1px.gif 的 width 属性的百分比值，会得到一个矩形图像（这是因为原始的 ct_1px.gif 就是一个只有 1px 宽和高的矩形）：

 
提示：您可以在我们的在线测试工具中亲自试一试！

提示：我们提供以上例子的目的是为了使您更好地理解 height 和 width 属性的用法。如果您只是需要大面积的纯色块来装饰页面，那么更好的办法是使用 CSS 来创建背景色。
浏览器支持
所有浏览器均支持 height 和 width 属性。
语法
<img height="value" />或者：

<img width="value" />属性值
值 描述 
pixels 以像素为单位的高度或宽度值。 
percent 以包含元素的百分比计的高度或宽度值。 
■◆2071■周围的空间          简化命令：横空白■横空白■HTML <img> 标签的 hspace 和 vspace 属性
HTML <img> 标签
定义和用法
<img> 标签的 hspace 和 vspace 属性可以设置图像周围的空间。

详细说明
通常图形浏览器不会在图像和其周围的文字之间留出很多空间。除非创建一个透明的图像边框来扩大这些间距，否则图像与其周围文字之间默认的两个像素的距离，对于大多数设计者来说是太近了。如果把图像放在超链接中，特殊颜色的边框会把你费尽心思留出的所有间距都占据了，而且还会使人们注意到文字与图像是多么接近。

hspace 和 vspace 属性可以给图像一个自由呼吸的空间。通过 hspace，可以以像素为单位，指定图像左边和右边的文字与图像之间的间距；而 vspace 值则是上面的下面的文字与图像之间的距离的像素数。

我们确信您同意这一点，也就是在这些图像周围留出额外的空间，会使文本更容易阅读，而且页面整体上看上去会更引人入胜。
实例
设置文本中的图像的对齐方式：

<img src="w3school.gif" hspace="30" vspace="30" />亲自试一试
浏览器支持
虽然不赞成使用 align，但是几乎所有浏览器都支持该属性。
提示和注释
提示：您可以在外部样式表中使用 CSS 的外边距属性和内边距属性，为站点上的所有图像设置一致的边距。与单独为一个图像设置 hspace 和 vspace 属性相比，这种方式无疑拥有更高的效率。
兼容性注释
不推荐使用 img 元素的 hspace 和 vspace 属性；在 HTML 4.01 Strict 以及 XHTML 1.0 Strict DTD 中，不支持 img 元素的 hspace 和 vspace 属性。

请使用 CSS 代替。

CSS 语法：<img style="margin: 0px 50px">

CSS 实例：带有外边距的图像

在我们的 CSS 教程中，您可以找到更多有关 margin 属性 的细节。
语法
<img hspace="value" />或者：

<img vspace="value" />属性值
值 描述 
pixels 以像素为单位的图像周围的空白。 
■◆2071■上下的文字与图距离  简化命令：竖空白■竖空白■HTML <img> 标签的 hspace 和 vspace 属性
HTML <img> 标签
定义和用法
<img> 标签的 hspace 和 vspace 属性可以设置图像周围的空间。

详细说明
通常图形浏览器不会在图像和其周围的文字之间留出很多空间。除非创建一个透明的图像边框来扩大这些间距，否则图像与其周围文字之间默认的两个像素的距离，对于大多数设计者来说是太近了。如果把图像放在超链接中，特殊颜色的边框会把你费尽心思留出的所有间距都占据了，而且还会使人们注意到文字与图像是多么接近。

hspace 和 vspace 属性可以给图像一个自由呼吸的空间。通过 hspace，可以以像素为单位，指定图像左边和右边的文字与图像之间的间距；而 vspace 值则是上面的下面的文字与图像之间的距离的像素数。

我们确信您同意这一点，也就是在这些图像周围留出额外的空间，会使文本更容易阅读，而且页面整体上看上去会更引人入胜。
实例
设置文本中的图像的对齐方式：

<img src="w3school.gif" hspace="30" vspace="30" />亲自试一试
浏览器支持
虽然不赞成使用 align，但是几乎所有浏览器都支持该属性。
提示和注释
提示：您可以在外部样式表中使用 CSS 的外边距属性和内边距属性，为站点上的所有图像设置一致的边距。与单独为一个图像设置 hspace 和 vspace 属性相比，这种方式无疑拥有更高的效率。
兼容性注释
不推荐使用 img 元素的 hspace 和 vspace 属性；在 HTML 4.01 Strict 以及 XHTML 1.0 Strict DTD 中，不支持 img 元素的 hspace 和 vspace 属性。

请使用 CSS 代替。

CSS 语法：<img style="margin: 0px 50px">

CSS 实例：带有外边距的图像

在我们的 CSS 教程中，您可以找到更多有关 margin 属性 的细节。
语法
<img hspace="value" />或者：

<img vspace="value" />属性值
值 描述 
pixels 以像素为单位的图像周围的空白。 
■◆2071■图像映射            简化命令：映射■映射■HTML <img> 标签的 ismap 属性
HTML <img> 标签
定义和用法
ismap 属性将图像定义为服务器端图像映射。

图像映射指的是带有可点击区域的图像。

当点击一个服务器端图像映射时，点击坐标会以 URL 查询字符串的形式发送到服务器。
实例
服务器端图像映射：

<a href="demo_form.asp">
<img src="tulip.gif" ismap="ismap" />
</a>
亲自试一试

解释
图像映射的 ismap 样式被称为 “服务器端”图像映射，它只可以用在 <a> 标签标识的超链接里面。

当用户在 ismap 图像上单击了某处时，浏览器会自动把鼠标的 x、y 位置（相对于图像的左上角）发送到服务器端。特殊的服务器端软件（在本例中是 demo_form.asp 程序）可以根据这些坐标来做出响应。
浏览器支持
所有浏览器都支持 ismap 属性。
语法
<img ismap="ismap">■◆2071■图像描述信息页      简化命令：描述页■描述页■HTML <img> 标签的 longdesc 属性
HTML <img> 标签
定义和用法
longdesc 属性规定指向图像描述信息页面的 URL。

详细信息
<img> 标签的 longdesc 属性与 alt 属性类似，但它允许更长的描述性文字。longdesc 的值是一个指向包含图像说明的文档的 URL。如果说明多于 1024 个字符，那么可以使用 longdesc 属性来设置指向它的链接。

不论是 HTML 还是 XHTML 都没有指定说明中必须是什么内容，而且目前浏览器都还没有支持 longdesc 属性。因此，对于如何创建那些大块的描述，我们的建议是创建一个超链接指向包含描述的页面即可。

alt 属性对于残疾人很有帮助，而出于显而易见的原因考虑，longdesc 属性似乎是更好的选项。
实例
使用 longdesc 属性，指向一个包含图像描述信息的页面：

<img src="eg_logo_w3school.gif" alt="W3School.com.cn" longdesc="w3s.txt" />亲自试一试
浏览器支持
没有浏览器支持 longdesc 属性。
语法
<img longdesc="URL">属性值
值 描述 
URL 指向图像描述页面的 URL。

可能的值：

?绝对 URL - 指向其他站点（比如 longdesc="example.com/description.txt"）
?相对 URL - 指向站点内的文件（比如 longdesc="description.txt"）
 
■◆2071■客户端图像映射      简化命令：客户映射■客户映射■HTML <img> 标签的 usemap 属性
HTML <img> 标签
定义和用法
usemap 属性将图像定义为客户端图像映射。

图像映射指的是带有可点击区域的图像。

usemap 属性与 map 元素的 name 属性相关联，它建立了图像与映射之间的关系。

延伸阅读：详解 usemap 属性
实例
客户器端图像映射：

<img src="planets.gif" alt="Planets" usemap="#planetmap" />

<map name="planetmap">
  <area href="sun.htm" shape="rect" coords="0,0,110,260">Sun</a>
  <area href="mercur.htm" shape="circle" coords="129,161,10">Mercury</a>
  <area href="venus.htm" shape="circle" coords="180,139,14">Venus</a>
</map>
亲自试一试

解释
上面这段源代码将一幅图像 planets.gif 映射为 3 个区域，当用户单击其中某一个区域时，将被链接到不同的文档中。

如需了解更多有关 map 和 area 元素的信息，请参阅：

?HTML <map> 标签
?HTML <area> 标签
浏览器支持
所有浏览器都支持 usemap 属性。
语法
<img usemap="value">属性值
值 描述 
#mapname # + 要使用的 map 元素名称 
■◆978■图像映射            简化命令：地图■地图■HTML <map> 标签
定义和用法
定义一个客户端图像映射。图像映射（image-map）指带有可点击区域的一幅图像。
■◆2109■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2109■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2109■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2109■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2109■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2109■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2109■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2109■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2109■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2109■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2109■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2109■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2109■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2109■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2109■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2109■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2109■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2109■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2109■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2109■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2109■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2109■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2109■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2109■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2109■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2109■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2109■名称                简化命令：名■名■名称■◆978■图像地图内部的区域  简化命令：区域■区域■HTML <area> 标签
定义和用法
<area> 标签定义图像映射中的区域（注：图像映射指得是带有可点击区域的图像）。

area 元素总是嵌套在 <map> 标签中。

注释：<img> 标签中的 usemap 属性与 map 元素 name 属性相关联，创建图像与映射之间的联系。
■◆2137■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2137■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2137■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2137■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2137■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2137■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2137■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2137■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2137■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2137■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2137■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2137■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2137■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2137■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2137■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2137■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2137■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2137■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2137■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2137■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2137■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2137■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2137■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2137■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2137■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2137■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2137■替代文本            简化命令：替文■替文■HTML <area> 标签的 alt 属性
HTML <area> 标签
定义和用法
alt 属性是一个必需的属性，它规定在图像无法显示时的替代文本。

假设由于下列原因用户无法查看图像，alt 属性可以为图像提供替代的信息：

?网速太慢
?src 属性中的错误
?浏览器禁用图像
?用户使用的是屏幕阅读器
<area> 标签的 alt 属性指定了替代文本，用于在图像无法显示或者用户禁用图像显示时，代替图像显示在浏览器中的内容。

我们强烈推荐您在文档的每个图像中都使用这个属性。这样即使图像无法显示，用户还是可以看到关于丢失了什么东西的一些信息。而且对于残疾人来说，alt 属性通常是他们了解图像内容的唯一方式。
实例
带有可点击区域的图像映射：

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />
  <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
</map>
TIY
浏览器支持
所有主流浏览器支持 alt 属性的方式有所不同。
语法
<area alt="value">属性值
值 描述 
text 区域的替代文本。 
HTML <area> 标签
■◆2137■坐标                简化命令：坐标■坐标■HTML <area> 标签的 coords 属性
HTML <area> 标签
定义和用法
coords 属性规定区域的 x 和 y 坐标。

coords 属性与 shape 属性配合使用，来规定区域的尺寸、形状和位置。

图像左上角的坐标是 "0,0"。

详细解释：
<area> 标签的 coords 属性定义了客户端图像映射中对鼠标敏感的区域的坐标。坐标的数字及其含义取决于 shape 属性中决定的区域形状。可以将客户端图像映射中的超链接区域定义为矩形、圆形或多边形等。

下面列出了每种形状的适当值：

圆形：shape="circle"，coords="x,y,z"
这里的 x 和 y 定义了圆心的位置（"0,0" 是图像左上角的坐标），r 是以像素为单位的圆形半径。

多边形：shape="polygon"，coords="x1,y1,x2,y2,x3,y3,..."
每一对 "x,y" 坐标都定义了多边形的一个顶点（"0,0" 是图像左上角的坐标）。定义三角形至少需要三组坐标；高纬多边形则需要更多数量的顶点。

多边形会自动封闭，因此在列表的结尾不需要重复第一个坐标来闭合整个区域。

矩形：shape="rectangle"，coords="x1,y1,x2,y2"
第一个坐标是矩形的一个角的顶点坐标，另一对坐标是对角的顶点坐标，"0,0" 是图像左上角的坐标。请注意，定义矩形实际上是定义带有四个顶点的多边形的一种简化方法。

例如，下面的 XHTML 片段在一个 100x100 像素图像的右下方四分之一处，定义了一个对鼠标敏感的区域，并在图像的正中间定义了一个圆形区域。

<map name="map">
  <area shape="rect" coords="75,75,99,99" nohref="nohref">
  <area shape="circ" coords="50,50,25" nohref="nohref">
</map>
实例
<img src ="planets.gif" alt="Planets" usemap ="#planetmap" />

<map name="planetmap">
  <area shape="rect" coords="0,0,110,260" href="sun.htm" alt="Sun" />
  <area shape="circle" coords="129,161,10" href="mercur.htm" alt="Mercury" />
  <area shape="circle" coords="180,139,14" href="venus.htm" alt="Venus" />
</map>
TIY
提示和注释
注释：如果某个 area 标签中的坐标和其他区域发生了重叠，会优先采用最先出现的 area 标签。浏览器会忽略超过图像边界范围之外的坐标。
语法
<area coords="value">属性值
值 描述 
x1,y1,x2,y2 如果 shape 属性设置为 "rect"，则该值规定矩形左上角和右下角的坐标。 
x,y,radius 如果 shape 属性设置为 "circ"，则该值规定圆心的坐标和半径。 
x1,y1,x2,y2,..,xn,yn 如果 shape 属性设置为 "poly"，则该值规定多边形各边的坐标。如果第一个坐标和最后一个坐标不一致，那么为了关闭多边形，浏览器必须添加最后一对坐标。 
■◆2137■连接目标            简化命令：目标■目标■HTML <area> 标签的 href 属性
HTML <area> 标签
定义和用法
href 属性规定区域中连接的目标。
实例
带有可点击区域的图像映射：

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus" />
  <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
</map>
TIY
浏览器支持
所有主流浏览器都支持 href 属性。
语法
<area href="value">属性值
值 描述 
URL 链接的 URL。可能的值：

?绝对 URL - 指向另一个站点（比如 href="http://www.example.com/sun.htm"）
?相对 URL - 指向站点内的某个文件（href="sun.htm"）
?锚 URL - 指向页面中的锚（href="#sun"）
 
■◆2137■没有链接            简化命令：无链■无链■HTML <area> 标签的 nohref 属性
HTML <area> 标签
定义和用法
nohref 属性规定该区域没有相关的链接。
实例
带有可点击区域和 nohref 属性的图像映射：

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" nohref="nohref" alt="Venus" />
  <area shape="circle" coords="129,161,10" href="mercur.html" alt="Mercury" />
  <area shape="rect" coords="0,0,110,260" href="sun.html" alt="Sun" />
</map>
TIY
浏览器支持
所有主流浏览器都支持 nohref 属性。
语法
<area nohref="value">属性值
值 描述 
nohref 规定区域没有相关的链接。 
■◆2137■形状                简化命令：形状■形状■HTML <area> 标签的 shape 属性
HTML <area> 标签
定义和用法
shape 属性与 coords 属性配合，可以规定区域的尺寸、形状和位置。

详细解释：
shape 属性用于定义图像映射中对鼠标敏感的区域的形状：

?圆形（circ 或 circle）
?多边形（poly 或 polygon）
?矩形（rect 或 rectangle）
shape 属性的值会影响浏览器对 coords 属性的解释。如果未使用 shape 属性，那么会假设使用值 default。依照标准，default 意味着该区域覆盖整个图像。在实际中，浏览器默认使用矩形区域，并期望能找到 4 个 coords 值。如果没有指定形状，而且在标签中也没有包括 4 个坐标，那么浏览器会忽略整个区域。

实际上，Netscape 是唯一可以识别 shape 属性的 default 值的浏览器，它可以提供一个包括全部热点的区域，以用于在超过其他热点定义的范围之外单击的情况。由于区域在 <map> 标签中是采用“先来先得”的顺序，所有必须将默认区域放置在后面。否则，默认区域会覆盖其他的图像映射中出现的所有区域。

浏览器在形状名称的实现方面没有严格要求。例如，对于矩形，Netscape 4 不能识别 "rectangle"，却能识别 "rect"。出于这个原因，我们建议使用缩写的名称。
实例
<img src ="planets.gif" alt="Planets" usemap ="#planetmap" />

<map name="planetmap">
  <area shape="rect" coords="0,0,110,260" href="sun.htm" alt="Sun" />
  <area shape="circle" coords="129,161,10" href="mercur.htm" alt="Mercury" />
  <area shape="circle" coords="180,139,14" href="venus.htm" alt="Venus" />
</map>
TIY
浏览器支持
所有浏览器都支持 shape 属性。
语法
<a shape="value">属性值
值 描述 
default 规定全部区域。 
rect 定义矩形区域。 
circ 定义圆形。 
poly 定义多边形区域。 
■◆2137■打开方式            简化命令：何处■何处■HTML <area> 标签的 target 属性
HTML <area> 标签
定义和用法
target 属性规定区域中连接的目标。
实例
带有可点击区域的图像映射：

<img src="planets.jpg" border="0" usemap="#planetmap" alt="Planets" />

<map name="planetmap" id="planetmap">
  <area shape="circle" coords="180,139,14" href ="venus.html" alt="Venus"
  target=""_blank" />
  <area shape="circle" coords="129,161,10" href ="mercur.html" alt="Mercury" />
  <area shape="rect" coords="0,0,110,260" href ="sun.html" alt="Sun" />
</map>
TIY
浏览器支持
所有主流浏览器都支持 target 属性。
语法
<area target="value">属性值
值 描述 
_blank 在新窗口中打开被链接文档。 
_self 默认。在相同的框架中打开被链接文档。 
_parent 在父框架集中打开被链接文档。 
_top 在整个窗口中打开被链接文档。 
framename 在指定的框架中打开被链接文档。 
■◆978■表格                简化命令：表格■表格■HTML <table> 标签
定义和用法
<table> 标签定义 HTML 表格。

简单的 HTML 表格由 table 元素以及一个或多个 tr、th 或 td 元素组成。

tr 元素定义表格行，th 元素定义表头，td 元素定义表格单元。

更复杂的 HTML 表格也可能包括 caption、col、colgroup、thead、tfoot 以及 tbody 元素。
■◆2170■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2170■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2170■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2170■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2170■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2170■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2170■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2170■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2170■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2170■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2170■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2170■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2170■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2170■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2170■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2170■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2170■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2170■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2170■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2170■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2170■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2170■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2170■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2170■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2170■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2170■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2170■对齐方式            简化命令：横对齐■横对齐■HTML <table> 标签的 align 属性
HTML <table> 标签
定义和用法
align 属性规定表格相对于周围元素的对齐方式。

通常来说，HTML 表格的前后都会出现折行。通过运用 align 属性，可实现其他 HTML 元素围绕表格的效果。
实例
一个右对齐的 HTML 表格：

<table border="1" align="right">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
</table>
TIY
兼容性注释
在 HTML 4.01 中，不赞成使用 body 元素的 align 属性；在 XHTML 1.0 Strict DTD 中，不支持 body 元素的 align 属性。

请使用 CSS 代替。

CSS 语法：<table style="float:right">

CSS 实例：表格对齐方式

在我们的 CSS 教程中，您可以找到更多有关 float 属性的细节。
语法
<table align="value">属性值
值 描述 
left 左对齐表格。 
right 右对齐表格。 
center 居中对齐表格。 
■◆2170■背景颜色            简化命令：景色■景色■HTML <table> 标签的 bgcolor 属性
HTML <table> 标签
定义和用法
bgcolor 属性规定规定表格的背景颜色。
实例
带有背景颜色的 HTML 表格：

<table border="1" bgcolor="#00FF00">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
兼容性注释
在 HTML 4.01 中，不赞成使用 body 元素的 bgcolor 属性；在 XHTML 1.0 Strict DTD 中，不支持 body 元素的 bgcolor 属性。

请使用 CSS 代替。

CSS 语法：<table style="background-color:red">

CSS 实例：表格背景颜色

在我们的 CSS 教程中，您可以找到更多有关 background-color 属性的细节。
语法
<body bgcolor="value">属性值
值 描述 
color_name 规定颜色值为颜色名称的背景颜色（比如 "red"）。 
hex_number 规定颜色值为十六进制值的背景颜色（比如 "#ff0000"）。 
rgb_number 规定颜色值为 rgb 代码的背景颜色（比如 "rgb(255,0,0)"）。 
■◆2170■边框的宽度          简化命令：边框■边框■HTML <table> 标签的 border 属性
HTML <table> 标签
定义和用法
border 属性规定规定围绕表格的边框的宽度。

border 属性会为每个单元格应用边框，并用边框围绕表格。如果 border 属性的值发生改变，那么只有表格周围边框的尺寸会发生变化。表格内部的边框则是 1 像素宽。

提示：设置 border="0"，可以显示没有边框的表格。

从实用角度出发，最好不要规定边框，而是使用 CSS 来添加边框样式和颜色。
实例
下面的例子把表格周围的边框设置为 8 像素宽：

<table border="8">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
语法
<body border="value">属性值
值 描述 
pixels 规定表格边框宽度。 
■◆2170■内边距              简化命令：内边距■内边距■HTML <table> 标签的 cellpadding 属性
HTML <table> 标签
定义和用法
cellpadding 属性规定单元边沿与其内容之间的空白。

注释：请勿将该属性与 cellspacing 属性相混淆，cellspacing 属性规定的是单元之间的空间。

从实用角度出发，最好不要规定 cellpadding，而是使用 CSS 来添加内边距。
实例
下面的例子把表格单元边界与单元内容之间的间距设置为 10 像素：

<table border="8" cellpadding="10">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
语法
<body cellpadding="value">属性值
值 描述 
pixels 规定单元边沿与其内容之间的空白。 
■◆2170■单元格之间距离      简化命令：外格距■外格距■HTML <table> 标签的 cellspacing 属性
HTML <table> 标签
定义和用法
cellspacing 属性规定单元格之间的空间。

注释：请勿将该属性与 cellpadding 属性相混淆，cellpadding 属性规定的是单元边沿与单元内容之间的空间。
实例
下面的例子把表格单元格间距设置为 10 像素：

<table border="8" cellspacing="10">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
语法
<body cellspacing="value">属性值
值 描述 
pixels 规定单元之间的空间。 
■◆2170■外侧边框可见部分    简化命令：框架■框架■HTML <table> 标签的 frame 属性
HTML <table> 标签
定义和用法
frame 属性规定外侧边框的哪个部分是可见的。

从实用角度出发，最好不要规定 frame，而是使用 CSS 来添加边框样式。
实例
下面的例子规定只有围绕表格的边框是可见的：

<table frame="box">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
除了 Internet Explorer，其他浏览器都支持 frame 属性。

注释：Internet Explorer 以不正确的方式来显示该属性。IE 同时会显示表格内单元格的边框（而不仅仅是外侧边框）。

注释：Safari 2.0 或更早的版本不支持该属性。
语法
<body frame="value">属性值
值 描述 
void 不显示外侧边框。 
above 显示上部的外侧边框。 
below 显示下部的外侧边框。 
hsides 显示上部和下部的外侧边框。 
vsides 显示左边和右边的外侧边框。 
lhs 显示左边的外侧边框。 
rhs 显示右边的外侧边框。 
box 在所有四个边上显示外侧边框。 
border 在所有四个边上显示外侧边框。 
■◆2170■内侧边框可见部分    简化命令：内框可见■内框可见■HTML <table> 标签的 rules 属性
HTML <table> 标签
定义和用法
rules 属性规定内侧边框的哪个部分是可见的。

从实用角度出发，最好不要规定 rules，而是使用 CSS 来添加边框样式。
实例
下面的例子规定只有行之间的边框是可见的：

<table rules="rows">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
rules 属性在 Firefox 和 Opera 中可以正确地显示。

Internet Explorer、Chrome 以及 Safari 3 对该属性的显示并不正确。

?IE: 除了内侧边框，还会添加 4 边的外侧边框。
?Chrome 和 Safari：除了内侧边框，还会添加 affected 外侧边框。
注释：Safari 2.0 和更早的版本不支持该属性。
语法
<body rules="value">属性值
值 描述 
none 没有线条。 
groups 位于行组和列组之间的线条。 
rows 位于行之间的线条。 
cols 位于列之间的线条。 
all 位于行和列之间的线条。 
■◆2170■内容摘要            简化命令：摘要■摘要■HTML <table> 标签的 summary 属性
HTML <table> 标签
定义和用法
summary 属性规定表格内容的摘要。

summary 属性不会对普通浏览器中产生任何视觉变化。

屏幕阅读器可以利用该属性。
实例
下面的例子定义了表格内容的摘要：

<table border="1" summary="Monthly savings for the Flintstones family">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
由于不会在普通浏览器中产生任何视觉效果，很难判断浏览器是否支持 summary 属性。
语法
<body summary="value">属性值
值 描述 
text 表格内容的摘要。 
■◆2170■宽度                简化命令：宽■宽■HTML <table> 标签的 width 属性
HTML <table> 标签
定义和用法
width 属性规定表格的宽度。

如果没有设置 width 属性，表格会占用需要的空间来显示表格数据。

从实用角度出发，最好不要规定宽度，而是使用 CSS 来应用宽度。
实例
带有 400 像素宽度的表格：

<table border="1" width="400">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
由于不会在普通浏览器中产生任何视觉效果，很难判断浏览器是否支持 summary 属性。
语法
<body width="value">属性值
值 描述 
pixels 设置以像素计的宽度（例子：width="50"）。 
% 设置以包含元素的百分比计的宽度（例子：width="50%"）。 
■◆978■表格标题            简化命令：表题■表题■HTML <caption> 标签
定义和用法
caption 元素定义表格标题。

caption 标签必须紧随 table 标签之后。您只能对每个表格定义一个标题。通常这个标题会被居中于表格之上
■◆2206■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2206■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2206■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2206■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2206■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2206■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2206■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2206■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2206■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2206■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2206■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2206■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2206■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2206■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2206■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2206■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2206■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2206■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2206■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2206■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2206■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2206■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2206■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2206■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2206■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2206■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2206■对齐方式            简化命令：横对齐■横对齐■HTML <caption> 标签的 align 属性
HTML <caption> 标签
定义和用法
align 属性规定 caption 元素的对齐方式。

该属性将 caption 作为块元素向表格的左边、右边、顶部、底部进行对齐。
实例
带有与底部对齐的 caption 元素的表格：

<table border="1">
  <caption align="bottom">Monthly savings</caption>
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
除了 Firefox，其他主流浏览器都无法正确地支持 align 属性。

注释：所有主流浏览器都支持 "top" 和 "bottom" 值。Chrome 和 Safari 不支持 "left" 和 "right"。Internet Explorer 和 Opera 只能对 caption 内部的文本（而不是整个 caption 元素）进行对齐。
兼容性注释
在 HTML 4.01 中，不赞成使用 caption 元素的 align 属性；在 XHTML 1.0 Strict DTD 中，不支持 caption 元素的 align 属性。

请使用 CSS 代替。

CSS 语法：<caption style="caption-side:left">

注释：主流浏览器对 CSS 的 caption-side 属性的支持不是很好。

CSS 实例：定位表格标题

在我们的 CSS 教程中，您可以找到更多有关 caption-side 属性的细节。
语法
<caption align="value">属性值
值 描述 
left 标题在表格的左边。 
right 标题在表格的右边。 
top 标题在表格的上边。 
bottom 标题在表格的下边。 
■◆978■表头单元格          简化命令：粗格■粗格■HTML <th> 标签
定义和用法
定义表格内的表头单元格。

HTML 表单中有两种类型的单元格：

?表头单元格 - 包含表头信息（由 th 元素创建）
?标准单元格 - 包含数据（由 td 元素创建）
th 元素内部的文本通常会呈现为居中的粗体文本，而 td 元素内的文本通常是左对齐的普通文本。
■◆2234■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2234■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2234■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2234■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2234■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2234■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2234■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2234■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2234■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2234■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2234■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2234■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2234■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2234■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2234■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2234■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2234■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2234■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2234■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2234■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2234■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2234■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2234■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2234■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2234■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2234■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2234■内容缩写            简化命令：缩写■缩写■HTML <th> 标签的 abbr 属性
HTML <th> 标签
定义和用法
abbr 属性规定表头单元格中内容的缩写版本。
abbr 属性不会在普通的 web 浏览器中造成任何视觉效果方面的变化。
屏幕阅读器可以利用该属性。
实例
在 HTML 表格中使用 abbr 属性：
<table border="1">
  <tr>
    <th abbr="Company">Company in USA</th>
    <th>Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
由于在普通的 web 浏览器中不会造成任何视觉效果方面的变化，因此很难说是否存在对 abbr 属性的支持。
语法
<th abbr="value">
属性值
值	描述
text	表头单元格的短描述。■◆2234■水平对齐            简化命令：横对齐■横对齐■HTML <th> 标签的 align 属性
HTML <th> 标签
定义和用法
align 属性规定表格的表头单元格中内容的水平对齐方式。
实例
带有右对齐表头单元格的 HTML 表格：
<table border="1">
  <tr>
    <th>Company in USA</th>
    <th align="right">Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 align 属性。
注释：IE 无法正确地处理 "justify" 值，IE 会以居中的方式进行处理。
注释：几乎没有浏览器能够正确地处理 "char" 值。
语法
<th align="value">
属性值
值	描述
left	左对齐内容（默认值）。
right	右对齐内容。
center	居中对齐内容。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
char	将内容对准指定字符。■◆2234■背景颜色            简化命令：景色■景色■HTML <th> 标签的 bgcolor 属性
HTML <th> 标签
定义和用法
bgcolor 属性规定表头单元格的背景颜色。
实例
带有背景颜色的表头单元格：
<table border="1">
  <tr>
    <th bgcolor="#FF0000">Company in USA</th>
    <th bgcolor="#00FF00">Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 bgcolor 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不推荐使用 th 元素的 bgcolor 属性；在 XHTML 1.0 Strict DTD 中，不支持 th 元素的 bgcolor 属性。
请使用 CSS 代替。
CSS 语法：<th style="background-color:red">
CSS 实例：表格行背景颜色
在我们的 CSS 教程中，您可以找到更多有关 background-color 属性 的细节。
语法
<th bgcolor="value">
属性值
值	描述
color_name	规定颜色值为颜色名称的背景颜色（比如 "red"）。
hex_number	规定颜色值为十六进制值的背景颜色（比如 "#ff0000"）。
rgb_number	规定颜色值为 rgb 代码的背景颜色（比如 "rgb(255,0,0)"）。■◆2234■字符对齐            简化命令：字符对齐■字符对齐■HTML <th> 标签的 char 属性
HTML <th> 标签
定义和用法
char 属性规定将表头单元格中的内容相对某个字符的对齐方式。
仅当 align 属性设置为 "char" 时，才能使用 char 属性。
char 属性的默认值是页面语言的小数点字符。
实例
在下面的例子中，第一个表头单元的的内容与 "C" 字符对齐：
<table border="1">
  <tr>
    <th align="char" char="C">Company</th>
    <th>Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
几乎没有浏览器支持 char 属性。
语法
<th char="value">
属性值
值	描述
character	规定将内容与之对齐的字符。
■◆2234■对齐偏移量          简化命令：对齐偏移■对齐偏移■HTML <th> 标签的 charoff 属性
HTML <th> 标签
定义和用法
charoff 属性设置内容相对于由 char 属性规定的字符的对齐偏移量。
仅当 align 属性设置为 "char" 且已设置 char 属性时，才能使用 charoff 属性。
实例
在下面的例子中，第一个表头单元的的内容与 "C" 字符向右二个字符的位置对齐：
<table border="1">
  <tr>
    <th align="char" char="C" charoff="2">Company</th>
    <th>Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
几乎没有浏览器支持 charoff 属性。
语法
<th charoff="value">
属性值
值	描述
number	
规定对齐方式。
正数规定向字符的右边对齐。
负数规定向字符的左边对齐。
■◆2234■横跨的列数          简化命令：跨列■跨列■HTML <th> 标签的 colspan 属性
HTML <th> 标签
定义和用法
colspan 属性规定表头单元格可横跨的列数。
实例
表头单元横跨两列的表格：
<table border="1">
  <tr>
    <th colspan="2">Company in USA</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
所以浏览器都支持 colspan 属性。
没有浏览器支持 colspan="0"，这个值有特殊的意义。（参见属性值表格中的描述）
语法
<th colspan="value">
属性值
值	描述
number	
设置单元格可横跨的列数。
注释：colspan="0" 指示浏览器横跨到列组的最后一列。■◆2234■表头信息            简化命令：信息■信息■HTML <th> 标签的 headers 属性
HTML <th> 标签
定义和用法
headers 属性规定表头与单元格相关联。
headers 属性不会在普通浏览器中产生任何视觉变化。
屏幕阅读器可以利用该属性。
详细解释
headers 属性会将表格中的一个表头单元格和一个数据单元格联系起来。
这个属性的值是引号包括的一列名称，这些名称是用 id 属性定义的不同表头单元格的名称。
headers 属性对非可视化的浏览器，也就是那些在显示出相关数据单元格内容之前就显示表头单元格内容的浏览器非常有用。
浏览器支持
由于不会在普通浏览器中产生任何视觉效果，很难判断浏览器是否支持 headers 属性。
语法
<th headers="value">
属性值
值	描述
idrefs	规定与表格单元相关联的一个或多个表头单元的 id。
■◆2234■高度                简化命令：高■高■HTML <th> 标签的 height 属性
HTML <th> 标签
定义和用法
height 属性规定表格的表头单元格的高度。
通常，单元格占用的空间就是它显示内容需要的空间。height 属性用于为单元格设置预定义的高度。
实例
两个带有预定义高度的单元格：
<table border="1">
  <tr>
    <th height="100px">Company in USA</th>
    <th height="100px">Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 height 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不推荐使用 th 元素的 height 属性；在 XHTML 1.0 Strict DTD 中，不支持 th 元素的 height 属性。
请使用 CSS 代替。
CSS 语法：<th style="height:100px">
CSS 实例：设置表格单元的高度
在我们的 CSS 教程中，您可以找到更多有关 height 属性 的细节。
语法
<th height="value">
属性值
值	描述
pixels	以像素计的高度值（比如 "100px"）。
percent	以包含元素百分比计的高度值（比如 "20%"）。
■◆2234■不折行              简化命令：无尾■无尾■HTML <th> 标签的 nowrap 属性
HTML <th> 标签
定义和用法
nowrap 属性规定表头单元格中的内容不换行。
实例
带有 nowrap 属性的表格单元：
<table border="1">
  <tr>
    <th>Company in USA</th>
    <th nowrap="nowrap">Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 nowrap 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不推荐使用 th 元素的 nowrap 属性；在 XHTML 1.0 Strict DTD 中，不支持 th 元素的 nowrap 属性。
请使用 CSS 代替。
CSS 语法：<th style="white-space: nowrap">
CSS 实例：th 中不换行
在我们的 CSS 教程中，您可以找到更多有关 white-space 属性 的细节。
语法
<th nowrap="value">
属性值
值	描述
nowrap	规定表头单元格中的内容不换行。
■◆2234■横跨行数            简化命令：跨行■跨行■HTML <th> 标签的 rowspan 属性
HTML <th> 标签
定义和用法
rowspan 属性规定表头单元格可横跨的行数。
实例
表格单元横跨两行的表格：
<table border="1">
  <tr>
    <th>Company</th>
    <th>Address</th>
    <th rowspan="3">All the companies in USA</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
所以浏览器都支持 rowspan 属性。
没有浏览器支持 rowspan="0"，这个值有特殊的意义。（参见属性值表格中的描述）
语法
<th rowspan="value">
属性值
值	描述
number	
设置表头单元格可横跨的行数。
注释：rowspan="0" 指示浏览器横跨到表格部分的最后一行（thead、tbody 或者 tfoot）。
■◆2234■垂直排列            简化命令：竖对齐■竖对齐■HTML <th> 标签的 valign 属性
HTML <th> 标签
定义和用法
valign 属性规定单元格中内容的垂直排列方式。
实例
带有不同垂直对齐单元格的表格：
<table border="1" style="height:200px">
  <tr>
    <th valign="middle">Company</th>
    <th valign="bottom">Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 valign 属性。
语法
<th valign="value">
属性值
值	描述
top	对内容进行上对齐。
middle	对内容进行居中对齐（默认值）。
bottom	对内容进行下对齐。
baseline	与基线对齐。■◆2234■宽度                简化命令：宽■宽■HTML <th> 标签的 width 属性
HTML <th> 标签
定义和用法
width 属性规定表格的表头单元格的宽度。
通常，单元格占用的空间就是它显示内容需要的空间。width 属性用于为单元格设置预定义的宽度。
实例
两个带有预定义宽度的单元格：
<table border="1">
  <tr>
    <th width="40%">Company in USA</th>
    <th width="60%">Address</th>
  </tr>
  <tr>
    <td>Apple, Inc.</td>
    <td>1 Infinite Loop Cupertino, CA 95014</td>
  </tr>
  <tr>
    <td>Google, Inc.</td>
    <td>1600 Amphitheatre Parkway Mountain View, CA 94043</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 width 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不赞成使用 th 元素的 width 属性；在 XHTML 1.0 Strict DTD 中，不支持 th 元素的 width 属性。
请使用 CSS 代替。
CSS 语法：<th style="width:100px">
CSS 实例：设置表格单元的宽度
在我们的 CSS 教程中，您可以找到更多有关 width 属性 的细节。
语法
<th width="value">
属性值
值	描述
pixels	以像素计的宽度值（比如 "100px"）。
percent	以包含元素百分比计的宽度值（比如 "20%"）。
■◆978■表格中的行          简化命令：表行■表行■HTML <tr> 标签
定义和用法
<tr> 标签定义 HTML 表格中的行。

tr 元素包含一个或多个 th 或 td 元素。
■◆2273■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2273■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2273■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2273■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2273■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2273■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2273■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2273■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2273■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2273■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2273■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2273■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2273■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2273■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2273■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2273■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2273■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2273■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2273■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2273■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2273■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2273■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2273■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2273■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2273■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2273■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2273■水平对齐            简化命令：横对齐■横对齐■HTML <tr> 标签的 align 属性
HTML <tr> 标签
定义和用法
align 属性规定表格行中内容的水平对齐方式。
实例
带有居中对齐行的表格：
<table width="100%" border="1">
  <tr align="center">
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr align="center">
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 align 属性。
注释：IE 无法正确地处理 "justify" 值，IE 会以居中的方式进行处理。
注释：几乎没有浏览器能够正确地处理 "char" 值。
语法
<tr align="value">
属性值
值	描述
left	左对齐内容（默认值）。
right	右对齐内容。
center	居中对齐内容（th 元素的默认值）。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
char	将内容对准指定字符。
■◆2273■背景颜色            简化命令：景色■景色■HTML <tr> 标签的 bgcolor 属性
HTML <tr> 标签
定义和用法
bgcolor 属性规定表格行的背景颜色。
实例
第一行带有背景颜色的 HTML 表格：
<table width="100%" border="1">
  <tr bgcolor="#FF0000">
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 bgcolor 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不赞成使用 tr 元素的 bgcolor 属性；在 XHTML 1.0 Strict DTD 中，不支持 tr 元素的 bgcolor 属性。
请使用 CSS 代替。
CSS 语法：<tr style="background-color:red">
CSS 实例：表格行背景颜色
在我们的 CSS 教程中，您可以找到更多有关 background-color 属性的细节。
语法
<tr bgcolor="value">
属性值
值	描述
color_name	规定颜色值为颜色名称的背景颜色（比如 "red"）。
hex_number	规定颜色值为十六进制值的背景颜色（比如 "#ff0000"）。
rgb_number	规定颜色值为 rgb 代码的背景颜色（比如 "rgb(255,0,0)"）。
■◆2273■字符的对齐          简化命令：字符对齐■字符对齐■HTML <tr> 标签的 char 属性
HTML <tr> 标签
定义和用法
char 属性规定将表格行中的内容相对某个字符的对齐方式。
仅当 align 属性设置为 "char" 时，才能使用 char 属性。
char 属性的默认值是页面语言的小数点字符。
实例
在下面的例子中，第二行和第三行的内容与 "." 字符对齐：
<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr align="char" char=".">
    <td>January</td>
    <td>$100.00</td>
  </tr>
  <tr align="char" char=".">
    <td>February</td>
    <td>$10.00</td>
  </tr>
</table>
TIY
浏览器支持
几乎没有浏览器支持 char 属性。
语法
<tr char="value">
属性值
值	描述
character	规定将内容与之对齐的字符。
■◆2273■垂直对齐            简化命令：竖对齐■竖对齐■HTML <tr> 标签的 valign 属性
HTML <tr> 标签
定义和用法
valign 属性规定表格行中内容的垂直对齐方式。
实例
带有不同垂直对齐行的表格：
<table width="100%" border="1">
  <tr valign="middle">
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr valign="bottom">
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 valign 属性。
语法
<tr valign="value">
属性值
值	描述
top	对内容进行上对齐。
middle	对内容进行居中对齐（默认值）。
bottom	对内容进行下对齐。
baseline	与基线对齐。
baseline 值
基线是一条虚构的线。在一行文本中，大多数字母以基线为基准。baseline 值设置行中的所有表格数据都分享相同的基线。该值的效果常常与 bottom 值相同。不过，如果文本的字号各不相同，那么 baseline 的效果会更好。请看下面的图示：■◆2273■内容缩写            简化命令：缩写■缩写■HTML <td> 标签的 abbr 属性
HTML <td> 标签
定义和用法
abbr 属性规定单元格中内容的缩写版本。
abbr 属性不会在普通的 web 浏览器中造成任何视觉效果方面的变化。
屏幕阅读器可以利用该属性。
实例
在 HTML 表格中使用 abbr 属性：
<table border="1">
  <tr>
    <th>Company</th>
    <th>Country</th>
  </tr>
  <tr>
    <td abbr="IBM">International Business Machine</td>
    <td>USA</td>
  </tr>
  <tr>
    <td abbr="ICBC">Industrial and Commercial Bank of China</td>
    <td>PRC</td>
  </tr>
</table>
TIY
浏览器支持
由于在普通的 web 浏览器中不会造成任何视觉效果方面的变化，因此很难说是否存在对 abbr 属性的支持。
语法
<td abbr="value">
属性值
值	描述
text	单元格的短描述。
■◆978■表格中单元          简化命令：格■格■HTML <td> 标签
定义和用法
<td> 标签定义 HTML 表格中的标准单元格。

HTML 表格有两类单元格：

?表头单元 - 包含头部信息（由 th 元素创建）
?标准单元 - 包含数据（由 td 元素创建）
td 元素中的文本一般显示为正常字体且左对齐。
■◆2305■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2305■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2305■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2305■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2305■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2305■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2305■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2305■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2305■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2305■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2305■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2305■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2305■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2305■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2305■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2305■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2305■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2305■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2305■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2305■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2305■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2305■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2305■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2305■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2305■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2305■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2305■内容缩写            简化命令：缩写■缩写■HTML <td> 标签的 abbr 属性
HTML <td> 标签
定义和用法
abbr 属性规定单元格中内容的缩写版本。
abbr 属性不会在普通的 web 浏览器中造成任何视觉效果方面的变化。
屏幕阅读器可以利用该属性。
实例
在 HTML 表格中使用 abbr 属性：
<table border="1">
  <tr>
    <th>Company</th>
    <th>Country</th>
  </tr>
  <tr>
    <td abbr="IBM">International Business Machine</td>
    <td>USA</td>
  </tr>
  <tr>
    <td abbr="ICBC">Industrial and Commercial Bank of China</td>
    <td>PRC</td>
  </tr>
</table>
TIY
浏览器支持
由于在普通的 web 浏览器中不会造成任何视觉效果方面的变化，因此很难说是否存在对 abbr 属性的支持。
语法
<td abbr="value">
属性值
值	描述
text	单元格的短描述。■◆2305■水平对齐            简化命令：横对齐■横对齐■HTML <td> 标签的 align 属性
HTML <td> 标签
定义和用法
align 属性规定单元格中内容的水平对齐方式。
实例
带有右对齐单元格的 HTML 表格：
<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td align="right">$100</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 align 属性。
注释：IE 无法正确地处理 "justify" 值，IE 会以居中的方式进行处理。
注释：几乎没有浏览器能够正确地处理 "char" 值。
语法
<td align="value">
属性值
值	描述
left	左对齐内容（默认值）。
right	右对齐内容。
center	居中对齐内容。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
char	将内容对准指定字符。
■◆2305■背景颜色            简化命令：景色■景色■HTML <td> 标签的 bgcolor 属性
HTML <td> 标签
定义和用法
bgcolor 属性规定单元格的背景颜色。
实例
带有背景颜色的单元格：
<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td bgcolor="#FF0000">January</td>
    <td bgcolor="#00FF00">$100.00</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 bgcolor 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不赞成使用 td 元素的 bgcolor 属性；在 XHTML 1.0 Strict DTD 中，不支持 td 元素的 bgcolor 属性。
请使用 CSS 代替。
CSS 语法：<td style="background-color:red">
CSS 实例：表格行背景颜色
在我们的 CSS 教程中，您可以找到更多有关 background-color 属性的细节。
语法
<td bgcolor="value">
属性值
值	描述
color_name	规定颜色值为颜色名称的背景颜色（比如 "red"）。
hex_number	规定颜色值为十六进制值的背景颜色（比如 "#ff0000"）。
rgb_number	规定颜色值为 rgb 代码的背景颜色（比如 "rgb(255,0,0)"）。
■◆2305■横跨列数            简化命令：跨列■跨列■HTML <td> 标签的 colspan 属性
HTML <td> 标签
定义和用法
colspan 属性规定单元格可横跨的列数。
实例
表格单元横跨两列的表格：
<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td colspan="2">January</td>
  </tr>
  <tr>
    <td colspan="2">February</td>
  </tr>
</table>
TIY
浏览器支持
所以浏览器都支持 colspan 属性。
没有浏览器支持 colspan="0"，这个值有特殊的意义。（参见属性值表格中的描述）
语法
<td colspan="value">
属性值
值	描述
number	
设置单元格可横跨的列数。
注释：colspan="0" 指示浏览器横跨到列组的最后一列。■◆2305■高度                简化命令：高■高■HTML <td> 标签的 height 属性
HTML <td> 标签
定义和用法
height 属性规定表格单元格的高度。
通常，单元格占用的空间就是它显示内容需要的空间。height 属性用于为单元格设置预定义的高度。
实例
两个带有预定义高度的单元格：
<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td height="100px">January</td>
    <td height="100px">$100.00</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80.00</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 height 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不赞成使用 td 元素的 height 属性；在 XHTML 1.0 Strict DTD 中，不支持 td 元素的 height 属性。
请使用 CSS 代替。
CSS 语法：<td style="height:100px">
CSS 实例：设置表格单元的高度
在我们的 CSS 教程中，您可以找到更多有关 height 属性的细节。
语法
<td height="value">
属性值
值	描述
pixels	以像素计的高度值（比如 "100px"）。
percent	以包含元素百分比计的高度值（比如 "20%"）。
■◆2305■内容不换行          简化命令：无尾■无尾■HTML <td> 标签的 nowrap 属性
HTML <td> 标签
定义和用法
nowrap 属性规定表格单元格中的内容不换行。
实例
带有 nowrap 属性的表格单元：
<table border="1">
  <tr>
    <th>Poem</th>
    <th>Poem</th>
  </tr>
  <tr>
    <td nowrap="nowrap">Never increase, beyond what is necessary, the 
	number of entities required to explain anything</td>
    <td>Never increase, beyond what is necessary, the number of entities 
	required to explain anything</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 nowrap 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不赞成使用 td 元素的 nowrap 属性；在 XHTML 1.0 Strict DTD 中，不支持 td 元素的 nowrap 属性。
请使用 CSS 代替。
CSS 语法：<td style="white-space: nowrap">
CSS 实例：td 中不换行
在我们的 CSS 教程中，您可以找到更多有关 white-space 属性的细节。
语法
<td nowrap="value">
属性值
值	描述
nowrap	规定表格单元格中的内容不换行。■◆2305■横跨行数            简化命令：跨行■跨行■HTML <td> 标签的 rowspan 属性
HTML <td> 标签
定义和用法
rowspan 属性规定单元格可横跨的行数。
实例
表格单元横跨两行的表格：
<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100.00</td>
    <td rowspan="2">$50</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$10.00</td>
  </tr>
</table>
TIY
浏览器支持
所以浏览器都支持 rowspan 属性。
没有浏览器支持 rowspan="0"，这个值有特殊的意义。（参见属性值表格中的描述）
语法
<td rowspan="value">
属性值
值	描述
number	
设置单元格可横跨的行数。
注释：rowspan="0" 指示浏览器横跨到表格部分的最后一行（thead、tbody 或者 tfoot）。■◆2305■垂直排列            简化命令：竖对齐■竖对齐■HTML <td> 标签的 valign 属性
HTML <td> 标签
定义和用法
valign 属性规定单元格中内容的垂直排列方式。
实例
带有不同垂直对齐单元格的表格：
<table border="1">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td valign="top">January</td>
    <td valign="top">$100</td>
  </tr>
  <tr>
    <td valign="bottom">February</td>
    <td valign="bottom">$80</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 valign 属性。
语法
<td valign="value">
属性值
值	描述
top	对内容进行上对齐。
middle	对内容进行居中对齐（默认值）。
bottom	对内容进行下对齐。
baseline	与基线对齐。■◆2305■宽度                简化命令：宽■宽■HTML <td> 标签的 width 属性
HTML <td> 标签
定义和用法
width 属性规定表格单元格的宽度。
通常，单元格占用的空间就是它显示内容需要的空间。width 属性用于为单元格设置预定义的宽度。
实例
两个带有预定义宽度的单元格：
<table border="1" width="100%">
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td width="70%">January</td>
    <td width="30%">$100.00</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80.00</td>
  </tr>
</table>
TIY
浏览器支持
尽管不赞成使用 width 属性，但是所有浏览器都支持它。
兼容性注释
在 HTML 4.01 中，不赞成使用 td 元素的 width 属性；在 XHTML 1.0 Strict DTD 中，不支持 td 元素的 width 属性。
请使用 CSS 代替。
CSS 语法：<td style="width:100px">
CSS 实例：设置表格单元的宽度
在我们的 CSS 教程中，您可以找到更多有关 width 属性的细节。
语法
<td width="value">
属性值
值	描述
pixels	以像素计的宽度值（比如 "100px"）。
percent	以包含元素百分比计的宽度值（比如 "20%"）。
■◆978■表头内容            简化命令：表头■表头■HTML <thead> 标签
定义和用法
<thead> 标签定义表格的表头。该标签用于组合 HTML 表格的表头内容。

thead 元素应该与 tbody 和 tfoot 元素结合起来使用。

tbody 元素用于对 HTML 表格中的主体内容进行分组，而 tfoot 元素用于对 HTML 表格中的表注（页脚）内容进行分组。

注释：如果您使用 thead、tfoot 以及 tbody 元素，您就必须使用全部的元素。它们的出现次序是：thead、tfoot、tbody，这样浏览器就可以在收到所有数据前呈现页脚了。您必须在 table 元素内部使用这些标签。

提示：在默认情况下这些元素不会影响到表格的布局。不过，您可以使用 CSS 使这些元素改变表格的外观。

详细描述
thead、tfoot 以及 tbody 元素使您有能力对表格中的行进行分组。当您创建某个表格时，您也许希望拥有一个标题行，一些带有数据的行，以及位于底部的一个总计行。这种划分使浏览器有能力支持独立于表格标题和页脚的表格正文滚动。当长的表格被打印时，表格的表头和页脚可被打印在包含表格数据的每张页面上。
■◆2341■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2341■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2341■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2341■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2341■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2341■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2341■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2341■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2341■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2341■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2341■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2341■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2341■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2341■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2341■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2341■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2341■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2341■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2341■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2341■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2341■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2341■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2341■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2341■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2341■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2341■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2341■水平对齐            简化命令：横对齐■横对齐■HTML <thead> 标签的 align 属性
HTML <thead> 标签
定义和用法
align 属性规定 thead 元素中的内容的水平对齐方式。
实例
下面的 HTML 表格将 thead 元素中的内容向左对齐：
<table border="1" width="100%">
  <thead align="left">
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 align 属性。
注释：IE 无法正确地处理 "justify" 值，IE 会以居中的方式进行处理。
注释：几乎没有浏览器能够正确地处理 "char" 值。
语法
<thead align="value">
属性值
值	描述
left	左对齐内容（默认值）。
right	右对齐内容。
center	居中对齐内容（th 元素的默认值）。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
char	将内容对准指定字符。
■◆2341■垂直对齐            简化命令：竖对齐■竖对齐■HTML <thead> 标签的 valign 属性
HTML <thead> 标签
定义和用法
valign 属性规定 thead 元素中的内容的垂直对齐方式。
实例
下面的 HTML 表格把 thead 元素中的内容垂直居中对齐：
<table border="1" width="100%">
  <thead valign="middle">
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 valign 属性。
语法
<thead valign="value">
属性值
值	描述
top	对内容进行上对齐。
middle	对内容进行居中对齐（默认值）。
bottom	对内容进行下对齐。
baseline	与基线对齐。
baseline 值
基线是一条虚构的线。在一行文本中，大多数字母以基线为基准。baseline 值设置行中的■◆978■表格主体内容        简化命令：表体■表体■HTML <tbody> 标签
定义和用法
<tbody> 标签表格主体（正文）。该标签用于组合 HTML 表格的主体内容。

tbody 元素应该与 thead 和 tfoot 元素结合起来使用。

thead 元素用于对 HTML 表格中的表头内容进行分组，而 tfoot 元素用于对 HTML 表格中的表注（页脚）内容进行分组。

注释：如果您使用 thead、tfoot 以及 tbody 元素，您就必须使用全部的元素。它们的出现次序是：thead、tfoot、tbody，这样浏览器就可以在收到所有数据前呈现页脚了。您必须在 table 元素内部使用这些标签。

提示：在默认情况下这些元素不会影响到表格的布局。不过，您可以使用 CSS 使这些元素改变表格的外观。

详细描述
thead、tfoot 以及 tbody 元素使您有能力对表格中的行进行分组。当您创建某个表格时，您也许希望拥有一个标题行，一些带有数据的行，以及位于底部的一个总计行。这种划分使浏览器有能力支持独立于表格标题和页脚的表格正文滚动。当长的表格被打印时，表格的表头和页脚可被打印在包含表格数据的每张页面上。
■◆2370■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2370■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2370■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2370■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2370■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2370■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2370■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2370■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2370■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2370■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2370■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2370■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2370■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2370■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2370■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2370■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2370■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2370■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2370■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2370■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2370■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2370■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2370■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2370■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2370■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2370■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2370■水平对齐方式        简化命令：横对齐■横对齐■HTML <tbody> 标签的 align 属性
HTML <tbody> 标签
定义和用法
align 属性规定 tbody 元素中的内容的水平对齐方式。
实例
下面的 HTML 表格将 tbody 元素中的内容向右对齐：
<table border="1" width="100%">
  <thead>
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  </thead>
  <tbody align="right">
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
  </tbody>
</table>
TIY
浏览器支持
所有浏览器都支持 align 属性。
注释：IE 无法正确地处理 "justify" 值，IE 会以居中的方式进行处理。
注释：几乎没有浏览器能够正确地处理 "char" 值。
语法
<tbody align="value">
属性值
值	描述
left	左对齐内容（默认值）。
right	右对齐内容。
center	居中对齐内容（th 元素的默认值）。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
char	将内容对准指定字符。
■◆2370■垂直对齐            简化命令：竖对齐■竖对齐■HTML <tbody> 标签的 valign 属性
HTML <tbody> 标签
定义和用法
valign 属性规定 tbody 元素中的内容的垂直对齐方式。
实例
下面的 HTML 表格把 tbody 元素中的内容垂直居中对齐：
<table border="1" width="100%">
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
  <tbody valign="middle">
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
  </tbody>
</table>
TIY
浏览器支持
所有浏览器都支持 valign 属性。
语法
<tbody valign="value">
属性值
值	描述
top	对内容进行上对齐。
middle	对内容进行居中对齐（默认值）。
bottom	对内容进行下对齐。
baseline	与基线对齐。
baseline 值■◆978■表格中表注内容（脚注）简化命令：表脚■表脚■HTML <tfoot> 标签
定义和用法
<tfoot> 标签定义表格的页脚（脚注或表注）。该标签用于组合 HTML 表格中的表注内容。

tfoot 元素应该与 thead 和 tbody 元素结合起来使用。

thead 元素用于对 HTML 表格中的表头内容进行分组，而 tbody 元素用于对 HTML 表格中的主体内容进行分组。

注释：如果您使用 thead、tfoot 以及 tbody 元素，您就必须使用全部的元素。它们的出现次序是：thead、tfoot、tbody，这样浏览器就可以在收到所有数据前呈现页脚了。您必须在 table 元素内部使用这些标签。

提示：在默认情况下这些元素不会影响到表格的布局。不过，您可以使用 CSS 使这些元素改变表格的外观。

详细描述
thead、tfoot 以及 tbody 元素使您有能力对表格中的行进行分组。当您创建某个表格时，您也许希望拥有一个标题行，一些带有数据的行，以及位于底部的一个总计行。这种划分使浏览器有能力支持独立于表格标题和页脚的表格正文滚动。当长的表格被打印时，表格的表头和页脚可被打印在包含表格数据的每张页面上。
■◆2399■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2399■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2399■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2399■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2399■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2399■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2399■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2399■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2399■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2399■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2399■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2399■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2399■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2399■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2399■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2399■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2399■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2399■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2399■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2399■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2399■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2399■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2399■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2399■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2399■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2399■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2399■水平对齐            简化命令：横对齐■横对齐■HTML <tfoot> 标签的 align 属性
HTML <tfoot> 标签
定义和用法
align 属性规定 tfoot 元素中的内容的水平对齐方式。
实例
下面的 HTML 表格将 tfoot 元素中的内容居中对齐：
<table border="1" width="100%">
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
  <tfoot align="center">
    <tr>
      <td>Sum</td>
      <td>$180</td>
    </tr>
  </tfoot>  
</table>
TIY
浏览器支持
所有浏览器都支持 align 属性。
注释：IE 无法正确地处理 "justify" 值，IE 会以居中的方式进行处理。
注释：几乎没有浏览器能够正确地处理 "char" 值。
语法
<tfoot align="value">
属性值
值	描述
left	左对齐内容（默认值）。
right	右对齐内容。
center	居中对齐内容（th 元素的默认值）。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
char	将内容对准指定字符。■◆2399■垂直对齐            简化命令：竖对齐■竖对齐■HTML <tfoot> 标签的 valign 属性
HTML <tfoot> 标签
定义和用法
valign 属性规定 tfoot 元素中的内容的垂直对齐方式。
实例
下面的 HTML 表格把 tfoot 元素中的内容向下对齐：
<table border="1" width="100%">
    <tr>
      <th>Month</th>
      <th>Savings</th>
    </tr>
    <tr>
      <td>January</td>
      <td>$100</td>
    </tr>
    <tr>
      <td>February</td>
      <td>$80</td>
    </tr>
  <tfoot valign="bottom">
    <tr>
      <td>Sum</td>
      <td>$180</td>
    </tr>
  </tfoot>  
</table>
TIY
浏览器支持
所有浏览器都支持 valign 属性。
语法
<tfoot valign="value">
属性值
值	描述
top	对内容进行上对齐。
middle	对内容进行居中对齐（默认值）。
bottom	对内容进行下对齐。
baseline	与基线对齐。■◆978■表格中一个或多个列的属性值简化命令：多列属性■多列属性■HTML <col> 标签
定义和用法
<col> 标签为表格中一个或多个列定义属性值。

如需对全部列应用样式，<col> 标签很有用，这样就不需要对各个单元和各行重复应用样式了。

您只能在 table 或 colgroup 元素中使用 <col> 标签。
■◆2428■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2428■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2428■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2428■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2428■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2428■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2428■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2428■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2428■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2428■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2428■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2428■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2428■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2428■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2428■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2428■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2428■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2428■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2428■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2428■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2428■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2428■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2428■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2428■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2428■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2428■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2428■水平对齐            简化命令：横对齐■横对齐■HTML <col> 标签的 align 属性
HTML <col> 标签
定义和用法
align 属性规定与 col 元素相关的内容的水平对齐方式。
实例
在下面的例子中，col 元素为表格中的三个列规定了不同的对齐方式：
<table width="100%" border="1">
  <col align="left" />
  <col align="left" />
  <col align="right" />
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
</table>
TIY
浏览器支持
只有 Internet Explorer 和 Opera 支持 align 属性。
注释：IE 无法正确地处理 "justify" 值，IE 会以居中的方式进行处理。
注释：几乎没有浏览器能够正确地处理 "char" 值。
语法
<col align="value">
属性值
值	描述
left	左对齐内容（默认值）。
right	右对齐内容。
center	居中对齐内容（th 元素的默认值）。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
char	将内容对准指定字符。
■◆2428■横跨列数            简化命令：有效数■有效数■HTML <col> 标签的 span 属性
HTML <col> 标签
定义和用法
span 属性规定 col 元素应该横跨的列数。
详细解释
<col> 标签，如同 <colgroup> 标签中的 span 属性一样，允许设置设置 <col> 标签能够影响多少列。
在默认情况下，它只能影响一列。举个例子，创建一个有 5 列的 <colgroup>。我们分别将第一列和最后一列靠左和靠右对齐，中间的三列居中。
<colgroup>
  <col align="left" />
  <col align="center" span="3" />
  <col align="right" />
</colgroup>
实例
在下面的例子中，所有这三列都是居中对齐，因为 col 元素横跨三列：
<table width="100%" border="1">
  <col span="3" align="center" />
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 span 属性。
语法
<col span="value">
属性值
值	描述
number	设置 col 元素应该横跨的列数。■◆2428■垂直对齐            简化命令：竖对齐■竖对齐■HTML <col> 标签的 valign 属性
HTML <col> 标签
定义和用法
valign 属性规定与 col 元素相关的内容的垂直对齐方式。
实例
具有不同垂直对齐方式的列的表格：
<table border="1" style="height:200px">
  <col valign="top" />
  <col valign="bottom" />
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 valign 属性。
注释：目前没有主流浏览器支持 "baseline" 值。
语法
<col valign="value">
属性值
值	描述
top	对内容进行上对齐。
middle	对内容进行居中对齐（默认值）。
bottom	对内容进行下对齐。
baseline	与基线对齐。
baseline 值
基线是一条虚构的线。在一行文本中，大多数字母以基线为基准。baseline 值设置行中的所有表格数据都分享相同的基线。该值的效果常常与 bottom 值相同。不过，如果文本的字号各不相同，那么 baseline 的效果会更好。请看下面的图示：■◆2428■宽度                简化命令：宽■宽■HTML <col> 标签的 width 属性
HTML <col> 标签
定义和用法
width 属性规定 col 元素的宽度。
通常，col 元素占用的空间就是它显示内容需要的空间。width 属性用于为 col 元素设置预定义的宽度。
注释：该属性会覆盖 colgroup 元素中的任何宽度设置。
实例
具有预定义宽度的两个 col 元素：
<table border="1" width="100%">
  <col width="100" />
  <col width="50" />
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 width 属性。
注释：目前没有主流浏览器支持该属性的 relative_length 值。
语法
<col width="value">
属性值
值	描述
pixels	设置以像素计的宽度值（例子：width="50"）。
percent	设置以包围元素的百分比计的宽度值（例子：width="50%"）。
relative_length	把可用像素分配到各部分。
relative_length 值
假如表格的宽度是 100 像素，第一个列组是 20 像素，第二个列组是 50%，那么剩余的可用像素是 30 像素。
如果可用像素是 30px，那么可以设置部分一为 "1*"，部分二为 "2*"，这将被解释为 10 和 20 像素（"1*" 为部分一，"2*" 为部分二）。■◆978■表格中供格式化的列组简化命令：列组■列组■HTML <colgroup> 标签
定义和用法
<colgroup> 标签用于对表格中的列进行组合，以便对其进行格式化。

如需对全部列应用样式，<colgroup> 标签很有用，这样就不需要对各个单元和各行重复应用样式了。

<colgroup> 标签只能在 table 元素中使用。
■◆2459■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2459■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2459■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2459■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2459■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2459■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2459■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2459■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2459■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2459■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2459■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2459■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2459■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2459■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2459■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2459■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2459■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2459■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2459■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2459■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2459■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2459■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2459■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2459■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2459■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2459■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2459■水平对齐            简化命令：横对齐■横对齐■HTML <colgroup> 标签的 align 属性
HTML <colgroup> 标签
定义和用法
align 属性规定列组中的内容的水平对齐方式。
实例
两个 colgroup 元素为表格中的三列规定了不同的对齐方式和样式（注意第一个 colgroup 元素横跨两列）：
<table width="100%" border="1">
  <colgroup span="2" align="left"></colgroup>
  <colgroup align="right" style="color:#0000FF;"></colgroup>
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
</table>
TIY
浏览器支持
只有 Internet Explorer 和 Opera 支持 align 属性。
注释：IE 无法正确地处理 "justify" 值，IE 会以居中的方式进行处理。
注释：几乎没有浏览器能够正确地处理 "char" 值。
语法
<colgroup align="value">
属性值
值	描述
left	左对齐内容（默认值）。
right	右对齐内容。
center	居中对齐内容（th 元素的默认值）。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
char	将内容对准指定字符。
■◆2459■横跨列数            简化命令：有效数■有效数■HTML <colgroup> 标签的 span 属性
HTML <colgroup> 标签
定义和用法
span 属性规定列组应该横跨的列数。
详细解释
在 <colgroup> 标签中使用 span，可获得第一个列组的类型。span 属性的值是 <colgroup> 标签能够影响到的列数。
例如，有 6 列的一个表格，第一组有 4 列，第二组有 2 列，这样的表格在源码上如下所示：
<colgroup span="4"></colgroup>
<colgroup span="2"></colgroup>
浏览器在用例子中的代码将表格单元格合成列时，它会将每行前四个单元格合成第一个列组，将接下来的两个单元格合成第二个列组。这样，<colgroup> 标签的其他属性就可以用于该列组包含的列中了。
实例
两个 colgroup 元素为表格中的三列规定了不同的对齐方式和样式（注意第一个 colgroup 元素横跨两列）：
<table width="100%" border="1">
  <colgroup span="2" align="left"></colgroup>
  <colgroup align="right" style="color:#0000FF;"></colgroup>
  <tr>
    <th>ISBN</th>
    <th>Title</th>
    <th>Price</th>
  </tr>
  <tr>
    <td>3476896</td>
    <td>My first HTML</td>
    <td>$53</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 span 属性。
语法
<colgroup span="value">
属性值
值	描述
number	设置列组应该横跨的列数。
■◆2459■垂直对齐            简化命令：竖对齐■竖对齐■HTML <colgroup> 标签的 valign 属性
HTML <colgroup> 标签
定义和用法
valign 属性规定列组中的内容的垂直对齐方式。
实例
具有不同垂直对齐方式的表格：
<table border="1" style="height:200px">
  <colgroup valign="top" />
  <colgroup valign="bottom" />
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 valign 属性。
注释：目前没有主流浏览器支持 "baseline" 值。
语法
<colgroup valign="value">
属性值
值	描述
top	对内容进行上对齐。
middle	对内容进行居中对齐（默认值）。
bottom	对内容进行下对齐。
baseline	与基线对齐。
baseline 值
基线是一条虚构的线。在一行文本中，大多数字母以基线为基准。baseline 值设置行中的所有表格数据都分享相同的基线。该值的效果常常与 bottom 值相同。不过，如果文本的字号各不相同，那么 ■◆2459■列组宽度            简化命令：宽■宽■HTML <colgroup> 标签的 width 属性
HTML <colgroup> 标签
定义和用法
width 属性规定列组的宽度。
通常，列组占用的空间就是它显示内容需要的空间。width 属性用于为单元格设置预定义的宽度。
注释：该属性会被 col 元素中的任何宽度设置覆盖。
实例
下面的列组设置了两列的预定义宽度值是 100 像素：
<table border="1">
  <colgroup span="2" width="100" />
  <tr>
    <th>Month</th>
    <th>Savings</th>
  </tr>
  <tr>
    <td>January</td>
    <td>$100</td>
  </tr>
  <tr>
    <td>February</td>
    <td>$80</td>
  </tr>
</table>
TIY
浏览器支持
所有浏览器都支持 width 属性。
注释：目前没有主流浏览器支持该属性的 relative_length 值。
语法
<colgroup width="value">
属性值
值	描述
pixels	设置以像素计的宽度值（例子：width="50"）。
percent	设置以包围元素的百分比计的宽度值（例子：width="50%"）。
relative_length	把可用像素分配到各部分。
relative_length 值
假如表格的宽度是 100 像素，第一个列组是 20 像素，第二个列组是 50%，那么剩余的可用像素是 30 像素。
如果可用像素是 30px，那么可以设置部分一为 "1*"，部分二为 "2*"，这将被解释为 10 和 20 像素（"1*" 为部分一，"2*" 为部分二）。■◆978■样式信息            简化命令：样式■样式■HTML <style> 标签
定义和用法
<style> 标签用于为 HTML 文档定义样式信息。

在 style 中，您可以规定在浏览器中如何呈现 HTML 文档。

type 属性是必需的，定义 style 元素的内容。唯一可能的值是 "text/css"。

style 元素位于 head 部分中。
■◆2490■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2490■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2490■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2490■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2490■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2490■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2490■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2490■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2490■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2490■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2490■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2490■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2490■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2490■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2490■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2490■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2490■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2490■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2490■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2490■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2490■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2490■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2490■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2490■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2490■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2490■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2490■样式表的 MIME 类型  简化命令：类型■类型■HTML <style> 标签的 type 属性
HTML <style> 标签
定义和用法
必需的 type 属性规定样式表的 MIME 类型。
type 属性指示 <style> 与 </style> 标签之间的内容。
值 "text/css" 指示内容是标准的 CSS。
实例
在 <style> 标签中使用 type 属性：
<html>
<head>
<style type="text/css">
h1 {color:red}
p {color:blue}
</style>
</head>

<body>
<h1>Header 1</h1>
<p>A paragraph.</p>
</body>
</html>
TIY
浏览器支持
所有主流浏览器都支持 type 属性。
语法
<style type="value">
属性值
值	描述
MIME_type	样式表的 MIME 类型。目前，唯一可能的值是 "text/css"。
■◆2490■不同媒介规定不同样式简化命令：设备■设备■HTML <style> 标签的 media 属性
HTML <style> 标签
定义和用法
media 属性用于为不同的媒介类型规定不同的样式。
提示：如需在一个 style 元素中定义一个以上的媒介类型，请使用逗号分隔的列表（例如：<style type="text/css" media="screen,projection">）。
实例
针对两种不同媒介类型的两种不同的样式（计算机屏幕和打印）：
<html>
<head>
<style type="text/css">
h1 {color:#FF0000;}
p {color:#0000FF;}
body {background-color:#FFEFD6;}
</style>

<style type="text/css" media="print">
h1 {color:#000000;}
p {color:#000000;}
body {background-color:#FFFFFF;}
</style>
</head>

<body>
<h1>Header 1</h1>
<p>A paragraph.</p>
</body>
</html>
TIY
浏览器支持
所有主流浏览器都支持 media 属性的 "screen"、"print" 以及 "all" 值。
提示：Opera 同时支持 "handheld" 值。
语法
<style media="value">
属性值
值	描述
screen	计算机屏幕（默认值）。
tty	电传打字机以及使用等宽字符网格的类似媒介。
tv	电视类型设备（低分辨率、有限的屏幕翻滚能力）。
projection	放映机。
handheld	手持设备（小屏幕、有限的带宽）。
print	打印预览模式 / 打印页。
braille	盲人用点字法反馈设备。
aural	语音合成器。
all	适合所有设备。■◆978■文档中节            简化命令：节■节■HTML <div> 标签
定义和用法
<div> 可定义文档中的分区或节（division/section）。

<div> 标签可以把文档分割为独立的、不同的部分。它可以用作严格的组织工具，并且不使用任何格式与其关联。

如果用 id 或 class 来标记 <div>，那么该标签的作用会变得更加有效。

用法
<div> 是一个块级元素。这意味着它的内容自动地开始一个新行。实际上，换行是 <div> 固有的唯一格式表现。可以通过 <div> 的 class 或 id 应用额外的样式。

不必为每一个 <div> 都加上类或 id，虽然这样做也有一定的好处。

可以对同一个 <div> 元素应用 class 或 id 属性，但是更常见的情况是只应用其中一种。这两者的主要差异是，class 用于元素组（类似的元素，或者可以理解为某一类元素），而 id 用于标识单独的唯一的元素。
■◆2519■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2519■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2519■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2519■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2519■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2519■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2519■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2519■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2519■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2519■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2519■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2519■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2519■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2519■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2519■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2519■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2519■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2519■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2519■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2519■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2519■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2519■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2519■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2519■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2519■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2519■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2519■水平对齐            简化命令：横对齐■横对齐■HTML <div> 标签的 align 属性
HTML <div> 标签
定义和用法
align 属性规定 div 元素中的内容的水平对齐方式。
实例
文档中的一个部分居中对齐：
<div align="center">
  This is some text!
</div>
TIY
浏览器支持
所有浏览器都支持 align 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 div 元素的 align 属性；在 XHTML 1.0 Strict DTD 中，不支持 div 元素的 align 属性。
请使用 CSS 代替。
CSS 语法：<div style="text-align:center">
CSS 实例：对齐 div 元素中的文本
在我们的 CSS 教程中，您可以找到更多有关 text-align 属性的细节。
语法
<div align="value">
属性值
值	描述
left	左对齐内容。
right	右对齐内容。
center	居中对齐内容。
justify	对行进行伸展，这样每行都可以有相等的长度（就像在报纸和杂志中）。
■◆978■行内元素            简化命令：有效数■有效数■HTML <span> 标签
定义和用法
<span> 标签被用来组合文档中的行内元素。
■◆978■头部                简化命令：头■头■HTML <head> 标签
定义和用法
<head> 标签用于定义文档的头部，它是所有头部元素的容器。<head> 中的元素可以引用脚本、指示浏览器在哪里找到样式表、提供元信息等等。

文档的头部描述了文档的各种属性和信息，包括文档的标题、在 Web 中的位置以及和其他文档的关系等。绝大多数文档头部包含的数据都不会真正作为内容显示给读者。

下面这些标签可用在 head 部分：<base>, <link>, <meta>, <script>, <style>, 以及 <title>。

<title> 定义文档的标题，它是 head 部分中唯一必需的元素
■◆2548■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2548■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2548■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2548■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2548■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2548■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2548■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2548■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2548■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2548■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2548■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2548■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2548■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2548■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2548■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2548■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2548■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2548■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2548■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2548■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2548■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2548■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2548■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2548■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2548■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2548■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2548■元数据信息          简化命令：元数据信息■元数据信息■一个由空格分隔的 URL 列表，这些 URL 包含着有关页面的元数据信息。■◆978■文档标题            简化命令：标题■标题■HTML <title> 标签
定义和用法
<title> 元素可定义文档的标题。

浏览器会以特殊的方式来使用标题，并且通常把它放置在浏览器窗口的标题栏或状态栏上。同样，当把文档加入用户的链接列表或者收藏夹或书签列表时，标题将成为该文档链接的默认名称。
■◆2576■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2576■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2576■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2576■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2576■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2576■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2576■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2576■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2576■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2576■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2576■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2576■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2576■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2576■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2576■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2576■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2576■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2576■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2576■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2576■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2576■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2576■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2576■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2576■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2576■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2576■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2576■文本方向            简化命令：文向■文向■规定元素中内容的文本方向。■◆2576■语言代码            简化命令：语码■语码■规定元素中内容的语言代码。■◆2576■元素内容的语言代码  简化命令：元素内容的语言代码■元素内容的语言代码■规定 XHTML 文档中元素内容的语言代码。■◆978■元信息              简化命令：元信息■元信息■HTML <meta> 标签
定义和用法
<meta> 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词。

<meta> 标签位于文档的头部，不包含任何内容。<meta> 标签的属性定义了与文档相关联的名称/值对。
■◆2606■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2606■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2606■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2606■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2606■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2606■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2606■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2606■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2606■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2606■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2606■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2606■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2606■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2606■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2606■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2606■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2606■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2606■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2606■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2606■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2606■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2606■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2606■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2606■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2606■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2606■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2606■元信息              简化命令：元信息■元信息■content 属性提供了名称/值对中的值。该值可以是任何有效的字符串。
content 属性始终要和 name 属性或 http-equiv 属性一起使用。■◆2606■HTTP 头部           简化命令：HTTP头■HTTP头■http-equiv 属性
http-equiv 属性为名称/值对提供了名称。并指示服务器在发送实际的文档之前先在要传送给浏览器的 MIME 文档头部包含名称/值对。
当服务器向浏览器发送文档时，会先发送许多名称/值对。虽然有些服务器会发送许多这种名称/值对，但是所有服务器都至少要发送一个：content-type:text/html。这将告诉浏览器准备接受一个 HTML 文档。
使用带有 http-equiv 属性的 <meta> 标签时，服务器将把名称/值对添加到发送给浏览器的内容头部。例如，添加：
<meta http-equiv="charset" content="iso-8859-1">
<meta http-equiv="expires" content="31 Dec 2008">
这样发送到浏览器的头部就应该包含：
content-type: text/html
charset:iso-8859-1
expires:31 Dec 2007
当然，只有浏览器可以接受这些附加的头部字段，并能以适当的方式使用它们时，这些字段才有意义。■◆2606■名称                简化命令：名■名■把 content 属性关联到一个名称。■◆2606■content 属性值的格式简化命令：属性值格式■属性值格式■scheme 属性
scheme 属性用于指定要用来翻译属性值的方案。此方案应该在由 <head> 标签的 profile 属性指定的概况文件中进行了定义。■◆978■所有链接的默认地址  简化命令：基本地址■基本地址■HTML <base> 标签
定义和用法
<base> 标签为页面上的所有链接规定默认地址或默认目标。

通常情况下，浏览器会从当前文档的 URL 中提取相应的元素来填写相对 URL 中的空白。

使用 <base> 标签可以改变这一点。浏览器随后将不再使用当前文档的 URL，而使用指定的基本 URL 来解析所有的相对 URL。这其中包括 <a>、<img>、<link>、<form> 标签中的 URL。
■◆2637■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2637■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2637■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2637■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2637■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2637■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2637■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2637■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2637■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2637■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2637■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2637■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2637■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2637■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2637■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2637■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2637■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2637■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2637■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2637■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2637■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2637■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2637■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2637■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2637■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2637■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2637■基准 URL            简化命令：目标■目标■HTML <base> 标签的 href 属性
HTML <base> 标签
定义和用法
href 属性规定页面中所有相对链接的基准 URL。
实例
为页面上所有相对 URL 规定基准 URL：
<head>
<base href="http://www.w3school.com.cn/i/" />
</head>

<body>
<img src="eg_smile.gif" />
</body>
TIY
语法
<base href="value">
属性值
值	描述
URL	作为基准 URL 的绝对 URL（比如 "http://www.example.com/"）。
■◆2637■何处打开            简化命令：何处■何处■HTML <base> 标签的 target 属性
HTML <base> 标签
定义和用法
target 属性规定在何处打开页面上的所有链接。
实例
为页面上所有链接规定默认目标：
<head>
<base target="_blank" />
</head>

<body>
<a href="http://www.w3school.com.cn">W3School</a>
</body>
TIY
语法
<base target="value">
属性值
值	描述
_blank	在新窗口中打开被链接文档。
_self	默认。在相同的框架中打开被链接文档。
_parent	在父框架集中打开被链接文档。
_top	在整个窗口中打开被链接文档。
framename	在指定的框架中打开被链接文档。
■◆978■默认字体、颜色或尺寸简化命令：文本属性■文本属性■HTML <basefont> 标签
定义和用法
<basefont> 标签定义基准字体。该标签可以为文档中的所有文本定义默认字体颜色、字体大小和字体系列。
■◆2666■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2666■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2666■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2666■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2666■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2666■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2666■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2666■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2666■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2666■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2666■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2666■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2666■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2666■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2666■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2666■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2666■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2666■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2666■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2666■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2666■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2666■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2666■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2666■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2666■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2666■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2666■默认颜色            简化命令：色■色■HTML <basefont> 标签的 color 属性
HTML <basefont> 标签
定义和用法
color 属性规定文档中文本的默认颜色。
实例
规定页面上的默认字体颜色：
<head>
<basefont color="red" />
</head>

<body>
<h1>This is a header</h1>
<p>This is a paragraph</p>
</body>
TIY
浏览器支持
除了 Internet Explorer，其他浏览器都不支持 color 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 basefont 元素的 color 属性；在 XHTML 1.0 Strict DTD 中，不支持 basefont 元素的 color 属性。
请使用 CSS 代替。
CSS 语法（在 <head> 部分）：<style>body{color:red}</style>
CSS 实例：为页面规定默认文本颜色
在我们的 CSS 教程中，您可以找到更多有关文本 color 属性的细节。
语法
<basefont color="value">
属性值
值	描述
color_name	规定颜色值为颜色名称的字体颜色（比如 "red"）。
hex_number	规定颜色值为十六进制值的字体颜色（比如 "#ff0000"）。
rgb_number	规定颜色值为 rgb 代码的字体颜色（比如 "rgb(255,0,0)"）。■◆2666■默认字体            简化命令：字体■字体■HTML <basefont> 标签的 face 属性
HTML <basefont> 标签
定义和用法
face 属性规定文档中文本的默认字体。
实例
规定页面上的默认字体字体：
<head>
<basefont face="courier, serif" />
</head>

<body>
<h1>This is a header</h1>
<p>This is a paragraph</p>
</body>
TIY
浏览器支持
除了 Internet Explorer，其他浏览器都不支持 face 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 basefont 元素的 face 属性；在 XHTML 1.0 Strict DTD 中，不支持 basefont 元素的 face 属性。
请使用 CSS 代替。
CSS 语法（在 <head> 部分）：<style>body{font-family: courier, serif}</style>
CSS 实例：为页面规定默认文本字体
在我们的 CSS 教程中，您可以找到更多有关 font-family 属性的细节。
语法
<basefont face="value">
属性值
值	描述
font_family	规定文本的字体。如需规定若干字体的优先表，请使用逗号将字体名称分开（比如 <basefont face="verdana,arial,sans-serif" />）。■◆2666■默认大小            简化命令：尺寸■尺寸■HTML <basefont> 标签的 size 属性
HTML <basefont> 标签
定义和用法
size 属性规定文档中文本的默认大小（字号）。
实例
规定页面上的默认字体大小：
<head>
<basefont size="7" />
</head>

<body>
<h1>This is a header</h1>
<p>This is a paragraph</p>
</body>
TIY
浏览器支持
除了 Internet Explorer，其他浏览器都不支持 size 属性。
兼容性注释
在 HTML 4.01 中，不赞成使用 basefont 元素的 size 属性；在 XHTML 1.0 Strict DTD 中，不支持 basefont 元素的 size 属性。
请使用 CSS 代替。
CSS 语法（在 <head> 部分）：<style>body{font-size: 10px}</style>
CSS 实例：为页面规定默认文本尺寸
在我们的 CSS 教程中，您可以找到更多有关 font-size 属性的细节。
语法
<basefont size="value">
属性值
值	描述
number	
规定文本尺寸。
可能的值：从 1 到 7 的数字。浏览器默认值是 3。
■◆978■客户端脚本          简化命令：客户脚本■客户脚本■HTML <script> 标签
定义和用法
<script> 标签用于定义客户端脚本，比如 JavaScript。

script 元素既可以包含脚本语句，也可以通过 src 属性指向外部脚本文件。

必需的 type 属性规定脚本的 MIME 类型。

JavaScript 的常见应用时图像操作、表单验证以及动态内容更新。
■◆2696■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2696■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2696■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2696■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2696■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2696■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2696■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2696■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2696■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2696■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2696■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2696■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2696■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2696■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2696■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2696■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2696■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2696■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2696■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2696■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2696■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2696■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2696■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2696■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2696■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2696■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2696■脚本类型            简化命令：类型■类型■HTML <script> 标签的 type 属性
HTML <script> 标签
定义和用法
必需的 type 属性规定脚本的 MIME 类型。
type 属性标识 <script> 和 </script> 标签之间的内容。
MIME 类型由两部分组成：媒介类型和子类型。对于 JavaScript，其 MIME 类型是 "text/javascript"。
type 和 language 属性
type 和 language 属性都可用来指定 <script> 标签中的脚本的类型。
language 属性在 HTML 和 XHTML 标准中受到了非议，这两个标准提倡使用 type 属性。遗憾的是，这两个属性的值是不一样的。
如果您在使用 JavaScript，可以使用下面两种属性：
language = "JavaScript"
或者：
type = "text/javascript"
您可能偶尔会看见 language 的值为 VBScript（对 type 而言是 text/vbscript），表示包含的脚本代码是用 Microsoft 的 Visual Basic Script 编写的。
利用 JavaScript，您还可以使用 language 的值 "JavaScript 1.1"，表示包含的脚本语句只能被 Netscape 3.0 或更新的版本处理。Netscape 2.0 只支持 JavaScript 1.0，而无法处理标记为 "JavaScript 1.1" 的脚本。
提示：如果您希望学习有关 JavaScript 和 VBScript 的知识，请访问我们的 JavaScript 教程和 VBScript 教程。
实例
在 HTML 页面中插入一段 JavaScript：
<script type="text/javascript">
document.write("Hello World!")
</script>
TIY
语法
<script type="value">
属性值
值	描述
MIME_type	
MIME 类型。其中一些值：
text/javascript
text/ecmascript
application/ecmascript
application/javascript
text/vbscript■◆2696■字符编码            简化命令：编码■编码■HTML <script> 标签的 charset 属性
HTML <script> 标签
定义和用法
charset 属性规定在外部脚本文件中使用的字符编码。
如果外部文件中的字符编码与主文件中的编码方式不同，就要用到 charset 属性。
默认的字符编码是 ISO-8859-1。
src 和 charset 属性
对特别长的 JavaScript 程序或者经常重复使用的程序来说，你可以希望将这些代码存放到一个单独的文件中。在这样的情况下，让浏览器通过 src 属性来载入那个单独的文件。
src 的值是包含这个 JavaScript 程序的文件的 URL。保存的文件的 MIME 类型应是 application/x-javascript，但如果文件名的后缀为 .js，也能够被正确配置了的服务器进行恰当的处理。
例如下面的语句：
<script type="text/javascript" src="/w3school.com.cn/abc.js">....</script>
上面的例子告诉支持 <script> 的浏览器从服务器上下载名为 abc.js 的 JavaScript 程序。
重要事项：请注意，尽管<script> 标签没有内容，结束的 </script> 标签也是必需的。
charset 属性与 src 属性一起使用，告诉浏览器用来编码这个 javascript 程序的字符集。它的值是任何一个 ISO 标准字符集编码的名称。
实例
定义外部脚本文件中所使用的字符编码：
<script type="text/javascript" src="myscripts.js" charset="UTF-8"></script>
TIY
语法
<script charset="value">
属性值
值	描述
character_encoding	
外部脚本文件的字符编码方式。常用的字符集有：
UTF-8 - Unicode 字符编码
ISO-8859-1 - 拉丁字母表的字符编码
如需查看所有可用的字符集，请访问我们的 字符集参考手册。■◆2696■延迟脚本            简化命令：延迟■延迟■HTML <script> 标签的 defer 属性
HTML <script> 标签
定义和用法
defer 属性规定是否对脚本执行进行延迟，直到页面加载为止。
有的 javascript 脚本 document.write 方法来创建当前的文档内容，其他脚本就不一定是了。
如果您的脚本不会改变文档的内容，可将 defer 属性加入到 <script> 标签中，以便加快处理文档的速度。因为浏览器知道它将能够安全地读取文档的剩余部分而不用执行脚本，它将推迟对脚本的解释，直到文档已经显示给用户为止。
实例
defer 属性的使用：
<script type="text/javascript" defer="defer">
alert(document.getElementById("p1").firstChild.nodeValue);
</script>
TIY
浏览器支持
只有 Internet Explorer 支持 defer 属性。
语法
<script defer="value">
属性值
值	描述
defer	延迟脚本的执行。
■◆2696■外部脚本            简化命令：路径■路径■HTML <script> 标签的 src 属性
HTML <script> 标签
定义和用法
src 属性规定外部脚本文件的 URL。
有时，我们需要在网站的多个页面中运行 JavaScript。不需要重复编写相同的脚本，只需在单独的文件中创建 JavaScript，并以 .js 为后缀保存，然后使用 <script> 标签中的 src 属性引用该文件即可。
注释：外部文件不能包含 <script> 标签！
实例
链接一个外部脚本文件：
<script type="text/javascript" src="myscripts.js"></script>
TIY
语法
<script src="value">
属性值
值	描述
URL	
外部脚本的 URL。可能的值有：
绝对 URL - 指向其他站点（比如 src="www.example.com/example.js"）
相对 URL - 指向站点内的文件（比如 src="/scripts/example.js"）
■◆978■针对不支持客户端脚本替代内容简化命令：否脚本■否脚本■HTML <noscript> 标签
定义和用法
noscript 元素用来定义在脚本未被执行时的替代内容（文本）。

此标签可被用于可识别 <script> 标签但无法支持其中的脚本的浏览器。
■◆978■嵌入的 applet       简化命令：嵌入的 applet■嵌入的 applet■HTML <applet> 标签
定义和用法
定义嵌入的 applet。
实例
一个嵌入的 Java applet：

<applet code="Bubbles.class" width="350" height="350">
Java applet that draws animated bubbles.
</applet>
浏览器支持
某些浏览器中依然存在对 <applet> 标签的一些支持，但是需要额外的插件和安装过程才能起作用。
HTML 与 XHTML 之间的差异
在 HTML 4.01 中，不赞成使用 applet 元素；在 XHTML 1.0 Strict DTD 中，不支持 applet 元素。
提示和注释：
提示：如需包含 applet，请尽可能地使用 object 元素（因为在 XHTML 1.0 Strict DTD 中，applet 元素不被支持）。
■◆978■嵌入对象            简化命令：对象■对象■HTML <object> 标签
定义和用法
定义一个嵌入的对象。请使用此元素向您的 XHTML 页面添加多媒体。此元素允许您规定插入 HTML 文档中的对象的数据和参数，以及可用来显示和操作数据的代码。

<object> 标签用于包含对象，比如图像、音频、视频、Java applets、ActiveX、PDF 以及 Flash。

object 的初衷是取代 img 和 applet 元素。不过由于漏洞以及缺乏浏览器支持，这一点并未实现。

浏览器的对象支持有赖于对象类型。不幸的是，主流浏览器都使用不同的代码来加载相同的对象类型。

而幸运的是，object 对象提供了解决方案。如果未显示 object 元素，就会执行位于 <object> 和 </object> 之间的代码。通过这种方式，我们能够嵌套多个 object 元素（每个对应一个浏览器）。
■◆2729■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2729■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2729■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2729■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2729■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2729■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2729■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2729■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2729■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2729■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2729■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2729■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2729■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2729■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2729■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2729■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2729■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2729■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2729■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2729■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2729■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2729■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2729■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2729■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2729■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2729■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2729■对齐方式            简化命令：横对齐■横对齐■定义围绕该对象的文本对齐方式。■◆2729■档案文件            简化命令：档案文件■档案文件■archive 属性
因为性能方面的原因，可以选择预先下载包含一个或多个档案中的对象集。对基于 Java 的应用程序来说尤其是这样，在这些应用程序中，一个 Java 类将会依赖于很多其他类才能完成它的工作。
archive 属性的值是一个用引号括起来的 URL 列表，其中每个 URL 都指向一个在显示或执行对象之前浏览器需要加载的档案文件。■◆2729■周围边框            简化命令：边框■边框■定义对象周围的边框。■◆2729■类的 ID 值          简化命令：类的 ID 值■类的 ID 值■classid 属性
classid 属性用于指定浏览器中包含的对象的位置，通常是一个 Java 类。
它的值是对象的绝对或相对的 URL。如果提供了 codebase 属性的话，相对 URL 是相对于 codebase 属性指定的 URL 而言的；否则，它们是相对于当前文档的 URL。
例如，为了执行包含在 clock.class 文件中的时间 Java applet，可以在 HTML 文档中包含如下的代码：
<object classid="clock.class"></object>
浏览器将会用当前文档的基本 URL 为这个 applet 查找代码。因此，如果当前文档的 URL 如下所示：
http://www.w3school.com.cn/time.html
浏览器将会在下列地址为我们的 clock.class 实例获取 applet 代码：
http://www.w3school.com.cn/clock.class
提示：classid 属性与 <applet> 标签的 code 属性类似，提供了包含这个对象的文件名。■◆2729■基准 URL            简化命令：基准URL■基准URL■codebase 属性
codebase 属性是一个可选的属性，提供了一个基本的 URL。该属性的值是一个 URL，该 URL 指向的目录包含了 classid 属性所引用的对象。
codebase URL 会覆盖文档的基本 URL，但不会永久替代它。如果不使用 codebase 属性，这个基本 URL 就是默认值。
现在，我们继续使用前面的那个例子，假设文档来源于 http://www.w3school.com.cn，但是这个时钟 applet 放在一个名为 classes 的单独目录中。通过指定 classid= "classes/clock.class" 无法获得这个 applet。相反，需要将 codebase 属性和新的基本 URL 包含在内：
<object classid="clock.class" codebase="http://www.w3school.com.cn/classes/">
</object>
这行语句可以解析为这个 URL：
http://www.w3school.com.cn/classes/clock.class
尽管我们在此例中使用了绝对 URL，实际上也可以使用相对 URL。例如，applet 往往和主机文档一起保存在同一台服务器上，因此，处于重新定位的缘故，为 codebase 指定一个相对的 URL，情况往往更好一些，例如：
<object classid="clock.class" codebase="/classes/">
</object>
提示：从以上几个例子可以看到，codebase 属性与 classid 属性配合使用，可以指定对象的完整 URL。■◆2729■代码类型            简化命令：代码类型■代码类型■codetype 属性
codetype 属性用于标识程序代码类型。
只有在浏览器无法根据 classid 属性决定 applet 的 MIME 类型，或者如果在下载某个对象时服务器没有传输正确的 MIME 类型的情况下，才需要使用 codetype 属性。
codetype 属性与 type 属性类似。不同的是，它用来标识程序代码类型，而 type 属性用来标识数据文件类型。
下面这个例子显式地告知浏览器，对象的代码是 Java：
<object codebase="clock.class" codetype="application/java">
</object>■◆2729■对象数据URL         简化命令：对象数据URL■对象数据URL■data 属性
data 属性用于指定供对象处理的数据文件的 URL。
该属性的值是文件的 URL，该 URL 可能是相对于文件基本 URL 的绝对 URL 或相对 URL，或者是相对于用 codebase 属性提供的 URL 的绝对或相对 URL。
浏览器通过插入到文档中的对象类型来决定数据的类型。
该属性类似于 <img> 标签中的 src 属性，因为它下载的是要由包含对象进行处理的数据。当然，它们之间的差别在于，data 属性允许包含几乎任何文件类型，而不仅仅是图像文件。■◆2729■延迟下载            简化命令：延迟下载■延迟下载■declare 属性
declare 属性可以定义一个对象，但同时防止浏览器进行下载和处理。
与 name 属性一起使用时，这个工具类似于更为传统的编程语言中的某种前置声明，这样的声明能够延迟下载对象的时间，直到这个对象确实在文档中得到了应用。■◆2729■高度                简化命令：高■高■定义对象的高度。■◆2729■水平空白            简化命令：横空白■横空白■定义对象周围水平方向的空白■◆2729■名称                简化命令：名■名■为对象定义唯一的名称（以便在脚本中使用）。■◆2729■加载所显示文本      简化命令：加载所显示文本■加载所显示文本■定义当对象正在加载时所显示的文本。■◆2729■数据类型            简化命令：类型■类型■定义被规定在 data 属性中指定的文件中出现的数据的 MIME 类型。■◆2729■客户端图像映射      简化命令：客户映射■客户映射■规定与对象一同使用的客户端图像映射的 URL。■◆2729■垂直方向空白        简化命令：竖空白■竖空白■定义对象的垂直方向的空白。■◆2729■宽度                简化命令：宽■宽■定义对象的宽度。■◆978■对象参数            简化命令：对象参数■对象参数■HTML <param> 标签
定义和用法
param 元素允许您为插入 XHTML 文档的对象规定 run-time 设置，也就是说，此标签可为包含它的 <object> 或者 <applet> 标签提供参数。
■◆2772■类名                简化命令：类■类■HTML class 属性
HTML 标准属性
实例
在 HTML 文档中使用 class 属性：
<html>
<head>
<style type="text/css">
h1.intro {color:blue;}
p.important {color:green;}
</style>
</head>

<body>
<h1 class="intro">Header 1</h1>
<p>A paragraph.</p>
<p class="important">Note that this is an important paragraph.</p>
</body>
</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
class 属性规定元素的类名（classname）。
class 属性大多数时候用于指向样式表中的类（class）。不过，也可以利用它通过 JavaScript 来改变带有指定 class 的 HTML 元素。
提示和注释
注释：class 属性不能在以下 HTML 元素中使用：base, head, html, meta, param, script, style 以及 title。
提示：可以给 HTML 元素赋予多个 class，例如：<span class="left_menu important">。这么做可以把若干个 CSS 类合并到一个 HTML 元素。
提示：类名不能以数字开头！只有 Internet Explorer 支持这种做法。
浏览器支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element class="value">
属性值
值	描述
classname	规定元素的类的名称。如需为一个元素规定多个类，用空格分隔类名。
■◆2772■标识                简化命令：标■标■HTML id 属性
HTML 标准属性
实例
通过 JavaScript 利用 id 属性来改变一段文本：
<html>
<head>
<script type="text/javascript">
function change_header()
{
document.getElementById("myHeader").innerHTML="Nice day!";
}
</script>
</head>

<body>
<h1 id="myHeader">Hello World!</h1>
<button onclick="change_header()">Change text</button>
</body>

</html>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
id 属性规定 HTML 元素的唯一的 id。
id 在 HTML 文档中必须是唯一的。
id 属性可用作链接锚（link anchor），通过 JavaScript（HTML DOM）或通过 CSS 为带有指定 id 的元素改变或添加样式。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element id="value">
属性值
值	描述
id	规定元素的唯一 id。
亲自试一试 - 实例
向 HTML 元素添加唯一的 id
如何向 HTML 元素添加 id 属性。
在 CSS 中使用 id 属性
如何在 CSS 中使用 id 属性■◆2772■提示文本            简化命令：标题■标题■HTML title 属性
HTML 标准属性
实例
在 HTML 文档中使用 title 属性：
<abbr title="People's Republic of China">PRC</abbr> was founded in 1949.
<p title="Free Web tutorials">W3School.com.cn</p>
亲自试一试
（可以在本页底部找到更多实例）
定义和用法
title 属性规定关于元素的额外信息。
这些信息通常会在鼠标移到元素上时显示一段工具提示文本（tooltip text）。
提示：title 属性常与 form 以及 a 元素一同使用，以提供关于输入格式和链接目标的信息。同时它也是 abbr 和 acronym 元素的必需属性。
支持
W3C: "W3C" 列指示 W3C 的 HTML/XHTML 推荐标准中是否定义了该属性。
IE	Firefox	Opera	Safari	W3C
YES	YES	YES	YES	YES
语法
<element title="value">
属性值
值	描述
text	规定元素的工具提示文本（tooltip text）。
■◆2772■文本方向            简化命令：文向■文向■HTML dir 属性
HTML 标准属性
实例
一段方向从右向左的段落：
<p dir="rtl">Write this text right-to-left!</p>
亲自试一试
浏览器支持
所有浏览器均支持 dir 属性。
定义和用法
dir 属性规定元素内容的文本方向。
提示和注释
注释：dir 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element dir="ltr|rtl">
属性值
值	描述
ltr	默认。从左向右的文本方向。
rtl	从右向左的文本方向。
■◆2772■语言代码            简化命令：语码■语码■HTML lang 属性
HTML 标准属性
实例
段落中的一些法文：
<p lang="fr">Ceci est un paragraphe.</p>
亲自试一试
浏览器支持
所有浏览器均支持 lang 属性。
定义和用法
lang 属性规定元素内容的语言。
提示和注释
注释：lang 属性在以下标签中无效：<base>, <br>, <frame>, <frameset>, <hr>, <iframe>, <param> 以及 <script>。
语法
<element lang="language_code">
属性值
值	描述
language_code	规定元素内容的语言代码。语言代码参考■◆2772■元素快捷键          简化命令：快键■快键■HTML accesskey 属性
HTML 标准属性
实例
带有指定快捷键的超链接：
<a href="http://www.w3school.com.cn/html/" accesskey="h">HTML</a><br />
<a href="http://www.w3school.com.cn/css/" accesskey="c">CSS</a>
亲自试一试
浏览器支持
几乎所有浏览器均 accesskey 属性，除了 Opera。
定义和用法
accesskey 属性规定激活（使元素获得焦点）元素的快捷键。
提示和注释
注释：以下元素支持 accesskey 属性：<a>, <area>, <button>, <input>, <label>, <legend> 以及 <textarea>。
语法
<element accesskey="character">
属性值
值	描述
character	规定激活（使元素获得焦点）元素的便捷按键。
■◆2772■tab键控制次序       简化命令：tab次序■tab次序■HTML 标准属性
实例
带有指定 tab 键顺序的链接：
<a href="http://www.w3school.com.cn/" tabindex="2">W3School</a><br />
<a href="http://www.google.com/" tabindex="1">Google</a><br />
<a href="http://www.microsoft.com/" tabindex="3">Microsoft</a>
亲自试一试
浏览器支持
几乎所有浏览器均 tabindex 属性，除了 Safari。
定义和用法
tabindex 属性规定元素的 tab 键控制次序（当 tab 键用于导航时）。
提示和注释
注释：以下元素支持 tabindex 属性：<a>, <area>, <button>, <input>, <object>, <select> 以及 <textarea>。
语法
<element tabindex="number">
属性值
值	描述
number	规定元素的 tab 键控制次序（1 是第一个）。■◆2772■文档被载入          简化命令：载入■载入■当文档被载入时执行脚本■◆2772■文档被卸下          简化命令：卸下■卸下■当文档被卸下时执行脚本■◆2772■元素改变            简化命令：改变■改变■当元素改变时执行脚本■◆2772■表单被提交          简化命令：提交■提交■当表单被提交时执行脚本■◆2772■表单被重置          简化命令：重置■重置■当表单被重置时执行脚本■◆2772■元素被选取          简化命令：选取■选取■当元素被选取时执行脚本■◆2772■元素失去焦点        简化命令：失焦■失焦■当元素失去焦点时执行脚本■◆2772■元素获得焦点        简化命令：得焦■得焦■当元素获得焦点时执行脚本■◆2772■图像加载中断        简化命令：载断■载断■当图像加载中断时执行脚本■◆2772■键盘被按下          简化命令：键按■键按■当键盘被按下时执行脚本■◆2772■按下后又松开        简化命令：按松■按松■当键盘被按下后又松开时执行脚本■◆2772■键盘被松开          简化命令：键松■键松■当键盘被松开时执行脚本■◆2772■鼠标被单击          简化命令：单击■单击■当鼠标被单击时执行脚本■◆2772■鼠标被双击          简化命令：双击■双击■当鼠标被双击时执行脚本■◆2772■鼠标按钮被按下      简化命令：鼠按■鼠按■当鼠标按钮被按下时执行脚本■◆2772■鼠标移动            简化命令：鼠移■鼠移■当鼠标指针移动时执行脚本■◆2772■鼠标移出            简化命令：鼠出■鼠出■当鼠标指针移出某元素时执行脚本■◆2772■鼠标悬停            简化命令：鼠悬■鼠悬■当鼠标指针悬停于某元素之上时执行脚本■◆2772■鼠标按钮被松开      简化命令：鼠松■鼠松■当鼠标按钮被松开时执行脚本■◆2772■名称                简化命令：名■名■定义参数的名称（用在脚本中）。■◆2772■参数类型            简化命令：类型■类型■规定参数的 MIME 类型（internet media type）。■◆2772■参数的值            简化命令：值■值■规定参数的值。■◆2772■值的类型            简化命令：值类型■值类型■规定值的 MIME 类型。■◆