nodeType屬性在vue原始碼中的使用

2022-07-04 13:33:10 字數 989 閱讀 2200

每個節點都有乙個 nodetype 屬性,用於表明節點的型別,節點型別由node型別中定義12個常量表示:

nodetype在vue中的應用

在vue編譯的過程中需要查詢html結構中的雙大括號,或者@事件等代表vue中的資料及方法的屬性值,通過編譯將查詢到的部分使用vue例項中的屬性或方法替換

class compile 

node2fragment(el)

return

fragment

}//遞迴el,分別處理文字節點和元素節點

compile(el)

else

if (this

.isinter(node)) }實行

'插值文字:'+node.textcontent);

this

.compiletext(node);

}//遞迴子節點

if (node.childnodes && node.childnodes.length > 0) })}

//文字節點,且內容是}實行

isinter(node) \}/.test(node.textcontent)

}//編譯元素節點

compileelement(node) })}

compiletext(node)

//通用update方法

update(node, exp, dir) )

}textupdator(node, value)

text(node, exp)

html(node, exp)

htmlupdator(node, value)

}

以上是簡單的進行屬性查詢的示例,通過nodetype為1來判斷是元素節點,還是文字節點並進行相應的操作。

nodeType 節點型別 屬性值說明

文章參考 nodetype屬性值是乙個唯讀屬性,返回乙個數字,表示當前節點的型別。節點名稱 nodetype 元素節點 1屬性節點 2文字節點 3注釋節點 8document文字節點 9documenttype節點 10documentfragment節點 11常見舉例 div p span 等這些...

關於vue基礎 vue屬性

單頁面應用 元件化開發 組建的重用性 開發便捷 m model 資料 v view 檢視 指的就是看到的頁面 vm viewmodel 檢視模型 是mvvm模式的核心 是連線view和model的橋梁 有兩種方法 乙個是將檢視轉換成資料模型,將看到的頁面轉換成後端資料,實現方式 dom監聽 另一種是...

vue 計算屬性

在這裡我覺得講 computed 和methods放在一起討論 更 便於 理解。computed var vm new vue computed methods methods methods和computed從顯示效果是一樣的,但是主要的區別是 1.computer 是存在快取的,在data沒有改...