Javascript 学习
更新时间：2023-09-22 02:26:01 阅读量： 工程科技 文档下载
Javascript 学习
1、操作 HTML 元素
如需从 JavaScript 访问某个 HTML 元素，您可以使用 document.getElementById(id) 方法。
请使用 \属性来标识 HTML 元素： 例子：
通过指定的 id 来访问 HTML 元素，并改变其内容： [html] view plain copy 在CODE上查看代码片派生到我的代码片
My First Web Page
输出结果：
[plain] view plain copy 在CODE上查看代码片派生到我的代码片 My First Web Page
My First JavaScript 2、数组
下面的代码创建名为 cars 的数组：
[html] view plain copy 在CODE上查看代码片派生到我的代码片 var cars=new Array(); cars[0]=\ cars[1]=\ cars[2]=\
或者 (condensed array):
[html] view plain copy 在CODE上查看代码片派生到我的代码片 var cars=new Array(\olvo\
3、对象（对象只是带有属性和方法的特殊数据类型）
属性是与对象相关的值，方法是能够在对象上执行的动作。
对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔：
[html] view plain copy 在CODE上查看代码片派生到我的代码片 var person={firstname:\
上面例子中的对象 (person) 有三个属性：firstname、lastname 以及 id。 空格和折行无关紧要。声明可横跨多行：
[html] view plain copy 在CODE上查看代码片派生到我的代码片 var person={
firstname : \ lastname : \ id : 5566 };
4、声明变量类型
当您声明新变量时，可以使用关键词 \来声明其类型： [html] view plain copy 在CODE上查看代码片派生到我的代码片 var carname=new String; var x= new Number; var y= new Boolean; var cars= new Array; var person= new Object;
JavaScript 变量均为对象。当您声明一个变量时，就创建了一个新的对象。 小注：
JavaScript 中的所有事物都是对象：字符串、数字、数组、日期，等等。 在 JavaScript 中，对象是拥有属性和方法的数据。 5、属性和方法
属性是与对象相关的值。
方法是能够在对象上执行的动作。 举例：汽车就是现实生活中的对象。 汽车的属性：
[html] view plain copy 在CODE上查看代码片派生到我的代码片 car.name=Fiat car.model=500 car.weight=850kg car.color=white 汽车的方法：
[html] view plain copy 在CODE上查看代码片派生到我的代码片 car.start() car.drive() car.brake()
汽车的属性包括名称、型号、重量、颜色等。
所有汽车都有这些属性，但是每款车的属性都不尽相同。 汽车的方法可以是启动、驾驶、刹车等。
所有汽车都拥有这些方法，但是它们被执行的时间都不尽相同 6、标签
正如您在 switch 语句那一章中看到的，可以对 JavaScript 语句进行标记。 如需标记 JavaScript 语句，请在语句之前加上冒号： [html] view plain copy 在CODE上查看代码片派生到我的代码片 label: 语句
break 和 continue 语句仅仅是能够跳出代码块的语句。 语法
[html] view plain copy 在CODE上查看代码片派生到我的代码片
break labelname; continue labelname;
continue 语句（带有或不带标签引用）只能用在循环中。 break 语句（不带标签引用），只能用在循环或 switch 中。
通过标签引用，break 语句可用于跳出任何 JavaScript 代码块： 实例：
[html] view plain copy 在CODE上查看代码片派生到我的代码片 cars=[\ list: {
document.write(cars[0] + \ document.write(cars[1] + \ document.write(cars[2] + \ break list;
document.write(cars[3] + \ document.write(cars[4] + \ document.write(cars[5] + \ }
输出结果：
[plain] view plain copy 在CODE上查看代码片派生到我的代码片 BMW Volvo Saab
1、查找HTML元素
通常，通过 JavaScript，您需要操作HTML 元素。
为了做到这件事情，您必须首先找到该元素。有三种方法来做这件事： 通过id找到HTML元素（本例查找 id=\元素）
[javascript] view plain copy 在CODE上查看代码片派生到我的代码片 var x=document.getElementById(\
通过标签名找到HTML元素（本例查找 id=\的元素，然后查找 \中的所有
元素）
[javascript] view plain copy 在CODE上查看代码片派生到我的代码片
var x=document.getElementById(\ 通过类名找到HTML元素 2、改变HTML属性
如需改变 HTML 元素的属性，请使用这个语法：
[javascript] view plain copy 在CODE上查看代码片派生到我的代码片 document.getElementById(id).attribute=new value 3、改变HTML样式
如需改变HTML元素的样式，请使用这个语法：
[javascript] view plain copy 在CODE上查看代码片派生到我的代码片 document.getElementById(id).style.property=new style 4、onload和onunload事件
onload和onunload事件会在用户进入或离开页面时被触发。
onload事件可用于检测访问者的浏览器类型和浏览器版本，并基于这些信息来加载网页的正确版本。
onload和onunload事件可用于处理cookie。
1、Javascript 组成：
ECMAScript--JavaScript的核心，描述了语言的基本语法和对象。
DOM（文档对象模型）--The Document Object Model描述了作用于网页内容的方法和接口。document的操作，比如：
[javascript] view plain copy 在CODE上查看代码片派生到我的代码片 var lis = document.getElementsByTagName('li'); BOM（浏览器对象模型）：The Browser Object Model描述了和浏览器交互的方法和接口。window的操作，比如：
[javascript] view plain copy 在CODE上查看代码片派生到我的代码片 window.onload = function () { }
2、“==”和“===”运算符
一、严格相等运算符 === 的实现
=== 被称为 Strict Equals Operator，假设有表达式 a === b，则它的实际运算过程如下 计算出表达式 a 的结果，并存入 lref 变量 将 GetValue(lref) 的结果存入 lval 变量 计算出表达式 b 的结果，并存入 rref 变量 将 GetValue(rref) 的结果存入 rval 变量
执行 Strict Equality Comparison 算法判断 rval === lval 并将结果直接返回
这里的 Strict Equality Comparison 算法很关键，假设要计算的是 x === y，则过程如下 1. 如果 Type(x) 和 Type(y) 不同，返回 false 2. 如果 Type(x) 为 Undefined，返回 true 3. 如果 Type(x) 为 Null，返回 true
4. 如果 Type(x) 为 Number，则进入下面的判断逻辑 4.1. 如果 x 为 NaN，返回 false 4.2. 如果 y 为 NaN，返回 false
4.3. 如果 x 的数字值和 y 相等，返回 true 4.4. 如果 x 是 +0 且 y 是 -0，返回 true 4.5. 如果 x 是 -0 且 y 是 +0，返回 ture 4.6. 返回 false
5. 如果 Type(x) 为 String，则当且仅当 x 与 y 的字符序列完全相同（长度相等，每个位置上的字符相同）时返回 true，否则返回 false
6. 如果 Type(x) 为 Boolean，则若 x 与 y 同为 true 或同为 false 时返回 true，否则返回 false
7. 如果 x 和 y 引用的是同一个对象，返回 true，否则返回 false
二、相等运算符 == 的实现
好了，当你明白了 === 的实现之后，我们再来看看 == 的实现，比较一下他们有何不同？ == 被称为 Equals Operator （注意看没有 Strict 了），假设有表达式 a == b，则它的实际运算过程如下
计算出表达式 a 的结果，并存入 lref 变量 将 GetValue(lref) 的结果存入 lval 变量 计算出表达式 b 的结果，并存入 rref 变量 将 GetValue(rref) 的结果存入 rval 变量
执行 Abstract Equality Comparison 算法判断 rval == lval 并将结果直接返回
注意，其中的前 4 个步骤是和 === 完全相同的。唯独 5 不同。对于 === 来说，调用的是 Strict Equality Comparison 算法，但是 == 则调用的是 Abstract Equality Comparison 算法。虽然仅一词之差，但是却有质的不同，我们下面就来看看到底它是怎么实现的
假设要计算的是 x == y，Abstract Equality Comparison 计算的过程如下（很冗长，但是每个步骤都很简单）
1. 如果 Type(x) 和 Type(y) 相同，则
1.1. 如果 Type(x) 为 Undefined，返回 true 1.2. 如果 Type(x) 为 Null，返回 true 1.3. 如果 Type(x) 为 Number，则 1.3.1. 如果 x 是 NaN，返回 false 1.3.2. 如果 y 是 NaN，返回 false
1.3.3. 如果 x 的数值与 y 相同，返回 true 1.3.4. 如果 x 是 +0 且 y 是 -0，返回 true 1.3.5. 如果 x 是 -0 且 y 是 +0，返回 true 1.3.6. 返回 false
1.4. 如果 Type(x) 为 String，则当且仅当 x 与 y 的字符序列完全相同（长度相等，每个位置上的字符相同）时返回 true，否则返回 false
1.5. 如果 Type(x) 为 Boolean，则若 x 与 y 同为 true 或同为 false 时返回 true，否则返回 false
1.6. 如果 x 和 y 引用的是同一个对象，返回 true，否则返回 false 2. 如果 x 是 null 且 y 是 undefined，返回 true 3. 如果 x 是 undefined 且 y 是 null，返回 ture
4. 如果 Type(x) 为 Number 且 Type(y) 为 String，以 x == ToNumber(y) 的比较结果作为返回
5. 如果 Type(x) 为 String 且 Type(y) 为 Number，以 ToNumber(x) == y 的比较结果作为返回值
6. 如果 Type(x) 为 Boolean，以 ToNumber(x) == y 的比较结果作为返回值
//4.接收服务器的返回
oAjax.onreadystatechange = function () { if (oAjax.readyState == 4) //完成 {
if (oAjax.status == 200) //成功 {
fnSucc(oAjax.responseText); } else {
if (fnFaild)
fnFaild(oAjax.status); } } }; }
请求状态监控
onreadystatechange事件 readyState属性：请求状态
0 （未初始化）还没有调用open()方法
1 （载入）已调用send()方法，正在发送请求
2 （载入完成）send()方法完成，已收到全部响应内容 3 （解析）正在解析响应内容
4 （完成）响应内容解析完成，可以在客户端调用了 status属性：请求结果
responseText：服务端返回内容
1、javascript 面向对象
无标题文档