javascript中节点的介绍

1.文档------->document

2.元素------->页面中所有的标签,元素(element)

根元素:html标签

3.节点------->页面中所有的内容(标签、属性、文本(文字、换行、空格、回车)),Node


节点的属性:

nodeType:节点的类型:1=====》标签,     2=======》属性,   3======》文本

nodeName:节点的名字:标签节点---》大写的标签名字,属性节点---》小写的属性名字,文本节点-----#text

nodeValue:节点的值:标签节点----null,属性节点-----属性值,文本节点-----文本内容


获取相关的节点:

1.获取当前节点的父级节点:

//获取当前标签的id对象

var a = document.getElementById("id名称");

//在控制台输出当前标签的父级节点

console.log(a.parentNode);

//在控制台输出当前标签的父级元素

console.log(a.parentElement);

//在控制台输出标签的属性

 console.log(ulObj.parentNode.nodeType);//标签的---1
 console.log(ulObj.parentNode.nodeName);//标签---大写的标签名字
 console.log(ulObj.parentNode.nodeValue);//标签---null

2.获取所有的子节点和子元素

//获取标签对象

var a = document.getElementById("id名称");

//在控制台输出

console.log(a.childNodes);

console.log(a.children);

3.获取节点的其他方法

//获取父级节点

console.log(a.parentNode);

//获取父级元素

console.log(a.parentElement);

//获取子节点

console.log(a.childNodes);

//获取子元素

console.log(a.children);

//获取第一个子节点

console.log(a.firstChild);

//获取第一个子元素

console.log(a.firstElementChild);

//获取最后一个子节点

console.log(a.lastChild);

//获取最后一个子元素

console.log(a.lastElementChild);

//获取某个元素的前一个兄弟节点

console.log(a.previousSibling);

//获取某个元素的前一个兄弟元素

console.log(a.previousElementSibling);

//获取某个元素的后一个兄弟节点

console.log(a.nextSibling);

//获取某个元素的后一个兄弟元素

console.log(a.nextElementSibling);













评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值