DOM

通过 id 查找 HTML 元素
DOM 中查找 HTML 元素最简单的方法是使用元素的 id。

document.getElementById("div")

如果元素被找到,此方法会以对象返回该元素
如果未找到元素,myElement 将包含 null。
通过标签名查找 HTML 元素
查询指定父元素下指定标签的元素对象集合 (所有子代元素对象)
就算查找到的只有一个元素,也是放在集合中

document.getElementsByTagName("button")

通过类名查找 HTML 元素
需要找到拥有相同类名的所有 HTML 元素
查找任意父元素下指定calss属性的元素对象 返回一个集合(所有子代元素对象)

getElementsByClassName("span")

通过类名查找元素不适用于 Internet Explorer 8 及其更早版本。

返回的集合都是类数组,可以使用数组下标查找指定位置的值

nodeType : 返回值 number
document 文档 : 9
element元素 : 1
text 文本: 3
属性 : 2
通过返回值查看返回的是什么

node父子关系
node.parentNode 获得node的父节点
node.childNodes 获得node的直接子代节点
node.firstChild 获得node下的第一个子节点
node.lastChild 获得node下最后一个子节点
node兄弟关系
node.previousSibling 返回当前节点的前一个兄弟节点(同级)
node.nextSibling 返回当前节点的下一个兄弟节点(同级)

elem父子关系
elem.parentElement 返回父元素对象
elem.children 返回子元素对象集合
elem.firstElementChild 返回第一个子元素对象
elem.lastElementChild 返回最后一个子元素对象
elem兄弟关系
elem.previousElementSibling 返回当前元素的前一个兄弟元素(同级)
elem.nextElementSibling 返回当前元素的下一个兄弟元素(同级)

innerHTML : 获取元素内容/改变元素内容

通过层级关系看DOM树的结点

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值