HTML文檔的訪問端口DOM (Document Object Model)

節內容是"VBA信息獲取與處理"教程中第八個專題"VBA與HTML文檔"的第五節。，希望想掌握這方面知識的朋友能參考我的教程學習。

第五節 HTML文檔的訪問端口DOM (Document Object Model)

大家好，我們繼續對HTML文檔進行學習，在前幾節中我們認識了網頁文檔上面的各種元素，那么我們又該怎么訪問他們呢，是如何實現呢？其實，HTML文檔，提供了訪問其元素的端口，這就是HTML DOM，其定義了一套標準的針對 HTML 文檔的對象訪問或操作的機制。HTML DOM 定義了所有 HTML 元素的對象和屬性，以及訪問它們的方法。換言之，HTML DOM 是關于如何獲取、修改、添加或刪除 HTML 元素的標準。

1 HTML DOM (Document Object Model) 對象集合

每個載入瀏覽器的 HTML 文檔都會成為 Document 對象。Document 對象使我們可以從腳本中對 HTML 頁面中的所有元素進行訪問。Document 對象是 HTML 文檔的根節點。

特別注意：Document 對象是 Window 對象的一部分，可通過 window.document 屬性對其進行訪問。

集合描述

all[] 提供對文檔中所有 HTML 元素的訪問。

anchors[] 返回對文檔中所有 Anchor 對象的引用。

applets 返回對文檔中所有 Applet 對象的引用。

forms[] 返回對文檔中所有 Form 對象引用。

images[] 返回對文檔中所有 Image 對象引用。

links[] 返回對文檔中所有 Area 和 Link 對象引用。

VBA直接支持調用的對象有限，如下：

對象描述

Document 代表整個 HTML 文檔，可被用來訪問頁面中的所有元素

Anchors 代表 <a> 元素集合

Body 代表 <body> 元素

Forms 代表 <form> 元素集合

Frames 代表 <frame> 元素或<iframe> 元素集合

Images 代表 <img> 元素集合

Links 代表 <link> 元素集合

Options 代表 <option> 元素集合（select元素里面可以直接使用）

Cells 代表 <td> 元素集合（table元素里面可以直接使用）

Rows 代表 <tr> 元素集合（table元素里面可以直接使用）

All 對象集合，提供對文檔中所有 HTML 元素的訪問。

上述VBA支持直接調用對象的元素，調用起來就非常方便了，可以用序號調用，例如forms(0)，也可以按名稱/ID調用，例如forms("名稱/ID")。其他沒法直接調用對象的元素，可以間接從通用all對象集合中去調用該元素或該元素對應的dom對象。

2 HTML DOM 文檔的節點及文檔樹

在HTML DOM中，所有事物都是節點。DOM 是被視為節點樹的 HTML文檔的每一部分都是節點，整個文檔被定義為一個文檔節點，每個標簽是一個元素節點，包含在元素中的文本是文本節點，每一個元素的屬性是一個屬性節點。如下：

1）整個文檔是一個文檔節點

2）每個 HTML 元素是元素節點

3）HTML 元素內的文本是文本節點

4）每個 HTML 屬性是屬性節點

5）注釋是注釋節點

HTML DOM 將 HTML 文檔視作樹結構。這種結構被稱為節點樹，這時一個非常形象的比喻，根節點就是html，主干就是body等，枝干就是body內含的各種元素節點，葉子和花就是元素節點關聯的元素的屬性（屬性節點）或內含文本（文本節點）。

通過 HTML DOM，樹中的所有節點均可通過 JavaScript 進行訪問。所有 HTML 元素（節點）均可被修改，也可以創建或刪除節點。節點樹中的節點彼此擁有層級關系。父（parent）、子（child）和同胞（sibling）等術語用于描述這些關系。父節點擁有子節點。同級的子節點被稱為同胞（兄弟或姐妹）。

