jsDom高级编程

 

1.神奇的getElementsByName

在IE中只能拿到input元素

2.getElementById

3.this:

方法里的this到底是什么，谁.的方法，那里方法里的this就是谁

4.submit

取消submint的默认提交

window.event.returnValue=false;(不提倡，因为浏览器不兼容)。如果使用普

通按钮，使用表单对象的submint()方法；onclick=" return checkName();"

5.js控制表单提交：

5.1为表单中的 提交按钮(submit) 添加 onclick="return check();".当方法返

回false，表单提交被打断。

5.2为表单 onsubmit = "return check();".当方法返回false，表单提交被打断

。

    如：<form onsubmit="return checkName()"

5.3在表单中 添加 按钮(button)，在按钮的 onclick事件 方法中，调用表单对

象的submit()方法，也可以提交表单。

5.4 通过js 代码，阻断表单提交的默认动作。window.event.returnValue = 

false;（浏览器不兼容）

6.position 

元素的position 样式值：static（无定位，显示在默认位置）、absolute（绝

对定位）、fixed（相对于窗口的固定定位，位置不会随着浏览器的滚动而变化

，IE6不支持）、relative（相对元素默认位置的定位）。如果要通过代码修改

元素的坐标则一般使用absolute，然后修改元素的top（上边缘距离）、left（

左边缘距离）两个样式值。left、top都是指的层的左上角的坐标

7.浏览器兼容性：

获取网页中那个元素触发了事件：在IE里使用event.srcElement ；在FireFox里

使用event.target 

使用Dom获取和更改网页标签元素内文本：在IE里使用innerText ；在FireFox里

使用textContent 

动态为网页或元素绑定事件：在IE中绑定事件的方法是attachEvent ；在

FireFox中绑定事件的方法是addEventListener

8.正则表达式

JavaScript中创建正则表达式类的方法：

var regex = new RegExp("\\d{5}") 或者 var regex = /\d{5}/

/表达式/是JavaScript中专门为简化正则表达式编写而提供的语法，写在//中的

正则表达式就不用管转义符了。

RegExp对象的方法：

（1）test(str)判断字符串str是否匹配正则表达式，相当于IsMatch

        var regex = /.+@.+/;

        alert(regex.test("a@b.com"));

        alert(regex.test("ab.com"));

（2）exec(str)进行搜索匹配，返回值为匹配结果，没找到返回null(*)

（3）compile编译表达式，提高运行速度。 (*)

 9.var fdf = document.createDocumentFragment();

文档片段，当在需要将很多dom元素加入dom树时，最好先将dom元素加入到

文档片段对象中，然后一次性将 文档片段 对象加入到dom树。

注意：文档片段对象　本身并不会被添加到dom树中。

10.在js里没有类的概念，平常我们在C#里说的类的概念，在js里就是对象。   对象的概念，在js里叫对象的实例。

11.在调用方法，实际传递的参数，都是保存在方法的 内部属性arguments中。

12.

每个函数对象包含两个属性：length和prototype(原型)

length代表函数定义的命名参数的个数

function Pen(price，Count){}

alert(Pen.length);//结果是：2

prototype 是保存它们所有实例方法的真实所在。就是说，比如toString()和

valueOf()等方法实际上都保存在prototype名下，只不过通过各自对象的实例访

问罢了。

13.数据类型

1.Function(函数)是对象，不是一种数据类型。

2.Undefined类型 – 只是一个值(undefined)，在使用var声明变量但未对其赋

值(初始化)时，变量默认值为undefined，但与没声明的变量不一样。如：var 

msg; alert(msg==undefined);//true       alert(msg2);//错误

