首页 > 其他 > 详细

节点操作

时间:2016-05-14 18:35:02      阅读:197      评论:0      收藏:0      [点我收藏+]

HTML DOM 节点
在 HTML DOM (文档对象模型)中,每个部分都是节点:
文档本身是文档节点
所有 HTML 元素是元素节点
所有 HTML 属性是属性节点
HTML 元素内的文本是文本节点
注释是注释节点
换行符也是节点

节点操作
object.parentNode: 获取该元素父节点
object.childNodes: 获取对象所有的子节点,只包含次级节点
object.firstChild: 获取该元素第一个子节点
object.lastChild: 获取该元素最后一个子节点
object.nextSibling: 获取该下一个兄弟节点
object.previousSibling: 获取该元素上一个兄弟节点

NODE属性
节点中文 nodeType(节点类型) nodeName(节点名) nodeValue(节点值)
元素 1 TagName null
属性 2 attr 属性值
文本 3 #text 文本值
注释 8 #comment 注释文字
文档 9 #document null

<ul id="ul"><li>balabala</li><li id="li2">xiuxiuxiu</li><li>bombombom</li></ul>

<script type="text/javascript">
//节点操作
console.log(document.getElementById("li2").parentNode);//获取该元素父节点
console.log(document.getElementById("ul").childNodes);//获取对象所有的子节点
console.log(document.getElementById("ul").firstChild);//获取该元素第一个子节点
console.log(document.getElementById("ul").lastChild);//获取该元素最后一个子节点
console.log(document.getElementById("li2").nextSibling);//获取该元素下一个兄弟节点
console.log(document.getElementById("li2").previousSibling);//获取该元素上一个兄弟节点
//属性操作
console.log(document.getElementById("ul").nodeType);//节点类型
console.log(document.getElementById("ul").nodeName);//节点名称
console.log(document.getElementById("ul").nodeValue);//节点值
</script>

节点操作

原文:http://www.cnblogs.com/lk991827465/p/5492923.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!