vue如何获取dom元素子节点_JavaScript 总结-Web API-DOM

前言：Vue 和 React 框架应用广泛，封装了 DOM 操作，但 DOM 操作是前端工程师必备基础知识

一、DOM 本质

DOM：document object model

document:：HTML 文档

object：JS 对象，把 HTML 文档结构映射存储为 JS 对象

model：document 与 object 的这种关系为 model

二、DOM 节点操作

1. 获取 DOM 节点

1.1 通过顶层 document 节点获取：

document.getElementById("ID")
document.getElementsByName("Name")
document.getElementsByClassName("className")
document.getElementsByTagName("tagName") 

1.2 通过父节点获取

parentObj.firstChild：获取父节点下的第一个子节点（会将空格和换行计入），这个属性是可以递归使用的，即支持parentObj.firstChild.firstChild...的形式，如此就可以获得更深层次的节点。
parentObj.firstElementChild：获取父节点下的第一个子元素节点
parentObj.lastChild：获取父节点下的最后一个子节点（会将空格和换行计入）。与firstChild一样&