节点类型:
document | 文档节点、整个页面 |
documentType | 文档类型节点 |
Element | 元素节点、标签节点 |
Attribute | 属性节点 |
Text | 文本节点 |
Comment | 注释节点 |
要用JS方式去对元素进行处理的话,通常需要先去获取元素的节点,然后针对节点进行加工。
在js中有以下几种方式去获取节点:
一般来说,获取节点是需要在页面上获得的,故通常有document的前缀
document.getElementById | 通过Id属性去查询符合的标签 |
document.getElementsByClassName | 通过配对class属性名来查询标签 |
document.getElementsByTagName | 通过配对标签名去查询标签 |
document.getElementsByName | 通过配对name属性获取标签 |
通过选择器查询:
document.querySelector | 通过配对class来配对标签,配对第一个 |
document.querySelectorAll | 通过配对class来获取标签,配对所有满足条件的 |
在以上选择器中,可以进行套用来获取某个子元素,除了document.getElementById和document.querySelector是只获取第一个符合条件的外,其他配合方式都是需要加上下标,使用中括号+数字的方式去精确到某个元素后才能进行下一步的获取。
例如:
document.getElementsTagName('div')[1].getElementsByTagName('p')
是指获取页面第2个div标签中的所有子代p标签。