var dom = document.getElementById(id)
var nodeName = dom.nodeName
var childNodes = dom.childNodes
var nodeType = dom.nodeType
console.log(dom);             // 节点
console.log(nodeName);        // 节点名
console.log(childNodes);      // 子节点
console.log(nodeType);        // 节点类型
console.log(dom.innerText);   // dom节点文本

获取目标元素的下一个兄弟节点：

let item = document.getElementById(id)
let nextNode = item.nextElementSibling  // 目标元素下一个兄弟节点

获取目标元素的第一个子节点：

var item = document.getElementById(id)
var firstNode = item.firstElementChild;   // 元素的第一个子节点

如何获取当前元素最后一个子元素的class属性？

1. 获取当前元素
2. 获取当前元素的最后一个子元素
3. 获取最后一个子元素的class属性

实例：我现在希望点击事件发生后执行以下操作——获取class名为fr的span元素，判断其是否有close类型，如果有，删除close后添加open类型。如果是open, 则相反。

<div class="Screen-criteria-head" @click.stop="slideDropdownMenu($event)">
    <span class="fl">筛选条件</span>
    <span class="fr close"></span>
</div>

1. 获取当前元素

 slideDropdownMenu (event) {
    let el = event.currentTarget
 }

1. 获取最后一个子元素

slideDropdownMenu (event) {
    let el = event.currentTarget
    console.log(el)
    console.log(el.lastChild)          // 最后一个子节点
    console.log(el.firstElementChild)  // 第一个子元素
    console.log(el.lastElementChild)   // 最后一个子元素
}