DOM 总结(二)

　　DOM 总结（二）
　　查找元素的方法：
　　1，getElementByName()方法：
　　寻找有着给定name属性的所有元素，这个方法将返回一个节点集合，这个集合可以当作一个数组来处理。这个集合的 length 属性等于当前文档里有着给定name属性的所有元素的总个数。
　　举例：
　　


function test(){ // 获取属性的Name var tnameArray=document.getElementsByName("tname"); //输出长度 alert(tnameArray.length); //迭代输出获得的值 for(var i=0;igetElementById()方法：
　　寻找一个有着给定 id 属性值的元素，返回值是一个有着给定 id 属性值的元素 节点。如果不存在这样的元素，它返回 null.
　　var oElement = document.getElementById ( sID )
　　**该方法只能用于 document 对象
　　举例：
　　3,通过使用一个元素节点的 parentNode、firstChild 以及 lastChild 属性 function test(){ //获取ID var usernameElement=document.getElementById("tid"); //获取元素的值 alert("usernameElement.value: "+usernameElement.value) //获取元素的类型 alert("usernameElement.type: "+usernameElement.type) }
　　这三个属性 parentNode、firstChild 以及 lastChild 可遵循文档的结构，在文档中进行"短距离的旅行"。
　　请看下面这个 HTML 片段：
　　 John Doe Alaska
　　在上面的HTML代码中，第一个 是 元素的首个子元素（firstChild），而最后一个 是 元素的最后一个子元素（lastChild）。
　　此外， 是每个 元 素的父节点（parentNode），这就是DOM父与子之间的关系；但是有的时候有的父节点不存在子节点那么就需要进行判断在读取，在判断是我们用到了一个方法hasChildNodes()方法
　　hasChildNodes()
　　该方法用来检查一个元素是否有子节点，返回值是 true 或 false.
　　var booleanValue = element.hasChildNodes();
　　文本节点和属性节点不可能再包含任何子节点，所以对这两类节点使用 hasChildNodes 方法的返回值永远是 false.如果 hasChildNodes 方法的返回值是 false，则 childNodes,firstChild,lastChild 将是空数组和空字符串。
　　在用元素子节点的属性读取时我们先要获得根节点：
　　有两种特殊的文档属性可用来访问根节点：
　　document.documentElement
　　document.body
　　第一个属性可返回存在于 XML 以及 HTML 文档中的文档根节点。
　　第二个属性是对 HTML 页面的特殊扩展，提供了对 标签的直接访问
　　DOM的属性
　　每个节点都拥有包含着关于节点某些信息的属性。这些属性是：
　　nodeName（节点名称）
　　nodeValue（节点值）
　　nodeType（节点类型）
　　1，DOM属性nodeName
　　nodeName 属性含有某个节点的名称。
　　var name = node.nodeName;
　　元素节点的 nodeName 是标签名称
　　属性节点的 nodeName 是属性名称
　　文本节点的 nodeName 永远是 #text
　　文档节点的 nodeName 永远是 #document
　　注释：nodeName 所包含的 XML 元素的标签名称永远是大写的
　　注:nodeName 是一个只读属性。
　　2，DOM属性nodeValue
　　nodeValue：返回给定节点的当前值（字符串）
　　如果给定节点是一个属性节点，返回值是这个属性的值。
　　如果给定节点是一个文本节点，返回值是这个文本节点的内容。
　　如果给定节点是一个元素节点，返回值是 null
　　nodeValue 是一个 读/写 属性，但不能对元素节点的 nodeValue 属性设置值，
　　但可以为文本节点的 nodeValue 属性设置一个值。
　　var li = document.getElementById("li");
　　if(li.firstChild.nodeType == 3)
　　li.firstChild.nodeValue = "国庆60年";
　　3，DOM属性 nodeType
　　nodeType：返回一个整数，这个数值代表着给定节点的类型。
　　nodeType 属性返回的整数值对应着 12 种节点类型,常用的有三种：
　　Node.ELEMENT_NODE ---1 -- 元素节点
　　Node.ATTRIBUTE_NODE ---2 -- 属性节点
　　Node.TEXT_NODE ---3 -- 文本节点
　　nodeType 是个只读属性
　　举例：
　　如下的html： 请将select中的文本输出(用两种方法来写)
　　 用户名: 学历: 大专生 本科生 硕士生 博士生 用户的学历是： 第一种（用getElementById()和getElnmentByNmae()方法读取）
　　getElementById("edu")方法获取select的对象 var edus = document.getElementById("edu"); //通过select中options集合获取所有的option对象 var edus1 = edus.options; var msg =""; //遍历所有的option对象的文本值 for(var i=0;i 第二种（通过元素节点的属性来读取）
　　getElementById("edu")方法获取select的对象 var edus = document.getElementById("edu"); var edus1 = edus.childNodes; alert(edus1.length); var fc = edus.firstChild; alert(fc.nodeName); var lc = edus.lastChild; alert(lc.nodeName); var llc = lc.firstChild; alert(llc.nodeValue); var msg=""; for(var i=0;i