js获取子节点的方法

1、通过获取DOM方式直接获取子节点

其中price为父标签id的值,div为标签的名字。getElementsByTagName是一个方法。返回的是一个数组。在访问的时候按数组的形式访问即可,如var a = document.getElementById("price").getElementsByTagName("div")[0] 返回的是数组里面的第一个元素。

var a = document.getElementById("price").getElementsByTagName("div"); 

2、通过childNodes 获取子节点

childNodes返回的是子节点的集合,也是数组的格式,不过它会把换行和空格也当成节点信息,不推荐使用。

var b =document.getElementById("price").childNodes;

3、通过children来获取子节点

children获取子元素是最好用的,它返回的也是一个数组,并且会过滤掉一些不必要的信息,如换行、空格等。

var c = document.getElementById("price").children;

4、通过firstChild获取第一个子节点

firstChild和childNodes类似,浏览器在解析它的时候的时候会把换行和空格一起解析,不推荐使用

var d = document.getElementById("price").firstChild;

5、通过firstElementChild获取第一个子节点

使用firstElementChild来获取第一个子元素,可直接获取第一个子元素,并不会将换行和空格一起解析

var e = document.getElementById("price").firstElementChild;

6、获取最后一个子节点

1.lastChild

2.lastElementChild

lastChild获取最后一个子节点的方式其实和firstChild是类似的。同样的lastElementChild和firstElementChild也是一样的。不再赘余。

var f = document.getElementById("price").lastChild;
var g = document.getElementById("price").lastElementChild;

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值