3.Null类型 – 只是一个值(null)。表示一个空对象指针。(alert(typeof 

null); //object  alert(null==undefined);//true)编程技巧：在保存对象的

变量还没有保存真正对象时，应该让该变量保存null值

4.Boolean类型 -  两个字面值：true和false(区分大小写)

5.Number类型 – 整数和浮点数。*isNaN(NaN) parseInt("123blue") 

parseFloatNan=Not a number 代表不是一个数字

6.String类型- 0至16位Unicode字符组成的字符序列。

7.Object类型 – 一组数据和功能的集合，也是顶级“父类”。 通过new关键字

创建对象。包含成员：constructor 构造函数， hasOwnProperty

(propertyName) 检查属性是否在当前对象中，isPrototypeOf(object) 检查对

象是不是该对象原型，propertyIsEnumerable(propertyName) 检查属性是否能

用for-in来循环，toString()，valueOf()

14.

typeof :用来检测基本数据类型变量的数据类型

15.function:

通过函数可以封装任意多条语句，在任何地方、任何时候调用。

声明函数：function functionName(arg0,arg1......argN){ statement;}

定义函数时不需要指定返回值，因为任何函数在任何时候都可以通过return语句

返回数据。

实际上未指定返回值的函数都返回一个undefined值。

15.

与其他语言不同，ECMAScript函数不介意传递进来多少个参数，也不在乎是什么

类型。-- 因为参数在内部是用一个类数组来表示的，函数接收到的始终是个类

数组。

函数的arguments属性(可以看作就是函数接收到的参数数组)。

eg: function s() {alert(arguments.length+",first:"+arguments[0]);}s

("a");s("a","b")

上例看出，ECMAScript函数的一个重要特点：命名参数只提供便利，但不是必须

的。

没有重载：多个同名函数，则该函数名只属于最后定义的函数。

16.基本类型和引用类型:

基本数据类型：Undefined Null Boolean Number String，在内存中分别占用固

定大小的空间，因此它们被保存在栈内存中。

引用类型在栈中保存的是对象在堆内存中的地址。

动态属性：对于引用类型对象，我们可以为其添加属性和方法，也可以改变和删

除这些。

var stu= new Object(); stu.name="james"; alert(stu.name);

但不能为基本数据类型添加动态属性：

var stu= "imstudent";stu.name="james"; alert(stu.name);//undefined

复制变量值：基本类型复制的是值的副本，引用类型复制的是指针副本。

17.检测类型的关键字

检测基本数据类型用 typeof

检测引用类型 用 instanceof

res = 变量 instanceof 类型(构造函数)var c = new Person();alert(c 

instanceof Object);//true

如果使用instanceof 来检查基本类型，则永远返回false

18.执行环境和作用域:

执行环境(execution context)：定义了变量或函数有权访问的其他数据，决定

了它们各自的行为。环境中所有代码执行完毕后该环境被销毁。

每个执行环境都有一个与之关联的 变量对象，环境中定义的所有变量和函数都

保存在这个对象中。

全局执行环境(window对象)是最外围的执行环境。

每个函数在被调用时都会创建自己的执行环境：当执行流进入一个函数时，函数

 

的环境创建并入栈。执行完后栈将环境推出，把控制权返回给之前的执行环境。

当代码在一个环境中执行时，会创建由变量对象构成的作用域链(scope chain)

。用来保证对执行环境 有权访问的所有变量和函数的有序访问。作用域链前端

始终是当前执行环境的变量对象。全局执行环境的变量对象始终都是作用域链的

最后一个。

19.没有块级作用域

if等语句中的变量声明会将变量添加到当前执行环境。for(var i =0;i<10;i+

+){} alert(i);

声明变量：使用var关键字声明变量时，变量将添加到距离最近的可用环境中，

对于函数而言，这个最近的环境就是函数的局部环境。(如果没添加var关键字，

则添加到父环境了)

查询变量(变量的访问)：从最近的执行环境开始查询，直到找到要用的变量。很

明显，访问局部变量要比访问全局变量更快，因为不用向上搜索作用域链。

20.关于垃圾回收

自动垃圾回收机制，执行环境会负责管理代码执行过程中的内存

原理：按周期时间找出那些不再继续使用的变量，然后释放。

将变量设置为null意味着切断变量(栈)与引用值(堆)的关系，垃圾回收器就会将

他删除并释放内存。(局部变量在离开执行环境后会自动解除引用。)

21.引用类型object

引用类型是一种数据结构，用来将数据和功能组织到一起。常被成为“类”。但

它不具备传统面向对象语言所支持的类和接口。

创建Object 的两种方式：1.new 关键字var s = new Object(); 

s.name="james"; s.age=27;var s = {}; s.name="james"; s.age=27;

2.对象 字面量表示法var s = {name:"james",age:27};var s2 = 

{"name":"james","age":27};

访问对象属性：s.name 或 s["name"]使用方括号的有点是可以通过变量来动态

访问属性

22.Array类型

Array 是数据的有序列表，但和其他语言不同的是：数组的元素可以是任意类型

；数组的长度也是可变的；数组的length属性可读写。数组最多可以包含42亿多

个元素。栈(LIFO-LastInFirstOut-后进先出)方法：push() ,pop()

队列(FIFO-FirstInFirstOut)方法：push(),shift(),unshift()

sort()-排序(可传入比较方法),reverse()-翻转(将数组元素顺序倒过来)

concat()—连接数组的 var colors=["a","b"];var newcolor=colors.concat

("yellow",["c","d"]);

23.Function类型

函数是对象，函数名是指针

每个函数都是Function类型的实例，而且都与其他引用类型一样具有属性和方法

。由此可以看出，函数名不过就是指向该函数对象的一个指针(不会与某个函数

绑定)。声明方式：function sum(x,y){return x+y;};var s=123;var 

sum=function(x,y){return x+y;}//函数表达式var sum=new Function

("x","y","return x+y;");//对象创建,不推荐(解析两次)

注意：使用不带圆括号的函数名是访问函数指针，而非调用函数

没有重载—深入：多个同名函数其实就是对同一个函数对象赋值var 

sumFun=function(x){return x+1};var sumFun=function(x){return x-

1};sumFun(1);

24.函数内部属性 arguments

arguments(包含所有传入方法的参数)特殊用法：arguments中有一个属性callee

，是一个指针，指向拥有这个arguments对象的函数对象(就是当前函数对象的指

针)。

例子:（阶乘函数）function facorial(num){if(num<=1) return 1;else 

return num*factorial(num-1);//函数执行与函数名紧耦合在一起了}function 

facorial(num){if(num<=1) return 1;else return num*arguments.callee

(num-1);}var another=facorial; facorial=function(){return 1;}alert

(another(5)); alert(facorial(5));

25.函数方法apply()和call()

每个函数都包含两个非继承而来的方法：apply()和call()用在特定的作用域调

用函数，实际上等于设置函数体内this对象的值

apply()接受两个参数：在其中运行的作用域，参数数组（Array/arguments）

在使用call()方法时，必须明确地传入每一个参数。结果和apply一样。

其实apply和call真正的强大用途在于，能够扩充函数赖以运作的作用域：

26.基本包装类型:

每当读取一个基本类型的时候，后台就会创建一个对应的基本包装类型的对象，

从而让我们能够调用一些方法来操作这些数据：var s1="haha";   var 

s2=s1.substring(2);

第二行其实处于一种 读取模式，访问字符串时，后台都自动完成：1.创建

String类型的一个实例；2.在实例上调用指定的方法;3销毁这个实例。

因为包装类型会即时销毁，所以不能添加属性和方法。var s1="ssss"; 

s1.color="red"; alert(s1.color);

27.它就像一个ECMAScript解析器，强大法力无边！它只接收一个参数，就是要

执行的js代码字符串。

当解析器发现eval时，它会将传入的参数当作实际的js语句解析，然后把结果插

入到原来位置。

通过eval执行的代码被认为是包含该次调用的执行环境的一部分

var msg="hello"; eval("alert(msg);");eval("function sh(){alert

('hi');}"); sh();