在Web開發中，經常需要通過JavaScript操作DOM，Vue提供了一種直觀，簡單的方式來獲取DOM標簽，以及操作其屬性。

// 在Vue實例中引入元素
Vue獲取DOM標簽演示
獲取input的值

Vue提供了ref屬性，用于標記DOM元素。ref屬性可以用在普通的HTML元素上，也可以用在組件上。使用ref為元素或組件注冊引用 ID，引用信息將注冊在父組件的$refs對象上。

Vue實例提供了$refs屬性，它提供對已命名注冊的子組件的訪問，也提供訪問子元素或DOM組件。例如我們可以通過this.$refs.input獲取input節點的value值。

...
methods: {
getValue() {
console.log(this.$refs.input.value);
}
}

注意，使用$refs只保證之前訪問過的節點的實時性，在下一次DOM更新前，如果訪問不存在的$refs引用，得到的是undefined。

除了$refs，Vue還提供了ref-in-for指令，它可以給我們在循環中引用渲染出來的元素。

{{ item.text }}
mounted () {
console.log(this.$refs.test1); // 已注冊的第一項li標簽節點
},

使用refs引用，可以使代碼更加簡單、易于閱讀和維護，并且提高Vue和DOM元素的交互效率。但是，在使用ref時，建議謹慎對待以免過度使用，引起代碼混亂和性能問題。