網頁文檔，可以說是由元素組合而成的，也可以說是由節點連接而成的樹構造的。節點是文檔樹結構中特有的名詞，元素是節點，但是節點不一定是元素，節點還有文檔節點、文本節點、屬性節點等；元素是元素節點的擴展，元素可以擁有屬性還有文本。初學者不是很必要糾結元素和節點的區別，這個需要甚至數據結構、類和繼承等知識。可大致理解為，同一個html dom對象，提供的兩個不同接口。如下的程序，你會發現，他既有支持node（節點）的相關屬性和方法，也提供了element（元素）的相關屬性和方法。

Sub MYNZ()

Dim ie, dmt, bd

Set ie = CreateObject("InternetExplorer.Application") '創建一個IE對象

With ie

.Visible = True '顯示它

.navigate "http://www.baidu.com" '加載某個頁面

Do Until .ReadyState = 4 '等待頁面加載完畢

DoEvents

Loop

Set dmt = .document '將IE瀏覽器加載的頁面文檔，賦予dmt變量

Set bd = dmt.body '將文檔的body賦予bd變量

End With

End Sub

代碼截圖：

按F8鍵運行截圖：

3 HTML DOM 文檔的對象屬性

屬性是節點（HTML 元素）的值，您能夠獲取或設置。所有 HTML 元素被定義為對象，而編程接口則是對象方法和對象屬性。我們看看下面一些常見的屬性：

1）innerHTML 屬性對象內部的HTML代碼，是獲取元素內容的最簡單方法。innerHTML 屬性對于獲取或替換 HTML 元素的內容很有用。

下面的代碼獲取 id="intro" 的 <p> 元素的 innerHTML：

var txt=document.getElementById("intro").innerHTML;

document.write(txt);

2）OuterHtml：對象的HTML代碼，包括對象本身的HTML標簽

3）innerText：對象內部的文本

4）OuterText：對象的文本，包括對象本身的文本

5）nodeName 屬性 nodeName 屬性規定節點的名稱。

nodeName 是只讀的

元素節點的 nodeName 與標簽名相同

屬性節點的 nodeName 與屬性名相同

文本節點的 nodeName 始終是 #text

文檔節點的 nodeName 始終是 #document

注釋：nodeName 始終包含 HTML 元素的大寫字母標簽名。

6）nodeValue 屬性 nodeValue 屬性規定節點的值。

元素節點的 nodeValue 是 undefined 或 null

文本節點的 nodeValue 是文本本身

屬性節點的 nodeValue 是屬性值

7）nodeType 屬性 nodeType 屬性返回節點的類型。nodeType 是只讀的。

比較重要的節點類型有：

元素類型 NodeType

元素 1

屬性 2

文本 3

注釋 8

文檔 9

以上只是給出了屬性值，大家在使用的時候要注意。

本節知識點回向：

什么是HTML DOM文檔的屬性，常用的屬性有哪些。

本節參考文件：008工作表.xlsm

積木編程的思路內涵：

在我的系列書籍中一直在強調"搭積木"的編程思路，這也是學習利用VBA的主要方法，特別是職場人員，更是要采用這種方案。其主要的內涵：

1 代碼不要自己全部的錄入。你要做的是把積木放在合適的位置然后去修正代碼，一定要拷貝，從你的積木庫中去拷貝，然后修正代碼，把時間利用到高效的思考上。

2 建立自己的"積木庫"。平時在學習過程中，把自己認為有用的代碼放在一起，多積累，在用到的時候，可以隨時拿來。你的積木庫資料越多，你做程序的思路就會越廣。

VBA的應用界定

VBA是利用Office實現個人小型辦公自動化的有效手段（工具）。這是我對VBA的應用界定。在取代OFFICE新的辦公軟件沒有到來之前，誰能在數據處理方面做到極致，誰就是王者。其中登峰至極的技能非VBA莫屬！

我記得20年前自己初學VBA時，那時的資料甚少，只能看源碼自己琢磨,真的很難。20年過去了，為了不讓學習VBA的朋友重復我之前的經歷，我根據自己多年VBA實際利用經驗，推出了六部VBA專門教程：

第一套：VBA代碼解決方案 是VBA中各個知識點的講解，教程共147講，覆蓋絕大多數的VBA知識點，初學必備；

