JavaScript-2
6，node
（1）节点名称，值和类型：
l nodeName：其内容是给定节点的名字。
l 如果是元素节点，nodeName返回这个元素的名称。
l 如果是属性节点，nodeName返回这个属性的名称。
l 如果是文本节点，nodeName返回一个内容为#text 的字符串。
l nodeType：返回一个整数，这个数值代表着给定节点的类型。
l Node.ELEMENT_NODE ---1 -- 元素节点
l Node.ATTRIBUTE_NODE ---2 -- 属性节点
l Node.TEXT_NODE ---3 -- 文本节点
l nodeValue：返回给定节点的当前值（字符串）。
l 如果给定节点是一个属性节点，返回值是这个属性的值。
l 如果给定节点是一个文本节点，返回值是这个文本节点内容。
l 如果给定节点是一个元素节点，返回值是null。
（2）父节点，子节点，和同辈节点：
l 父节点： parentNode 和 parentElement(只支持IE)
l parentNode 属性返回的节点永远是一个元素节点，因为只有元素节点才有可能包含子节点。
l document 节点的没有父节点。
l 子节点
l ChildNodes：获取指定节点的所有子节点集合。
l firstChild：获取指定节点的第一个子节点。
l lastChild：获取指定节点的最后一个子节点。
l 同辈节点
l nextSibling: 返回一个给定节点的下一个兄弟节点。
l previousSibling：返回一个给定节点的上一个兄弟节点。
（3）节点属性：
l 节点属性attributes是Node接口定义的属性。
l 节点属性attributes就是节点（特别是元素节点）的属性。
l 事实上，attributes中包含的是一个节点的所有属性的集合。
l attributes.getNameItem()和Element对象的getAttribute()方法类似。
（4）检查子节点和属性：
l 查看是否存在子节点：hasChildNodes()
l 查看是否存在属性：hasAttributes()
l 即使节点中没有定义属性，其attributes属性仍然有效的，而且长度值为0。同样节点中的childNodes属性也是如此。
l 当你想知道某个节点是否包含子节点和属性时，可以使用hasChildNodes()和hasAttributes()方法。但是，如果还想知道该节点中包含多少子节点和属性的话，仍要使用attributes和childNodes属性。
l 在IE浏览器中，不存在hasAttributes()方法！
（5）操纵DOM节点树：
l 插入节点
l appendChild()方法
l insertBefore()方法，注意：没有insertAfter()方法
l 删除节点：removeChild()方法
l 替换节点：replaceChild()方法
（6）复制和移动节点：
l 复制节点：cloneNode(boolean)方法，其中，参数boolean是判断是否复制子节点。
l 移动节点：由以下三种方法组合完成
l 查找节点
l getElementById()：通过节点的id属性，查找对应节点。
l getElementsByName()：通过节点的name属性，查找对应节点。
l getElementsByTagName()：通过节点名称，查找对应节点。
l 插入节点
l appendChild()方法
l insertBefore()方法
l 替换节点：replaceChild()方法
（7）innerHTML属性：
l 浏览器几乎都支持该属性，但不是 DOM 标准的组成部分。
l innerHTML 属性可以用来读，写某给定元素里的 HTML 内容。
l innerHTML 属性多与div或span标签配合使用。
（8）XML DOM访问节点：
l document属性指向 XML 文档的根元素。
l 通过getElementsByTagName()方法可以把指定节点下面的所有特定标记名称的列表返回。
l 如果使用childNodes属性来获取子节点集合时，一般通过item(index)方法，而不是通过数组下标来访问每一个子节点。
（9）XML DOM操作XML文档：
l 创建新节点
l 移动和修改节点
l 读写节点属性和读写数据
以上操作，XML DOM与HTMLDOM的操作完全一致。
l 保存文档
与HTML DOM不同，XMLDOM提供了save()方法将XML文档保存到指定的本地目录。不过，出于安全考虑的原因，一般浏览器禁止这么做。
示例：
// 要求获取id="city"下所有子节点的个数
// //1 获取目标节点
// var city = document.getElementById("city");
//
// //2 获取目标节点的所有子节点
// var children = city.childNodes; //childNodes：获取所有子节点的集合
//
// //3 打印数量
// alert(children.length);
//要求获取id="edu"下所有子节点的个数
// var eduElement = document.getElementById("edu");
// var options = eduElement.childNodes
// alert(options.length);
/*
* * 编写java代码时，只要语法正确，效果就正确
* * 编写javascript代码时，语法正确时，效果不一定正确
* * 在于浏览器如果解析
* * 当编写javascript代码时
* * 不仅要看语法是否正确
* * 还要看浏览器如何解析
例如获取xml中某个元素的所有子节点时，IE浏览器会把换行符也算做一个子节点。
*/
var eduElement = document.getElementById("edu");
var options = eduElement.getElementsByTagName("option");
alert(options.length);
//在标签中查找标签时，只有getElementsByTagName()方法有效！
<body>
<input type="text" id="username" value="itcast">
<p>
明天上课
</p>
</body>
<script type="text/javascript">
//1 元素节点
// var username = document.getElementById("username");
//
// alert(username.nodeName); //input
// alert(username.nodeType); //1
// alert(username.nodeValue); //null
//2 属性节点
// var username = document.getElementById("username");
// var attr = username.getAttributeNode("id");
//
// alert(attr.nodeName); //id
// alert(attr.nodeType); //2
// alert(attr.nodeValue); //username
//3 文本节点
var pElement = document.getElementsByTagName("p")[0];
// var text = pElement.childNodes[0];
// var text = pElement.firstChild;
var text = pElement.lastChild;
alert(text.nodeName); //#text
alert(text.nodeType); //3
alert(text.nodeValue); //明天上课
/*
* nodeName、nodeType、nodeValue
* * nodeType：判断获取的是什么节点
* * nodeValue：获取文本节点的文本内容
* * nodeName：获取元素节点是什么标签
*/
</script>
<body>
<button id="login">登录</button>
<p>
段落
</p>
</body>
<script type="text/javascript">
//复制一个button按钮，追加到p上
var button = document.getElementById("login");
//cloneNode()方法，接收的Boolean类型的参数，是否复制子节点
var copy = button.cloneNode(true);
var pElement = document.getElementsByTagName("p")[0];
pElement.appendChild(copy);
</script>
<body>
<div id="div"></div>
</body>
<script type="text/javascript">
//需要创建一个<h1>今天</h1>插入到div中
//方法一
// var h1Element = document.createElement("h1");
// var text = document.createTextNode("今天");
// h1Element.appendChild(text);
//
// var div = document.getElementById("div");
//
// div.appendChild(h1Element);
//方法二
document.getElementById("div").innerHTML = "<h1>今天</h1>";
/*
* WEB1.0与WEB2.0：
* * WEB1.0：以内容为主(门户网站)
* * WEB2.0：以人的关系为主(社交网站)
* * WEB3.0：基于移动互联网的社交网站
*/
</script>
7，如何编写js文档
在MyEclipse或Eclipse中开发，通常单独写一个js文件，再通过在html或jsp文件中的<head>标签中引入js文档(通过src属性)，来编写js文档，耦合度比较高，代码比较清晰。
例如：<script type="text/javascript"src="demo.js"></script>
/*
* 在HTML页面中的任意位置都可以引入javascript脚本
* * head中：一般情况，都是引入外部脚本文件
* * body前：
* * 获取页面元素：不行
* * 定义函数：
* *并调用：
* *函数中包含获取页面元素内容：不行
* *函数中不包含获取页面元素内容：行
* *不调用：可以
* * body后：都可以
*/
//IE和火狐图标：表示支持IE及其他浏览器。
8 ，ECMA入门：// 1 区分大小写：与Java一样。
// var hero;
// var Hero;
//2 变量是弱类型的：与Java不一样。
//按照java编写习惯
//java，定义变量时，类型就已经明确了
// String str;
// Int i;
//javascript，定义变量时，初始化时，类型才明确
// var str;
//3 每行结尾的分号可有可无：与Java不一样。
alert("xxx");
//4 {}括号表明代码块：与Java一样
9，arguments对象
在函数中，可以通过arguments对象获取这个函数的参数数组，是个隐式的对象，在函数中可以直接调用。
例如：
function add(a,b){
alert(arguments.length); //直接通过arguments获取参数数组的长度，打印2
returna+b;
}
应用：可以通过arguments模拟函数的重载：
在javascript中，如果按照类似java中的重载形式编写函数，则最后的函数会覆盖所有的前面的同名函数，无法达到函数重载的效果，可以利用arguments来模拟函数的重载。
Function add(){
if(arguments.length== 1) {
alert(arguments[0] + 5);
} else if(arguments.length== 2){
alert(arguments[0] + arguments[1]);
}
}
add(10);//output 15
add(40,20);//output 60
10，变量的作用域
(1)全局变量：在函数外面定义的变量，在函数外和函数中都可以访问，如果函数中定义了同名变量，则函数中的变量将覆盖全局变量。
局部变量：在函数中定义的变量，函数外部不可以访问。
(2)注意：在一个函数中定义了一个变量(没有使用var)，在该函数被调用之前，这个变量是不存在的，这个变量会在这个函数首次调用的时候被创建，并被赋予全局作用域。
function f(){
local= 2;
}
alert(local); //local is undefined
f();
alert(local); 2
(3)函数域始终优先于全局域，所以局部变量a会覆盖与他同名的全局变量。
var a = 1;
function f(){
alert(a); // a is undefined
vara = 2;
alert(a); // 2
}
先定义了一个全局变量a，在函数f中首先打印a，但在这个函数中定义了局部变量a，覆盖了全局变量a，但这时局部变量a还没有初始化，所以第一次打印a is undefined，初始化为2以后，在打印，就可以打印出局部变量a的值2。注意，不管局部变量定义在函数的什么位置，只要定义了，在定义之前使用这个局部变量都会是undefined状态。
11，特殊函数：
（1）匿名函数：没有名字的函数。
例如：function() { return 2; }
用法：可以将匿名函数作为参数传递给其他函数。这样，接收方函数就能利用所传递的函数来完成某些事情。
可以定义某个匿名函数来执行某些一次性任务。
（2）回调函数：当将函数A传递给函数B，由B来执行A时，A就成了一个回调函数。如果A还是一个无名函数，就称之为匿名回调函数。例如：
function add(a,b){
returna()+b();
}
var one = function(){return 1;}
var two = function(){return 2;}
//可以直接使用匿名函数来代替one和two ，作为目标函数的参数。
alert(function(){return1;},function(){return 2;})
l 回调函数的优点：
l 它可以在不做命名的情况下传递函数（这意味着可以节省全局变量）。
l 可以将一个函数调用操作委托给另一个函数（这意味着可以节省一些代码编写工作）。
l 回调函数也有助于提升性能。(重要)
（3）自调函数：定义函数以后自行调用。例如：
(
function(name){
alert(“js”);
}
)(“xiaoqiang”) //传参数
第一对括号，放置的是一个匿名函数。
第二对括号，作用是立即调用上面定义的函数。
自调函数只需：将匿名函数定义放进一对括号中，然后外面在跟一对括号即可。
（4）内部函数/私有函数：
function a(param){
functionb(input){
returninput * 2;
};
return"The result is " + b(param);
}
alert(a(2)); //The result is 4
l 当调用全局函数a ( ) 时，本地函数b ( ) 也会在其内部被调用。由于b ( ) 是本地函数，它在a ( ) 以外的地方是不可见的，所以将b 称之为私有函数。
l 私有函数的优点：
l 有助于确保全局名字空间的纯净性（这意味着命名冲突的机会很小）。
l 私有性 —— 只将一些必要的函数暴露给“外面世界”，并保留属于自己的函数，使它们不为该应用程序的其他部分所用。