获取元素节点
通过document对象调用。
getElementById() 通过id属性获取一个元素节点对象
getElementsByTagName() 通过标签名获取一组元素节点对象。该方法会给我们返回一个类数组对象,所有查询到的元素都会封装到对象中。
getElementsByName() 通过name属性获取一组元素节点对象。
获取元素节点的子节点
通过具体的元素节点调用。
getElementsByTagName() 方法
childNodes 属性。当前节点的所有子节点。
该属性会获取包括文本节点在内的所有节点。
DOM标签间内的空白也会被当成节点。(IE8及其以下浏览器中除外)
firstChild 属性。当前节点的第一个子节点。
lastChild 属性。表示当前节点的最后一个子节点。
获取当前元素的子元素
通过具体节点调用。
children 属性。当前元素的所有子元素。
firstElementChild 属性。当前元素的第一个子元素。不支持IE8及其以下的浏览器。
lastElementChild 属性。当前元素的最后一个子元素。
获取父节点和兄弟节点
通过具体节点调用。
parentNode 属性。当前节点的父节点。
previousSibling 属性。当前节点的前一个兄弟节点。也会获取到空白文本。
nextSibling 属性。当前节点的后一个兄弟节点。
获取兄弟元素
previousElementSibling 获取前一个兄弟元素。IE8及其以下不支持。
nextElementSibling 获取后一个兄弟元素。
读取元素节点属性
直接使用元素.属性名。
特殊:元素.className
获取body
document.body
获取html根标签
document.documentElement
根据元素class属性查询一组元素节点
getElementsByClassName() IE8及其以下不支持。
根据CSS选择器查询元素节点对象
querySelector("") 参数是选择器字符串。使用该方法总会返回唯一的一个元素。如果满足条件的元素有多个,只会返回第一个。
querySelectorAll("") 和上面的用法类似。不同的是它会将符合条件的元素封装到数组中。