入门
概述
JavaScript 是一种具有函数优先的轻量级，解释型或即时编译型的编程语言，是一种被嵌入HTML网页之中的基于对象和事件驱动编程的脚本语言。脚本实际上是一段程序，用来完成某些特殊功能。
JavaScript功能：1、可以将文本动态的放入HTML页面。2、可以对事件做出响应。3、可以读写HTML元素。4、可被用来验证用户输入的数据。5、可被用来检测访问者的浏览器，并根据所检测到的浏览器，为这个浏览器载入相应的页面。6、可被用来创建cookies，用来存储和取回位于访问者的计算机中的信息。7、可利用Ajax技术来完成和服务器的直接通信，无刷新的修改当前HTML页面内容。
目前JavaScript 使用 Unicode 字符集。JavaScript 运行在客户端浏览器中的。每一个浏览器都有JavaScript的解析引擎，不需要编译，直接就可以被浏览器解析执行了
JavaScript是弱类型语言，在开辟变量存储空间时，不定义空间将来的存储数据类型，可以存放任意类型的数据。变量的数据类型可以任意转换。
JavaScript是严格区分大小写的，也就是abc和Abc会被解析器认为是两个不同的东西。
JavaScript 内置了一些对象的标准库，比如数组（Array），日期（Date），数学（Math）和一套核心语句，包括运算符、流程控制符以及声明方式等。JavaScript 的核心部分可以通过添加对象来扩展语言以适应不同用途；例如：
客户端的 JavaScript 通过提供对象，控制浏览器及其文档对象模型（DOM），来扩展语言核心。例如：客户端的拓展代码允许应用程序将元素放在某个 HTML 表单中，并且支持响应用户事件，比如鼠标点击、表单提交和页面导航。
服务端的 JavaScript 则通过提供有关在服务器上运行 JavaScript 的对象来可扩展语言核心。例如：服务端版本直接支持应用和数据库通信，提供应用不同调用间的信息连续性，或者在服务器上执行文件操作。
这意味着，在浏览器中，JavaScript 可以改变网页（DOM）的外观与样式。同样地，在服务器上，Node.js 中的 JavaScript 可以对浏览器上编写的代码发出的客户端请求做出响应。
使用
基本语法：<script type="text/javascript" [src= “外部js文件”]> …</script>
语法说明：（1）script：脚本标记。它必须以<script type="text/javascript">开头，以<script>结束，界定程序开始的位置和结束的位置。（2）script在页面中的位置决定了什么时候装载它们，如果希望在其他所有内容之前装载脚本，就要确保脚本在head部分。（3）src属性不是必要的。它指定了一个要加载的外部js代码文件，一旦应用了这个属性，则<script>标签中的任何内容都将被忽略。
JavaScript程序本身不能独立存在，它是依附于某个HTML页面，在浏览器端运行的。
1、位于head部分的脚本 如果把脚本放置到head部分，在页面载入的时候，就同时载入了代码。通常这个区域的JavaScript代码是为body区域程序代码所调用的事件处理函数。
2、位于body部分的脚本 放置于body中的脚本，通常是一些在页面载入时需要同时执行的一些脚本，这些代码执行后的输出就成为页面的内容，在浏览器中可以即时看到。
3、直接位于事件处理部分的代码中。
4、位于网页之外的单独脚本文件
注释
- 单行注释：//
- 多行注释：/* */
调试
快捷键：shift+ctrl+i或者F12
输出
document.write("Hello,World!");//页面输出
console.log("Hello,World!");//控制台输出
程序
JavaScript脚本语言的基本构成是由语句、函数、对象、方法、属性等来实现编程的，在程序结构上同样是有顺序、分支和循环三种基本结构。
JavaScript语句是发给浏览器的命令，这些命令的作用是告诉浏览器要做的事情。1. 语句 在JavaScript程序中，语句的类型一般包括：（1）变量声明语句。（2）输入输出语句。（3）表达式语句。（4）程序流向控制语句。（5）返回语句。
语句块就是用“{”和“}”封闭起来的若干条语句。
代码就是由若干条语句或语句块构成的执行体。浏览器按照代码编写的逻辑顺序逐行执行，直至碰到结束符号或者返回语句。
函数
avaScript的函数有系统本身提供的内部函数，也有系统对象定义的函数，还包括程序员自定义的函数。一个函数代表了一个特定的功能。
-
函数的构成
基本语法：
function 函数名(参数1, 参数2, ... 参数N) {函数体;}语法说明：
（1）function是关键字，组成一个函数必须有function关键字开始。
（2）函数名用来在调用时使用，命名必须符合有关标识符的命名规则。
（3）一个函数可以没有参数，但括号必须保留，函数也可以有1到多个参数，声明参数不必明确类型。
（4）大括号界定了函数的函数体 -
函数声明时的参数
形参：用来接收函数调用者传递过来的参数。
实参：函数调用时的实际参数值。
-
调用函数函数必须被调用才能发挥作用，前面多个程序已经展示了函数的调用过程。具体调用规则是：（1）函数必须通过名字加上括号才能调用。（2）函数调用时，必须满足参数传递的要求，按照形式参数的声明要求，保证类型、顺序和个数（不是必须的）的统一。
-
用return返回函数的计算结果 函数可以在执行后返回一个值来代表执行后的结果，当然有些函数基于功能的需要并不需要返回任何值。函数返回一个值非常简单，一般在一个函数代码的最后一行是return语句。 当然，一个函数也可以没有返回值，但并不妨碍最后添加一条return语句，明确表示函数执行结束，如show函数一样。
-
函数的作用域
（1）局部变量 当代码在函数内声明了一个变量后，就只能在该函数中访问该变量，它们被称为“局部变量”。当退出该函数后，这个变量会被撤销。可以在不同的函数中使用名称相同的局部变量而互不影响，这是因为一个函数能够识别它自己内部定义的每个变量。
（2）全局变量 如果程序在函数之外声明了一个变量，则页面上的所有函数都可以访问该变量，它们被称为“全局变量”。这些变量的生存期从声明它们之后开始，在页面关闭时结束。
-
常用系统函数 系统函数又称内部方法，与任何对象无关，可直接使用。
返回字符串表达式中的值：eval()函数；返回字符的编码：escape()函数；返回字符串ASCII码：unescape()函数；返回实数：parseFloat()函数；返回不同进制的数：parseInt()函数；判断是否为非数值：isNaN()函数
对话框
-
弹出对话框
方法：alert(“文本”)
功能：实现了一个简单的信息告知的功能。
-
确认框方法：confirm(“文本”)
功能：确认框是一个带有显示信息和“ok/确认”及“cancel/取消”两个按钮对话框，用户可以验证或者接受某些信息。当确认框出现后，用户需要单击确定或者取消按钮才能继续进行操作。如果用户单击确认，那么返回值为 true。如果用户单击取消，那么返回值为 false。
-
提示框方法：prompt(“文本”,“默认值”)
功能：提示框经常用于提示用户在进入页面前输入某个值。当提示框出现后，用户需要输入某个值，然后单击“ok/确认”或“cancel/取消”按钮才能继续操纵。如果用户单击确认，那么返回值为输入的值。如果用户单击取消，那么返回值为 null
变量和运算
变量
命名规定
-
标识符 JavaScript关于标识符的规定有：（1）必须使用字母或者下划线开始。（2）必须使用英文字母、数字、下划线组成，不能出现空格或制表符。（3）不能使用JavaScript关键词与JavaScript保留字。（4）不能使用JavaScript语言内部的单词，比如Infinity，NaN，undefined。（5）大小写敏感，也就是说x和X是不一样的两个标识符。 作为命名的一种规定，如同起名一样，也是要很慎重的。总的来讲，标识符的确定应该做到“见名知意”。
-
关键字 关键字对于JavaScript程序有着特别的含义，它们可标识程序的结构和功能，所以，在编写代码时，不能用它们作为自定义的变量名或者函数名。
-
保留字 除了关键字，JavaScript还有一些可能未来扩展时使用的保留字，同样不能用于标识符的定义。
JavaScript 保留关键字
Javascript 的保留关键字不可以用作变量、标签或者函数名。有些保留关键字是作为 Javascript 以后扩展使用。
| abstract | arguments | boolean | break | byte |
| case | catch | char | class* | const |
| continue | debugger | default | delete | do |
| double | else | enum* | eval | export* |
| extends* | false | final | finally | float |
| for | function | goto | if | implements |
| import* | in | instanceof | int | interface |
| let | long | native | new | null |
| package | private | protected | public | return |
| short | static | super* | switch | synchronized |
| this | throw | throws | transient | true |
| try | typeof | var | void | volatile |
| while | with | yield |
注：标记的关键字是 ECMAScript5 中新添加的。
JavaScript 对象、属性和方法名
您也应该避免使用 JavaScript 内置的对象、属性和方法的名称作为 Javascript 的变量或函数名
| Array | Date | eval | function | hasOwnProperty |
| Infinity | isFinite | isNaN | isPrototypeOf | length |
| Math | NaN | name | Number | Object |
| prototype | String | toString | undefined | valueOf |
Java 保留关键字
JavaScript 经常与 Java 一起使用。您应该避免使用一些 Java 对象和属性作为 JavaScript 标识符。
| getClass | java | JavaArray | javaClass | JavaObject | JavaPackage |
其他保留词
JavaScript 能够在很多应用程序中被用作编程语言。还应该避免使用 HTML 和 Window 对象和属性的名称。在 HTML 中，必须（为了可移植性，您也应该这么做）避免使用 HTML 和 Windows 对象和属性的名称作为 Javascript 的变量及函数名。
| alert | all | anchor | anchors | area |
| assign | blur | button | checkbox | clearInterval |
| clearTimeout | clientInformation | close | closed | confirm |
| constructor | crypto | decodeURI | decodeURIComponent | defaultStatus |
| document | element | elements | embed | embeds |
| encodeURI | encodeURIComponent | escape | event | fileUpload |
| focus | form | forms | frame | innerHeight |
| innerWidth | layer | layers | link | location |
| mimeTypes | navigate | navigator | frames | frameRate |
| hidden | history | image | images | offscreenBuffering |
| open | opener | option | outerHeight | outerWidth |
| packages | pageXOffset | pageYOffset | parent | parseFloat |
| parseInt | password | pkcs11 | plugin | prompt |
| propertyIsEnum | radio | reset | screenX | screenY |
| scroll | secure | select | self | setInterval |
| setTimeout | status | submit | taint | text |
| textarea | top | unescape | untaint | window |
数据类型
JavaScript是一种动态类型语言(dynamically typed language)。这意味着你在声明变量时可以不必指定数据类型，而数据类型会在代码执行时会根据需要自动转换。
使用typeof操作符可以用来检查一个变量的数据类型。
最新的 ECMAScript 标准定义了8种数据类型：
原始数据类型(基本数据类型)
七种基本数据类型:
-
布尔值（Boolean），有2个值分别是：true 和 false.
-
null ， 一个表明 null 值的特殊关键字。 JavaScript 是大小写敏感的，因此 null 与 Null、NULL或变体完全不同。
-
undefined ，和 null 一样是一个特殊的关键字，undefined 表示变量未赋值时的属性。
数字（Number），整数或浮点数。 -
任意精度的整数 (BigInt) ，可以安全地存储和操作大整数，甚至可以超过数字的安全整数限制。
-
字符串（String），字符串是一串表示文本值的字符序列。
-
Symbol ( 在 ECMAScript 6 中新添加的类型).。一种实例是唯一且不可改变的数据类型。
引用数据类型：对象（Object）
字符串
parseInt()和parseFloat()方法可以将内存中表示一个数字的字符串转换为对应的数字。
通过在引号前加上反斜线’'，可以在字符串中插入引号，这就是引号转义。
JavaScript 特殊字符
| 字符 | 意思 |
|---|---|
| \0 | Null字节 |
| \b | 退格符 |
| \f | 换页符 |
| \n | 换行符 |
| \r | 回车符 |
| \t | Tab (制表符) |
| \v | 垂直制表符 |
| ’ | 单引号 |
| " | 双引号 |
| \ | 反斜杠字符（\） |
| \XXX | 由从0到377最多三位八进制数XXX表示的 Latin-1 字符。例如，\251是版权符号的八进制序列。 |
| \xXX | 由从00和FF的两位十六进制数字XX表示的Latin-1字符。例如，\ xA9是版权符号的十六进制序列。 |
| \uXXXX | 由四位十六进制数字XXXX表示的Unicode字符。例如，\ u00A9是版权符号的Unicode序列。见Unicode escape sequences (Unicode 转义字符). |
| \u{XXXXX} | Unicode代码点 (code point) 转义字符。例如，\u{2F804} 相当于Unicode转义字符 \uD87E\uDC04的简写。 |
数组
数组字面值是一个封闭在方括号对[]中的包含有零个或多个表达式的列表，其中每个表达式代表数组的一个元素。当你使用数组字面值创建一个数组时，该数组将会以指定的值作为其元素进行初始化，而其长度被设定为元素的个数。
声明时不必列举数组字面值中的所有元素。若你在同一行中连写两个逗号（,），数组中就会产生一个没有被指定的元素，其初始值是undefined。
NULL
一般使用IsNull()判空
变量
JavaScript 变量是存储数据值的容器。
声明变量
- 使用关键词 var 。例如 var x = 1。这个语法可以用来声明局部变量和全局变量。var可以重写已经声明的变量，这可能会导致错误的输出。
- 使用关键词 let 。例如 let y = 1。这个语法可以用来声明块作用域的局部变量。let在同一作用域声明已经声明过的变量会报错。
- 使用关键词 const。例如const z=1。用 const定义的变量是只读的，也就是常量。试图重新赋值或者使用var重新声明都会报错。当遇到对象时，只读的 const 允许我们修改或重新赋值对象的属性，但变量本身的引用（内存中的引用地址）不可以修改，也就是不能对这个变量重新赋值。
注：用 var 或 let 语句声明的变量，如果没有赋初始值，则其值为 undefined 。
作用域
JavaScript 函数作用域
在 JavaScript 中有两种作用域类型：
局部作用域
全局作用域
JavaScript 拥有函数作用域：每个函数创建一个新的作用域。
作用域决定了这些变量的可访问性（可见性）。
函数内部定义的变量从函数外部是不可访问的（不可见的）。
局部 JavaScript 变量
在 JavaScript 函数中声明的变量，会成为函数的局部变量。
局部变量的作用域是局部的：只能在函数内部访问它们。
// 此处的代码不能使用 carName 变量
function myFunction() {
var carName = "porsche";
// 此处的代码能使用 carName 变量
}
由于只能在函数内部识别局部变量，因此能够在不同函数中使用同名变量。
在函数开始时会创建局部变量，在函数完成时会删除它们。
全局 JavaScript 变量
函数之外声明的变量，会成为全局变量。
全局变量的作用域是全局的：网页的所有脚本和函数都能够访问它。
var carName = " porsche";
// 此处的代码能够使用 carName 变量
function myFunction() {
// 此处的代码也能够使用 carName 变量
}
运算
JavaScript运算符包括：算术运算符、赋值运算符、关系运算符、逻辑运算符、条件运算符、逗号运算符、位运算符，也可以根据运算符需要操作数的个数，可以把运算符分为一元运算符、二元运算符或者三元运算符。 由操作数（变量、常量、函数调用等）和运算符结合在一起构成的式子称为“表达式”。对应的表达式包括：算术表达式、赋值表达式、关系表达式、逻辑表达式、条件表达式、逗号表达式、位表达式
运算符
算术运算符
| 运算符 | 描述 |
|---|---|
| + | 加法 |
| - | 减法 |
| * | 乘法 |
| / | 除法 |
| % | 系数 |
| ++ | 递加 |
| -- | 递减 |
比较运算符
| 运算符 | 描述 |
|---|---|
| == | 等于 |
| === | 等值等型 |
| != | 不相等 |
| !== | 不等值或不等型 |
| > | 大于 |
| < | 小于 |
| >= | 大于或等于 |
| <= | 小于或等于 |
| ? | 三元运算符 |
逻辑运算符
| 运算符 | 描述 |
|---|---|
| && | 逻辑与 |
| || | 逻辑或 |
| ! | 逻辑非 |
类型运算符
| 运算符 | 描述 |
|---|---|
| typeof | 返回变量的类型。 |
| instanceof | 返回 true，如果对象是对象类型的实例。 |
位运算符
| 运算符 | 描述 | 例子 | 等同于 | 结果 | 十进制 |
|---|---|---|---|---|---|
| & | 与 | 5 & 1 | 0101 & 0001 | 0001 | 1 |
| | | 或 | 5 | 1 | 0101 | 0001 | 0101 | 5 |
| ~ | 非 | ~ 5 | ~0101 | 1010 | 10 |
| ^ | 异或 | 5 ^ 1 | 0101 ^ 0001 | 0100 | 4 |
| << | 零填充左位移 | 5 << 1 | 0101 << 1 | 1010 | 10 |
| >> | 有符号右位移 | 5 >> 1 | 0101 >> 1 | 0010 | 2 |
| >>> | 零填充右位移 | 5 >>> 1 | 0101 >>> 1 | 0010 | 2 |
赋值
具体在为变量赋值时，需要注意：（1）变量名在赋值运算符“=”符号的左边，而需要向变量赋的值在“=”的右侧；（2）一个变量在声明后，可以多次被赋值或使用；（3）可以向一个变量随时赋值，而且可以赋以不同类型的值。注意：虽然一个变量在一个代码段中可以被赋予不同类型的值，但实际中要杜绝这样赋值，因为容易导致对代码理解上的混乱。
| 运算符 | 例子 | 等同于 |
|---|---|---|
| = | x = y | x = y |
| += | x += y | x = x + y |
| -= | x -= y | x = x - y |
| *= | x *= y | x = x * y |
| /= | x /= y | x = x / y |
| %= | x %= y | x = x % y |
| <<= | x <<= y | x = x << y |
| >>= | x >>= y | x = x >> y |
| >>>= | x >>>= y | x = x >>> y |
| &= | x &= y | x = x & y |
| ^= | x ^= y | x = x ^ y |
| |= | x |= y | x = x | y |
| **= | x **= y | x = x ** y |
控制结构
JavaScript程序设计分为两种方式：面向过程程序设计与基于对象程序设计。每种方法都是对数据结构与算法的描述。数据结构包括前面介绍的各种数据类型以及后面将要介绍的更复杂的引用类型，而算法则比较简单，任何算法都可以由最基本的顺序、分支和循环三种结构组成。
顺序
顺序程序是最基本的程序设计思路。顺序程序执行是按照语句出现的顺序一步一步从上到下运行，直到最后一条语句。从总体上看，任何程序都是按照语句出现的先后顺序，被逐句执行
循环
JavaScript提供了for、while、do…while和for…in四种循环结构满足不同的循环情况。
break和continue的作用
有时在循环中，可能碰到一些需要提前中止循环的情况，或者放弃某次循环的情况。（1）break语句 break语句的作用就是立即结束循环，转到循环后的语句继续执行。（2）continue语句 continue语句的作用则是结束本次循环，开始下一次的循环。
选择
在编写代码时，经常需要根据不同的条件完成不同的行为。可以在代码中使用条件语句来完成这个任务。 在 JavaScript 中，可以使用下面几种条件语句：if 语句：在一个指定的条件成立时执行代码。if…else 语句：在指定的条件成立时执行代码，当条件不成立时执行另外的代码。if…else if…else 语句：使用这个语句可以选择执行若干块代码中的一个。switch 语句：使用这个语句可以选择执行若干块代码中的一个。
对象
JavaScript的对象类型简单的来分，JavaScript的对象类型可以分为4类：（1）JavaScript本地对象（Native Object），本身提供的类型，如Math等，这种对象无需具体定义，直接就可以通过名称引用它们的属性和方法，如Math.Random()。（2）JavaScript的内建对象（Built-in Object），如Array，String等，这些对象独立于宿主环境，在JavaScript程序内由程序员声明具体对象，并可以通过对象名来使用。（3）宿主对象（Host Object）是被浏览器支持的，目的是为了能和被浏览的文档乃至浏览器环境交互，如document，window和frames等。（4）自定义对象，是程序员基于需要自己定义的对象类型。
对象是对个数据的封装体；用来保存多个数据的容器；一个对象代表现实中的一个事物
对象统一管理多个数据
对象的组成
1. 属性 属性名（字符串）和属性值组成
2. 方法 ：一种特别的属性（属性值是函数）
如何访问内部数据
1. 属性名（简单类型）
2. ['属性名']（属性名包含特殊符号，属性名不确定）
JavaScript 里的对象就是普通名值对的集合。创建一个普通对象有两种方式。
第一种方式是：
var obj = new Object();
第二种方式是：
var obj = {};
也可以这样创建一个完整的对象：
obj = {
name: {
first: 'Gandalf',
last: 'the Grey'
},
address: 'Middle Earth'
};
可以看到，声明 JavaScript 对象时，键值对中的键就是对象的属性，值就是对应属性的值。
在本书中，我们创建的所有的类，如 Stack、Set、LinkedList、Dictionary、Tree、Graph
等，都是 JavaScript 对象。
在面向对象编程（OOP）中，对象是类的实例。一个类定义了对象的特征。我们会创建很多
类来表示算法和数据结构。
核心对象
JavaScript 的核心对象包括：Array，Boolean，Date，Function，Math，Number，Object 和 String等。这些对象同时在客户端和服务器端的 JavaScript 中使用。
Array
数组对象用来在单独的变量名中存储一系列的值，一般用在需要对一批同类的数据逐个进行一样的处理中。1）定义数组并直接初始化数组元素var course = new Array (“Java程序设计”,“HTML开发基础”,“数据库原理”,“计算机网络”);或var course = [“Java程序设计”,“HTML开发基础”,“数据库原理”,“计算机网络”];
3）数组的长度可以通过“数组名.length”来获得指定数组的实际长度。4）数组的元素注意：作为一种良好的编程习惯，应该在程序中保证数组中存放的元素其数据类型是一致的。5）访问/修改数组元素访问数组的元素可以通过下标（也就是元素在数组中存放的顺序）来访问。数组名[0]…数组名[数组长度-1]
Date
Date对象用来处理和日期时间相关的事情。
1） 定义日期对象有这么几种定义日期对象的方法：new Date() new Date("month day, year hours:minutes:seconds") new Date(yr_num, mo_num, day_num) new Date(yr_num, mo_num, day_num, hr_num, min_num, sec_num)
自动使用当前的日期和时间作为其初始值var today = new Date();
按照日期字符串设置对象var birthday = new Date(“December 17, 1991 03:24:00”);
根据指定的年月日设置对象birthday = new Date(1991,11,17);
根据指定的年月日时分秒设置对象birthday = new Date(1991,11,17,3,24,0);
2）获得日期对象的各个时间元素
getDate()：从 Date 对象返回一个月中的某一天 (1 ~ 31)
getDay()：从 Date 对象返回一周中的某一天 (0 ~ 6)
getMonth()：从 Date 对象返回月份 (0 ~ 11)
getFullYear()：从 Date 对象以四位数字返回年份
getHours()：返回 Date 对象的小时 (0 ~ 23)
getMinutes()：返回 Date 对象的分钟 (0 ~ 59)
getSeconds()：返回 Date 对象的秒数 (0 ~ 59))
getMilliseconds()：返回 Date 对象的毫秒(0 ~ 999)
Math
Math 对象提供多种算术常量和函数，执行普通的算术任务。使用Math对象无需像数组和日期对象一样要首先定义一个变量，可以直接通过“Math”名来使用它提供的属性和方法。
生成随机数 Random方法可返回介于0.0 ~ 1.0之间的一个伪随机数随机数。 例如：var r= Math.random();3）平方根函数 sqrt() 方法可返回一个数的平方根，如果给定的值小于0，则返回 NaN。 例如：var x = Math.sqrt(100); //返回10
最大与最小值函数 函数max和min返回给定参数之间的最大值和最小值，比较的参数个数可以是0到多个。如果没有参数，则返回Infinity。例如：var max=Math.max(100,101,102); //结果是102 var min=Math.min(100,101,102); //结果是1005）取整函数（1）ceil方法返回大于等于x，并且与它最接近的整数。例如：var x=Math.ceil(10.5); //返回的值是11
floor方法返回小于等于x，并且与x最接近的整数。例如：var x=Math.floor(10.5); //返回的值是10（3）round方法返回一个数字舍入为最接近的整数。例如：var x=Math.round(10.5); //返回的值是11 var x=Math.round(10.2); //返回的值是10 var x=Math.round(-10.5); //返回的值是-10 var x=Math.round(-10.2); //返回的值是-10 var x=Math.round(-10.6); //返回的值是-11
指数、对数和幂函数（1）exp()：返回e的指数。（2）log()：返回数的自然对数（底为e）。（3）pw()：返回x的y次幂。7）其他数学函数 除了上述函数之外，Math对象还包括系列三角函数、求绝对值函数abs等。
DOM
DOM（Document Object Model）是一种在加载Web页面时由浏览器创建的HTML文档模型。JavaScript可以通过一个名为document 的对象访问页面中的所有元素，包括style等。document 对象是 window 对象的一个部分，虽然可通过 window.document 属性来访问，但编程中，可以直接使用document名称来访问页面中的各个元素。
- 结点 DOM树上的每个结点都是一个对象，代表了该页面上的某个元素。
（1）根结点：一个网页最外层的标记是<HTML>，实际上它也是页面所有元素的根，通过document对象的documentElement属性可以获得。 var root=document.documentElement;
（2）子结点：任何结点都可以通过集合（数组）属性childNodes来获得自己的子结点。例如，根结点包含两个子结点，也就是head和body。 var aNodeList=root.childNodes; 一个结点的子结点，还可以通过结点的firstChild和lastChild属性来获得它的第一个和最后一个子结点。
（3）父结点：DOM规定一个页面只有一个根结点，根结点是没有父结点的，除此之外，其他结点都可以通过parentNode属性获得自己的父结点。 var parentNode=aNode.parentNode; // aNode是一个结点的引用
（4）兄弟结点：一个结点如果有父结点的话，那么这个父结点下的子结点之间就被称为“兄弟结点”，一个子结点的前一个结点可以用属性previousSibling获得，对应的后一个结点可以用nextSibling属性获得。如果没有前结点或后结点，则返回null。 var prevNode=aNode.previousSibling // 返回aNode的前一个结点的引用 var nextNode=aNode. nextSibling // 返回aNode的后一个结点的引用
- 通过ID访问页面元素语法：document.getElementById(id)参数： id。必选项，为字符串(String)返回值：对象。返回相同id对象中的第一个，如果无符合条件的对象，则返回 null 。例如：var userName=document.getElementById(“userName”).value;
使用该方法需要注意： 在页面开发时，最好给每一个需要交互的元素设定一个唯一的id便于查找。 getElementById()返回的是一个页面元素的引用，例如在图9-7中出现的所有元素都可以通过它来获得。 如果页面上出现了不同元素使用了同一个id，则该方法返回的只是第一个找到的页面元素。 如果给定id，没有找到对应的元素，则返回值为null。
- 通过Name访问页面元素语法：document.getElementsByName(name)参数： name：必选项为字符串(String)返回值：数组对象；如果无符合条件的对象，则返回空数组由于该方法的返回值是一个数组，所以可以通过位置下标来获得页面元素，例如： var userNameInput=document.getElementsByName(“userName”); var userName=userNameInput[0].value;
使用该方法需要注意：若一个名字指定的页面元素确实只有一个，该方法也返回一个数组，所以在上面代码段中，用位置下标0本来获得“用户名输入框”元素，如userNameInput[0]。如果指定名字，在页面中没有对应的元素存在，则返回一个长度为0的数组，程序中可以通过判断数组的length属性值是否为0来来判断是否找到了对应的元素。
-
通过标签名访问页面元素 除了通过id和name可以获得对应的元素外，还可以通过指定的标签名称，来获得页面上所有这一类型的元素，如input元素。语法：document.getElementsByTagName(tagname)参数： tagname:必选项为字符串(String)返回值：数组对象; 如果无符合条件的对象，则返回空数组例如：在程序9-18login()函数中如果添加这样两行：var inputs=document.getElementsByTagName(“input”);alert(input.length); //显示为4
-
获得当前页面的所有Form对象 Form元素是html程序提供用户向系统提供输入的重要对象，里面一般会包含文本输入框、各种选项按钮等元素。通过获得一个form对象，最主要的是利用form的几个方法。语法： document.forms参数：无返回值：数组对象。如果无符合条件的对象(Form对象)，则返回空数组例如：下面的代码段显示了如何获得程序9-18页面中的Form对象：var frms=document.forms; //先获得数组对象，注意不是方法，是属性var loginfrm=frms[0]; //获得数组中的第一个form对象，如果存在的话
window 对象是JavaScript 层级中的顶层对象，这个对象会在一个页面中或出现时被自动创建，也就是一个浏览器中显示的网页会自动拥有相关的window对象。
- 框架程序中Window对象应用 window对象是JavaScript层级的顶层对象。该对象会在一个页面中或出现时被自动创建，也就是浏览器中显示的网页会自动拥有相关的window对象。。2. window对象中的主要属性（1）history：该对象记录了一系列用户访问的网址，可以通过history对象的back()、forward() 和 go() 方法来重复执行以前的访问。
2.ocation：window对象的location表示本窗口中当前显示文档的 Web 地址，如果把一个含有 URL 的字符串赋予location对象或它的href属性，浏览器就会把新的URL所指的文档装载进来，并显示在当前窗口。例如：window.location = “/index.html”;（3）navigator: 是一个包含有关客户机浏览器信息的对象。例如：var browser = navigator.appName;（4）screen：每个 window 对象的 screen 属性都引用一个 screen 对象。screen 对象中存放着有关显示浏览器屏幕的信息。
事件
事件是可以被JavaScript侦测到的行为。网页中的每个元素都可以产生某些可以触发JavaScript函数的事件。1. 网页访问中常见的事件 根据事件触发的来源不同，可以分为鼠标事件、键盘事件和浏览器事件三种主要类型。
主要事件句柄 当事件发生时，浏览器会自动查询当前页面上是否指定了对应的事件处理函数，如果没有指定，则什么也不会发生，如果指定了，则会调用执行对应的事件处理代码，完成一个事件的响应。通过设置页面元素的事件处理句柄可以将一段事件处理代码和该页面元素的特定事件关联起来。表格所示为典型的事件句柄。
HTML 事件处理程序（句柄）
此外应该避免使用所有 HTML 事件处理程序的名称。
| onblur | onclick | onerror | onfocus |
| onkeydown | onkeypress | onkeyup | onmouseover |
| onload | onmouseup | onmousedown | onsubmit |
onblur 当窗口失去焦点时运行脚本。
onfocus 当窗口获得焦点时运行脚本。
onload 当文档加载之后运行脚本。
onresize 当调整窗口大小时运行脚本。
onstorage 当 Web Storage 区域更新时（存储空间中的数据发生变化时）运行脚本
onchange 当元素改变时运行脚本。
oninput 当元素获得用户输入时运行脚本。
oninvalid 当元素无效时运行脚本。
onselect 当选取元素时运行脚本。
onsubmit 当提交表单时运行脚本。
onkeydown 当按下按键时运行脚本。
onkeyup 当松开按键时运行脚本。
onkeypress 当按下并松开按键时运行脚本。
onclick 当单击鼠标时运行脚本。
ondblclick 当双击鼠标时运行脚本。
onmousedown 当按下鼠标按钮时运行脚本。
onmouseup 当松开鼠标按钮时运行脚本。
onmousemove 当鼠标指针移动时运行脚本。
onmouseover 当鼠标指针移至元素之上时运行脚本，不可以阻止冒泡。
onmouseout 当鼠标指针移出元素时运行脚本，不可以阻止冒泡。
onmouseenter 当鼠标指针移至元素之上时运行脚本，可以阻止冒泡。
onmouseleave 当鼠标指针移出元素时运行脚本，可以阻止冒泡。
onmousewheel 当转动鼠标滚轮时运行脚本。
onscroll 当滚动元素的滚动条时运行脚本。
4659
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
