Vue3获取DOM节点有几种方法？能否详细介绍一下？

本文共计426个文字，预计阅读时间需要2分钟。

目录 + 1. 原生js获取DOM节点：

2.Vue2中获取当前组件的实例对象：

3.Vue3中获取当前组件的实例对象：

总结 + 1. 原生js获取DOM节点：使用document.querySelector()选择器或document.getElementById()按id选择。

目录

• 1 .原生js获取 DOM 节点：
• 2. vue2中获取当前组件的实例对象：
• 3.vue3中获取当前组件的实例对象：
• 总结

1 .原生js获取 DOM 节点：

document.querySelector(选择器) document.getElementById(id选择器) document.getElementsByClassName(class选择器) ....

2. vue2中获取当前组件的实例对象：

因为每个vue的组件实例上，都包含一个$refs对象，里面存储着对应的DOM元素或组件的引用。所以在默认情况下，组件的 $refs指向一个空对象。

可以先在组件上加上 ref="名字"，然后通过 this.$refs.名字获取相应元素并进行操作。