第二套：VBA數據庫解決方案 數據庫是數據處理的專業利器，教程中詳細介紹了利用ADO連接ACCDB和EXCEL的方法和實例操作，適合中級人員的學習。

第三套：VBA數組與字典解決方案 數組和字典是VBA的精華，字典是VBA代碼水平提高的有效手段，值得深入的學習，是初級及中級人員代碼精進的手段。

第四套：VBA代碼解決方案之視頻 是專門面向初學者的視頻講解，可以快速入門，更快的掌握這門技能。這套教程是第一套教程的視頻講解，聽元音更易接受。

第五套：VBA中類的解讀和利用這是一部高級教程，講解類的虛無與肉身的度化，類的利用雖然較少，但仔細的學習可以促進自己VBA理論的提高。這套教程的領會主要是讀者的領悟了，領悟一種佛學的哲理。

第六套教程：《VBA信息獲取與處理》，這是一部高級教程，涉及范圍更廣，實用性更強，面向中高級人員。教程共二十個專題，包括：跨應用程序信息獲得、隨機信息的利用、電子郵件的發送、VBA互聯網數據抓取、VBA延時操作，剪切板應用、Split函數擴展、工作表信息與其他應用交互，FSO對象的利用、工作表及文件夾信息的獲取、圖形信息的獲取以及定制工作表信息函數等等內容。

大家可以根據以上資料1→3→2→6→5或者是4→3→2→6→5的順序逐漸深入的逐漸學習。教程提供講解的同時提供了大量的積木，如需要可以WeChat: NZ9668

學習VBA是個過程，也需要經歷一種枯燥的感覺

如太白詩云：眾鳥高飛盡，孤云獨去閑。相看兩不厭，只有敬亭山。學習的過程也是修心的過程，修一個平靜的心。在代碼的世界中，心平靜了，心情好了，身體自然而然就好。心靜則正，內心里沒有那么多邪知邪見，也就沒有那么多妄想。利人就是利己。這些教程也是為幫助大家起航，助上我自己之力，我的上述教程是我多的經驗的傳遞，

"水善利萬物而不爭"，綿綿密密，微則無聲，巨則洶涌。學習亦如此，知道什么是自己所需要的，不要蜷縮在一小塊自認為天堂的世界里，待到暮年時再去做自欺欺人的言論。要努力提高自己，用一顆充滿生機的心靈，把握現在，這才是進取。越是有意義的事情，困難會越多。愿力決定始終，智慧決定成敗。不管遇到什么，都是風景。看淡紛爭，看輕得失。茶，滿也好，少也好，不要計較；濃也好，淡也好，其中自有值得品的味道。去感悟真實的時間，靜下心，多學習，積累福報。而不是天天混日子，也不是天天熬日子。在后疫情更加嚴峻的存量殘殺世界中，為自己的生存進行知識的儲備，特別是新知識的儲備。學習時微而無聲，利用時則巨則洶涌。

每一分收獲都是成長的記錄，怎無憑，正是這種執著，成就了朝霞的燦爛。最后將一闕詞送給致力于VBA學習的朋友,讓大家感受一下學習過程的枯燥與執著：

浮云掠過，暗語無聲，

唯有清風，驚了夢中啼鶯。

望星，疏移北斗，

奈將往事雁同行。

阡陌人，昏燈明暗，

忍顧長亭。

多少VBA人，

暗夜中，悄聲尋夢，盼卻天明。

怎無憑！

回向學習利用VBA的歷歷往事，不勝感慨，謹以這些文字給大家，分享我多年工作實際經驗的成果，隨喜這些有用的東西，給確實需要利用VBA的同路人。

分享成果，隨喜正能量

頭條創作挑戰賽# HTMLStyleElement 對象是 Excel VBA 中用來操作 HTML 樣式的元素對象。它表示 HTML 頁面中的樣式標簽（<style>）。

下面是 6 個代碼實例，用來說明 HTMLStyleElement 對象的用法：

1、創建一個新的 <style> 元素對象，并將其添加到 HTML 文檔中：

