jsday03节点 jsday03节点

一 html

我是p 我是span 01 02 03 04 05 06

【jsday03节点】js 节点 1是标签 2是属性 3是文本

function $(id){ return document.getElementById(id); }

console.log($("list").parentNode); //得到父节点 console.log($("list").parentElement)//得到父元素 console.log($("list").parentNode.nodeType)//标签的----1(属性) console.log($("list").parentNode.nodeName)//标签的----大写的名字 console.log($("list").parentNode.nodeValue)//标签的---null(文本内容)

console.log($("list").childNodes); //得到子节点（在ie8中得到的是子元素） console.log($("list").children); //得到子元素（ie8不支持） console.log($("list").firstChild); //第一个子节点（在ie8中得到的是子元素） console.log($("list").firstElementChild); //第一个子元素（ie8不支持） console.log($("list").lastChild); //最后一个节点（在ie8中得到的是子元素） console.log($("list").lastElementChild); //最后一个子节点（ie8不支持）console.log($("list").getAttributeNode("id"))//获取属性节点

console.log($("three").previousSibling); //前一个兄弟节点 console.log($("three").previousElementSibling); //前一个兄弟元素 console.log($("three").nextSibling); //下一个兄弟节点 console.log($("three").nextElementSibling); //下一个兄弟元素

小结：在标准浏览器中获取节点都是对应的节点，获取的元素都是对应的元素。
在ie8中获取的节点都是元素，获取的元素都是undefined，不支持元素代码

二

获得任意元素的第一个子元素和最后一个子元素

//获得任意元素的第一个子元素 function getFirstElemenChild(element){ if(element.firstElementChild){ return element.firstElementChild; }else{ var node=element.firstChild; while(node && node.nodeType != 1){ node=node.nextSibling; } return node; } }

//获得任意元素的最后一个子节点 function getLastElementChild(element){ if(element.firstElementChild){ return element.firstElementChild; }else{ var node=element.firstChild; while(node && node.nodeType != 1){ node=node.previousSibling; } return node; } }