Vue.js是一個流行的JavaScript框架，它提供了一種靈活且直觀的方式來操作DOM元素。通過Vue的虛擬DOM，你可以在不直接操縱DOM的情況下，更改和更新頁面元素。

Vue中最常用的DOM操作是通過Vue實例中的$data屬性來訪問和修改數據。下面展示了一個簡單的Vue組件：

Vue.component('my-component', {
template: '
{{ message }}
',
data: function() {
return {
message: 'Hello World!'
}
}
});

在上面的組件中，我們定義了一個data屬性，并返回一個包含message屬性的對象。然后，在組件的模板中使用了這個message屬性。當Vue實例加載時，message屬性值就會被注入到DOM中。

除了在組件的模板中直接使用數據外，Vue還提供了直接訪問DOM元素的方法。例如，如果我們想要獲取一個元素的引用，可以使用Vue的$refs對象：

Vue.component('my-component', {
template: '
',
mounted: function() {
console.log(this.$refs.myRef);
}
});

在上面的組件中，我們使用了Vue的mounted鉤子函數，當組件掛載到DOM中后，它會將引用存儲在$refs對象中。這使我們能夠訪問元素的屬性和方法。在上面的例子中，我們使用console.log()方法來輸出元素的引用。

總之，Vue.js提供了許多靈活的方法來操作DOM元素。使用Vue的虛擬DOM和$data屬性，我們可以更改和更新頁面元素。同時，Vue還提供了$refs對象，使我們可以訪問和操作DOM元素。