Dim style As Object
Set style = ThisWorkbook.Sheets("Sheet1").OLEObjects.Add(ClassType:="HTML Style")

2、設置 <style> 元素的 innerHTML 屬性，即添加樣式規則：

style.Object.innerHTML = "body { background-color: lightblue; }"

3、獲取 <style> 元素的 innerHTML 屬性，即獲取樣式規則：

Dim styleRules As String
styleRules = style.Object.innerHTML

4、將 <style> 元素插入到 HTML 文檔中的某個節點之前：

Dim targetNode As Object
Set targetNode = ThisWorkbook.Sheets("Sheet1").OLEObjects("targetNode")

targetNode.ParentNode.insertBefore style.Object, targetNode

5、從 HTML 文檔中移除 <style> 元素：

style.Delete

6、通過指定 <style> 元素的 id 屬性，獲取具有特定 id 的 <style> 元素對象：

Dim styleId As String
styleId = "myStyle"

Dim style As Object
Set style = ThisWorkbook.Sheets("Sheet1").OLEObjects(styleId).Object

通過以上的代碼實例，你可以了解如何創建、設置、獲取、移除和查找 HTMLStyleElement 對象。注意，在上述代碼中，ThisWorkbook.Sheets("Sheet1") 可以根據你的具體情況進行修改，以指定你要操作的工作表。

當我感到壓力或需要放松時，我通常會使用 Excel 來記錄和跟蹤我的情緒和心理狀態。我創建了一個簡單的示例，使用 HTMLStyleElement 對象在 Excel 中應用不同的樣式主題來反映我的情緒。

Sub ApplyEmotionalStyle()
    ' 創建新的 HTMLStyleElement 對象
    Dim style As Object
    Set style = ThisWorkbook.Sheets("Sheet1").OLEObjects.Add(ClassType:="HTML Style")
    
    ' 根據情緒類型設置樣式規則
    Dim mood As String
    mood = InputBox("請輸入你的情緒類型（例如：happy、sad、excited、calm）：")
    
    Select Case mood
        Case "happy"
            style.Object.innerHTML = "body { background-color: yellow; }"
        Case "sad"
            style.Object.innerHTML = "body { background-color: blue; }"
        Case "excited"
            style.Object.innerHTML = "body { background-color: red; }"
        Case "calm"
            style.Object.innerHTML = "body { background-color: green; }"
        Case Else
            MsgBox "無效的情緒類型"
            Exit Sub
    End Select
    
    ' 將樣式應用到整個工作表
    ThisWorkbook.Sheets("Sheet1").Cells.Font.Name = "Arial"
    ThisWorkbook.Sheets("Sheet1").Cells.Font.Size = 14
    ThisWorkbook.Sheets("Sheet1").Cells.Font.Color = RGB(255, 255, 255)
    ThisWorkbook.Sheets("Sheet1").Cells.Interior.Pattern = xlNone
    ThisWorkbook.Sheets("Sheet1").Cells.Interior.ColorIndex = xlColorIndexNone
    ThisWorkbook.Sheets("Sheet1").Cells.Interior.ThemeColor = xlThemeColorLight1
    
    ' 將 <style> 元素插入 HTML 文檔中的某個節點之前
    Dim targetNode As Object
    Set targetNode = ThisWorkbook.Sheets("Sheet1").Range("A1")
    targetNode.ParentNode.insertBefore style.Object, targetNode
    
    ' 彈出對話框展示情緒樣式的效果
    MsgBox "樣式已應用到工作表中的單元格范圍"
End Sub

當運行上述代碼時，它會提示你輸入情緒類型，然后根據輸入的情緒類型應用相應的樣式。例如，如果輸入 “happy”，則會將工作表的背景顏色設置為黃色。你可以根據需要添加更多的情緒類型和對應的樣式規則。【請注意，該代碼假定在工作表 “Sheet1” 中有一個 Range 對象(A1) 作為目標節點，你也可以根據需要修改它】

在使用 HTMLStyleElement 對象時，需要注意以下幾點：

