第一個(gè)例子

    <div id="app">
        <p>{{msg}}</p>
    </div>
    <script>
        var app = new Vue({
            el: '#app',
            data: {
                msg: 'Hello Vue'
            }
        })
        app.msg=123;
        console.log(app) ;
    </script>

第二個(gè)例子

    <div id="app">
        <p>{{msg}}</p>
    </div>
    <script>
        new Vue({
            el: '#app',
            data: {
                msg: 'Hello Vue'
            }
        })
        app.msg=123;
        console.log(app) ;
    </script>

這兩個(gè)例子在頁面渲染上是沒有差別的,但是在控制臺輸出的console.log(app)是有差別的

第一個(gè)是一個(gè)vue實(shí)例

Vue {_uid: 0, _isVue: true, $options: {…}, _renderProxy: Proxy, _self: Vue, …}

第二個(gè)僅僅是一個(gè)DOM對象

<div id="app'>Hello Vue</div>

如果dom元素的id沒有和js內(nèi)置對象重名，或者沒有被重寫，那么這個(gè)id的“變量”是指向這個(gè)dom元素的。即：不對app進(jìn)行重新賦值，則app指向dom元素。由于第一種方法對app重新賦值，所以app指向了Vue對象。

另外，<img name="app">這樣的也會有類似的效果