jQuery中實現text的方法

一、有這樣一段 html

jQuery中實現text的方法

二、jQuery 的 text() 方法
(1)當直接調用 $().text()時,.text()的作用是(循環)讀取(多個)目標元素的textContent/nodeValue
簡單實現:
jQuery中實現text的方法

(2)當調用$().text(value)時,.text(value)的作用是為每一個符合條件的目標元素的textContent設置為 value
簡單實現:
writeText():
jQuery中實現text的方法

customEmpty():
jQuery中實現text的方法

(3)源碼實現
源碼:
jQuery.text()總體:
jQuery中實現text的方法

源碼解析:
① 調用text() , 實際上是調用access()
也就是說:調用jQuery.access()相當于調用了fn.call( elems, value ),即自定義的方法jQuery.access(this, function(value) {xxx})
② .text()的情況調用這部分源碼:
jQuery.text()調用的其實是Sizzle.getText():
jQuery中實現text的方法

③ .text(value)的情況調用這部分源碼:
jQuery.text(value):
jQuery中實現text的方法

empty():
jQuery中實現text的方法

④ 總結
$(".divOne").text()的本質:
(1)節點內容是文本,返回$(".divOne")[i].textContent
(2)節點內容不是文本,循環返回$(".divOne")[i].element[j].textContent
(3)節點內容是文本節點或一個文檔的CDATA部分,則返回$(".divOne")[i]. nodeValue
$(".divOne").text("Hello world!")的本質:
(1)jQuery.cleanData()
(2)$(".divOne")[i].textContent = ""
(3)$(".divOne")[i].textContent="Hello world!"
【jQuery中實現text的方法】注意:text() 不會去解析 html 標簽!
完整代碼:
jQuery中實現text的方法


jQuery中實現text的方法

總結
以上所述是小編給大家介紹的jQuery中實現text()的方法 , 非常不錯,具有一定的參考借鑒價值 , 需要的朋友參考下吧 。

相關經驗推薦