1、確保在添加 <style> 元素之前，要創建一個 OLEObject 控件并將其類型設置為 “HTML Style”，然后再通過 Object 屬性來訪問 HTMLStyleElement 對象。

Dim style As Object
Set style = ThisWorkbook.Sheets("Sheet1").OLEObjects.Add(ClassType:="HTML Style")

2、使用 .innerHTML 屬性來設置或獲取 <style> 元素的樣式規則。樣式規則必須遵循 CSS 的語法規則。

style.Object.innerHTML = "body { background-color: lightblue; }"

3、在插入 <style> 元素之前，需要找到要將其插入到的目標節點。通過 ParentNode 屬性和 insertBefore 方法來實現。

Dim targetNode As Object
Set targetNode = ThisWorkbook.Sheets("Sheet1").Range("A1")

targetNode.ParentNode.insertBefore style.Object, targetNode

4、如果不再需要 <style> 元素，可以使用 Delete 方法將其從文檔中刪除。

style.Delete

5、當在 Excel 中使用 HTMLStyleElement 對象時，要確保選擇適當的目標范圍（比如工作表、單元格等），以便樣式被正確應用。

6、需要遵循 CSS 的語法規則，確保正確設置樣式規則。例如，必須使用正確的 CSS 選擇器（如 “body”、“div”）和屬性（如 “background-color”、“font-size”）。

7、HTMLStyleElement 對象只能應用于支持 HTML 渲染的環境中，例如在 WebBrowser 控件中或使用 VBA 內置的 Web 瀏覽器。

8、在應用樣式之前，應該清楚目標節點的父節點是否支持樣式。例如，在 <style> 元素之前的節點必須是支持樣式的元素。

【通過遵循以上注意事項，你能夠正確地使用 HTMLStyleElement 對象來操作樣式規則并在 Excel 中應用相應的樣式。】

頭條創作挑戰賽# HTMLDocument對象是Microsoft Excel VBA中表示HTML文檔的一種對象。它可以用于讀取、修改和操作HTML文檔中的標簽、元素和屬性。可以通過創建HTMLDocument對象來加載和解析HTML文件，并使用提供的方法和屬性訪問文檔中的各個部分。可以將HTMLDocument對象與其他Excel對象（如Workbooks、Worksheets或Range）一起使用，以便在VBA中自動化對HTML文檔的處理和操作。

1、創建HTMLDocument對象并加載HTML文件：

Dim htmlDoc As New HTMLDocument
htmlDoc.body.innerHTML = "HTML內容"

2、通過標簽名稱獲取元素對象：

Dim element As Object
Set element = htmlDoc.getElementsByTagName("h1")(0)

3、獲取元素的文本內容：

Dim text As String
text = htmlDoc.getElementById("myElement").innerText

4、修改元素的屬性值：

htmlDoc.getElementById("myElement").setAttribute "class", "newClass"

5、遍歷所有元素并執行操作：

Dim allElements As Object
Set allElements = htmlDoc.getElementsByTagName("*")
For Each element In allElements
    ' 執行操作
Next element

6、在HTML文檔中插入新元素：

Dim newElement As Object
Set newElement = htmlDoc.createElement("p")
newElement.innerHTML = "新段落"
htmlDoc.body.appendChild newElement

以下是兩個在Excel VBA中使用HTMLDocument對象的示例：

案例一：從網頁中提取數據并填充至Excel工作表

Sub ExtractDataFromWeb()
    Dim html As New HTMLDocument ' 創建HTMLDocument對象
    Dim xmlhttp As Object
    Dim table As Object
    Dim i As Integer, j As Integer
    
    ' 創建XMLHTTP對象
    Set xmlhttp = CreateObject("MSXML2.XMLHTTP")
    
    ' 發送GET請求獲取網頁內容
    xmlhttp.Open "GET", "http://www.example.com", False
    xmlhttp.send
    
    ' 將獲取的網頁內容解析到HTMLDocument對象
    html.body.innerHTML = xmlhttp.responseText
    
    ' 在HTMLDocument對象中查找需要提取的表格
    Set table = html.getElementById("tableId")
    
    ' 填充數據至Excel工作表
    For i = 0 To table.Rows.Length - 1
        For j = 0 To table.Rows(i).Cells.Length - 1
            ThisWorkbook.Sheets("Sheet1").Cells(i + 1, j + 1) = table.Rows(i).Cells(j).innerText
        Next j
    Next i
    
    Set xmlhttp = Nothing
    Set html = Nothing
