JavaScript(七 )

JavaScript(七 )

一、作用域

1、全局作用域
指在整个js的任意地方都可以获取和使用
2、局部作用域
指只可以在一个局部的范围内可以获取和使用 就像函数在函数里面声明的值

二、作用域链：

作用域链：有多级作用域连续引用新城的链式结构，管控一切变量的使用顺序 。
先在自己的AO中找，再延作用域链向父级作用域中去找
GO{
}
AO{
}
scope:
[[scope]]中存储的是作用域的数组链式结构，且有访问的顺序，越在上的，越先访问

三、对象

对象的创建方式：
1、var obj = {
 name = ‘阿萨’;
 age = 18;
 run:function() {
 };
}
2、var obj2 = new Object();
3、Object.create(prototype, descriptors)

四、匿名函数/立即执行函数

匿名函数：回调
function(){}

立即执行函数：临时建立作用域，避免全局污染！ 针对初始化功能的函数（完全不影响外面的）
1、(function(){
var b = 123;
document.write(“a” + b);
})();
2、(function(a, b, c){
console.log(a * b + c);
}(1, 2, 3));//W3C 推荐
注意***
function test(x, y, z){
console.log(x + y + z);
}(1, 2, 3);
不会报错，但是也不会立即执行，会解析成一个函数和一个(1, 2, 3)的表达式，使用时需要特别注意！！！！

五、DOM Tree

DOM:Document Object Model W3C API标准。操作HTML（内容）
所有的Node(元素、属性、文本)对象 都是document的子代节点
三大属性：
1、nodeType 节点类型 number
document 9
element 1
attrbute 2
text 3

2、nodeName 节点名
document #document
标签元素 全大写的标签名
attitude 属性名
文本节点 #text

3、nodeValue 节点值
document null
标签元素 null
attribute 属性值
text 文本的内容

查找 三个元素不需要找，直接用
document.documentElement
document.head
document.body

节点间关系
1） 父子关系
node.parentNode 获得node的父节点
node.childNodes 获得node的直接子代节点
node.firstChild 获得node下的第一个子节点
node.lastChild 获得node下最后一个子节点
2）兄弟关系
node.previusSibling 返回当前节点的前一个兄弟节点
node.nextSibling 返回当前节点的下一个兄弟节点
注意：
通过标签来多次查询下一级元素时会报错！！！

符合要求的元素对象：

1、按id查找 只能通过document调用 该方法定义在Document.prototype所以Element节点上不能使用
var oDiv = document.getElementById(‘box’);
oDiv.style.width = “200px”;
DOM 可以间接改变CSS的样式内容！！！！

2、按标签名查找：定义在Document.prototype和Element.prototypes上（返回值为数组）
查询指定父元素下指定标签的元素对象集合 （所有子代元素对象）
var btns = document.getElementsByTagName(“button”);
只有一个元素，也是放在集合中
var divs = document.getElementsByTagName(“div”);
console.log(divs[0]);

3、按name属性查找 动态数组 Document.prototype/HTMLDocument.prototype上只能通过 document调用
var pwd = document.getElementsByName(“pwd”);
console.log(pwd[0].value);//获得单标签的值
提示：单标签的值用value获取，双标签的值使用innerHTML获取

4、按class属性查找 IE的兼容性问题
查找任意父元素下指定calss属性的元素对象 返回一个集合
查找到所有的后代子元素
var actives = nav.getElementsByClassName(“active”);