JavaScript中DOM的層次節點（二）

hzx 發布于2019-08-19 17:20 / 3405人閱讀

摘要：將添加到節點的末尾。從指定的位置將當前文本節點分成兩個文本節點。類型值區域中的內容沒有子節點類型此類型在瀏覽器中并不常用，只有和支持。類型特性就是元素屬性的節點。

1 Text類型

Text類型為文本節點，包含的是可照字面解釋的純文本內容，可以包含轉義后的HTML字符，但不能包含HTML代碼。

類型	值
nodeType	3
nodeName	"#text"
nodeValue	節點所包含的文本
parentNode	Element
沒有節點

可以通過nodeValue和data屬性訪問Text節點中包含的文本。

appendData(text):將text添加到節點的末尾。

deleteData(offset,count):從offset置頂的位置開始刪除count個字符。

insertData(offset,text):在offset位置插入text。

replaceData(offset,count,text):用text替換從offset指定的文職到offset+count為止的文本。

splitText(offset):從offset指定的位置將當前文本節點分成兩個文本節點。

substringData(offset,count):提取從offset指定的位置開始到offset+count處的字符串。

length：長度。

創建文本節點

    document.createTextNode("Hello world");
    document.createElement("div");
    document.body.appendChild(element);//在未添加之前，雖然創建，但是不會顯示出來

如果創建多個文本節點，且是相鄰的同胞節點，那么兩個節點的文本會連起來顯示，中間不會有空格。

2 Comment類型

類型	值
nodeType	8
nodeName	"#comment"
nodeValue	注釋的內容

Comment類型與Text類型繼承自相同的基類，因此它擁有除splitText()之外的所有字符串操作方法，與Text類似，也可以使用nodeValue和data屬性來取得注釋的內容。

3 CDATASection類型

CDATASection類型只針對XML文檔，表示的是CDATA區域，與Comment類似，繼承自Text類型，因此擁有除splitText()之外的所有字符串操作方法。

類型	值
nodeType	4
nodeName	"#cdata-section"
nodeValue	CDATA區域中的內容
沒有子節點

4 DocumentType類型

此類型在Web瀏覽器中并不常用，只有Firefox、Safari和Opera支持。

類型	值
nodeType	10
nodeName	doctype名稱
nodeValue	null

DocumentType對象不能動態創建，只能通過解析文檔代碼的方式來創建。若瀏覽器支持此類型，會把此對象保存在document.doctype中。

5 Attr類型

特性就是元素attribute屬性的節點。在所有瀏覽器中，都可以訪問Attr類型的構造函數和原型。

類型	值
nodeType	11
nodeName	特性的名稱
nodeValue	特性的值

特性雖然是節點，但不會被認為是DOM文檔樹的一部分，最常用的方法為getAttribute(),setAttribute()和remveAttribute()，很少會直接引用特性節點。

云服務器 GPU云服務器 js中操作dom節點 javascript的dom對象 javascript的dom編程 dom的節點類型

文章版權歸作者所有，未經允許請勿轉載,若此文章存在違規行為，您可以聯系管理員刪除。

轉載請注明本文地址：http://specialneedsforspecialkids.com/yun/78433.html

javaScript 高級程序設計筆記——DOM

摘要：一類型在中，所有的節點類型都繼承自類型。包含文檔中所有帶特性的元素包含文檔中所有的元素包含文檔中所有的元素包含文檔中所有帶特性的元素一致性檢測因為分為多個級別，也包含多個部分，因此檢測瀏覽器實現了的哪些部分就十分必要。 DOM是針對HTML和XML文檔的一個APIDOM描繪了一個層次化的節點樹，允許開發人員輕松自如地添加、刪除、替換、修改頁面的某一部分一、節點層次 DOM將HTML文...

JinB 2019-08-20 19:03 評論0 收藏0
webkit渲染機制淺析

摘要：模塊和將下面的渲染機制，安全機制，插件機制等等隱藏起來，提供一個接口層。進行網頁的渲染進程，可能有多個。最后進程將結果由線程傳遞給進程最后，進程接收到結果并將結果繪制出來。這是之前在簡書上面的處女作，也搬過來了，以后就一直在 segmentfault 上面寫文章了，webkit技術內幕-朱永盛是我大四買的書，很舊的一本書了，當時只看了一點點，一直沒繼續看完它，現在才看完，，，說來慚愧...

Cobub 2019-08-02 11:03 評論0 收藏0
JavaScript中DOM的層次節點（一）

摘要：是針對和文檔的一個，描繪了一個層次化的節點樹，允許開發人員添加修改刪除節點的一部分。類型級定義了接口，該接口由中的所有節點類型實現。添加的這些屬性分別對應于每個元素中都存在的下列標準特性。 DOM是針對HTML和XML文檔的一個API，描繪了一個層次化的節點樹，允許開發人員添加、修改、刪除節點的一部分。 DOM將HTML和XML文檔描繪成一個有多個節點構成的結構，節點分為12種不同的...

leap_frog 2019-08-19 17:19 評論0 收藏0
《Webkit技術內幕》之頁面渲染過程

摘要：文章同步到技術內幕之頁面渲染過程最近拜讀了傳說中的技術內幕一書，有很大收獲，尤其是對頁面渲染有了較深的認識。解析語法分析，基于詞法解釋器生成的新標記，構建成抽象語法樹，解析器嘗試將其與某條語法規則進行匹配。文章同步到github《Webkit技術內幕》之頁面渲染過程最近拜讀了傳說中的《Webkit技術內幕》一書，有很大收獲，尤其是對頁面渲染有了較深的認識。由于功力有限，而且書中設...

vvpvvp 2019-08-29 16:17 評論0 收藏0
《Webkit技術內幕》之頁面渲染過程

摘要：文章同步到技術內幕之頁面渲染過程最近拜讀了傳說中的技術內幕一書，有很大收獲，尤其是對頁面渲染有了較深的認識。解析語法分析，基于詞法解釋器生成的新標記，構建成抽象語法樹，解析器嘗試將其與某條語法規則進行匹配。文章同步到github《Webkit技術內幕》之頁面渲染過程最近拜讀了傳說中的《Webkit技術內幕》一書，有很大收獲，尤其是對頁面渲染有了較深的認識。由于功力有限，而且書中設...

adam1q84 2019-08-23 10:43 評論0 收藏0