End Sub

案例二：自動化提交表單并獲取返回結果

Sub SubmitFormAndGetResponse()
    Dim html As New HTMLDocument ' 創建HTMLDocument對象
    Dim xmlhttp As Object
    Dim form As Object
    Dim submitButton As Object
    
    ' 創建XMLHTTP對象
    Set xmlhttp = CreateObject("MSXML2.XMLHTTP")
    
    ' 發送GET請求獲取包含表單的網頁內容
    xmlhttp.Open "GET", "http://www.example.com/form-page", False
    xmlhttp.send
    
    ' 將獲取的網頁內容解析到HTMLDocument對象
    html.body.innerHTML = xmlhttp.responseText
    
    ' 在HTMLDocument對象中查找表單并填寫表單字段
    Set form = html.forms(0)
    form.getElementById("inputField1").Value = "Value1"
    form.getElementById("inputField2").Value = "Value2"
    
    ' 找到提交按鈕并自動點擊
    Set submitButton = form.getElementsByClassName("submitButton")(0)
    submitButton.Click
    
    ' 等待結果返回并解析結果
    Application.Wait Now + TimeValue("0:00:02") ' 等待2秒，根據實際情況調整等待時間
    html.body.innerHTML = xmlhttp.responseText
    
    ' 處理返回結果
    ' ...
    
    Set xmlhttp = Nothing
    Set html = Nothing
End Sub

這些示例演示了如何使用HTMLDocument對象從網頁中提取數據并將其填充至Excel工作表，以及如何自動化提交HTML表單并獲取返回結果。可以根據需要修改代碼中的URL、元素ID和類名等，以適應具體的網頁結構和目標數據。

使用HTMLDocument對象時需要注意以下事項：

1、引用Microsoft HTML Object Library：在VBA編輯器中，點擊菜單欄上的"工具"，選擇"引用"，然后勾選"Microsoft HTML Object Library"。這個引用將允許你在VBA代碼中使用HTMLDocument對象。

2、創建HTMLDocument對象：使用CreateObject函數創建HTMLDocument對象。例如：

Dim html As Object
Set html = CreateObject("HTMLFile")

3、加載HTML內容：使用HTMLDocument對象的Open方法加載HTML內容。例如：

html.Open
html.Write "<html><body><h1>Hello, World!</h1></body></html>"
html.Close

4、獲取HTML元素：可以使用getElementById、getElementsByTagName、getElementsByClassName等方法獲取HTML元素。例如：

Dim h1 As Object
Set h1 = html.getElementById("myHeading")

5、操作HTML元素：可以使用HTML元素的屬性和方法進行操作。例如，改變元素的文本內容：

h1.innerText = "Hello, VBA!"

6、事件處理：HTMLDocument對象也支持事件處理。可以使用AttachEvent方法將事件與處理程序關聯起來。例如：

Dim button As Object
Set button = html.getElementById("myButton")

Private Function Button_Click()
    MsgBox "Button clicked!"
End Function

button.AttachEvent "onclick", Button_Click

7、釋放資源：在使用完HTMLDocument對象后，記得使用Set語句將其設置為Nothing，以釋放系統資源。例如：

Set h1 = Nothing
Set html = Nothing

以上是使用HTMLDocument對象時需要注意的一些事項。通過合適的引用和正確的操作，可以在VBA編寫中使用HTMLDocument對象來處理HTML內容。

在線咨詢

上一篇：HTML頭部 <head>
下一篇：圖片輪播的實現：HTML+CSS+ JavaScript

您的項目需求

*請認真填寫需求信息，我們會在24小時內與您取得聯系。

整合營銷服務商