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

2021-01-11 VBA語言專家

這節內容是「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:

<script>

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的同路人。

分享成果,隨喜正能量

相關焦點

  • DOM破壞攻擊學習
    2)怎麼控制DOM elements被強制轉為string之後的值,大多數的dom節點被轉為string後是[object HTMLInputElement]。我們可以用前面的例子來解決第一個問題:我們可以用下面的一段代碼來枚舉,html存在的所有標籤,然後檢查其dom節點對象有沒有實現toString方法,或者是繼承於Object.ptototype。
  • DOM - 元素節點屬性及Attribute
    元素節點屬性 我們繼續來看元素節點屬性 ownerDocument 屬性 功能:返回該節點的文檔對象根節點
  • MutationObserver: dom變化監聽 給你代碼
    如何來監聽dom變化?工作中突然有一個需求,必須你要監聽dom的插入,那麼就需要去監聽dom變化。在一般印象中,監聽事件應該是這麼實現的比如 xx.addEventListener(xxx)。而實際上關於這個dom變化有一套html5標準。
  • 河北華為VP9650僅490000 全適配視頻埠-華為 VP9650_濟南視頻...
    華為VP9650是華為公司以客戶需求為導向,結合強大的網絡設備製造優勢,開發出的新一代大容量、高性價比、可靈活分配埠、平滑擴容的全適配MCU,是業界首款具有1080p60全編全解超強處理能力的多媒體交換平臺。
  • 如何監聽頁面 DOM 變動並高效響應
    類似的事件及區別包括以下幾類: DOMContentLoaded: 當初始HTML文檔被完全加載和解析時,DOMContentLoaded 事件被觸發,而無需等待樣式表、圖像和子框架完成加載; readystatechange: 一個document 的 Document.readyState 屬性描述了文檔的加載狀態,當這個狀態發生了變化,就會觸發該事件;
  • HTML的基本結構、段落標籤、空格標籤、標題標籤、圖片標籤詳解
    HTML標籤一、HTML基本結構:一個HTML文檔結構基本由以下幾部分組成,一般分為四部分,如下圖:HTML基本結構1)、文檔聲明,標誌是:<!DOCTYPE HTML><!DOCTYPE HTML>聲明這是一個HTML文檔。
  • 埠和接口有什麼區別和聯繫嗎
    >   「埠」是英文port的意譯,可以認為是設備與外界通訊交流的出口。埠可分為虛擬埠和物理埠,其中虛擬埠指計算機內部或交換機路由器內的埠,不可見。例如計算機中的80埠、21埠、23埠等。物理埠又稱為接口,是可見埠,計算機背板的RJ45網口,交換機路由器集線器等RJ45埠。電話使用RJ11插口也屬於物理埠的範疇。
  • BDSM大型科普:Dom分型之「白騎士」,混圈必備知識
    在Dom/Sub人群中,有兩類人經常會不自覺地互相吸引而在一起,一類是受過心理創傷轉而投身BDSM中試圖尋求庇護的sub,被稱為DID(damsel in distress),另一類則是專以治癒他人、幫助sub走出低谷為樂,如果你沒點傷痛我反而不開心的dom,他們有個很好聽的名字——「白騎士」(White Knight)。
  • 解Bug之路-NAT引發的性能瓶頸|埠|tcp|nginx|ip|ack_網易訂閱
    這樣,在防火牆和LVS之間,所有的請求始終是通過(20.1.1.1,30.1.1.1)這樣一個ip地址對進行訪問。同時還固定了一個參數,那就是目的埠號始終是443。  而圖中僅存的560-529=>21+個連接創建,是由另一個業務的vip引起,在這個vip上,由於量很小,沒有埠復用。但是LVS統計的是總數量,所以在埠號開始復用之後,始終會有少量的新建連接存在。
  • 奔馳EQA欲與Model Y分高下!
    特斯拉最近剛剛把model y國產化,國產後的model y價格降到了33.99-36.99萬,在高端新能源用車中競爭力實在強大。不過,馬上特斯拉model y就會遇到它的競爭對手,來自豪華車企奔馳,而這輛競爭對手就是奔馳EQA。那麼,奔馳EQA到底是怎樣的車呢?我們一起來看一下。
  • 讓我更了解我的寶寶是什麼梗 讓我更了解我的寶寶戀愛表格文檔分享
    讓我更了解我的寶寶是什麼梗 讓我更了解我的寶寶戀愛表格文檔分享時間:2020-11-26 23:46   來源:今日頭條   責任編輯:毛青青 川北在線核心提示:原標題:讓我更了解我的寶寶是什麼梗 讓我更了解我的寶寶戀愛表格文檔分享 讓我更了解我的寶寶表格什麼意思?作為測試題目,擁有一系列問題。
  • word文檔中橫線怎麼打?
    word文檔中橫線怎麼打?很多同事在使用WORD軟體時想要在文檔中添加一條橫線,但是不知道具體怎麼操作。下面分享word添加橫線的方法,需要的朋友可以參考下很多同事在使用WORD軟體時想要在文檔中添加一條橫線,但是不知道具體怎麼操作。今天我就給大家介紹幾種添加橫線的方法。
  • 「撤回文檔信息」用英語怎麼說?
    「撤回文檔信息」用英語怎麼說?用Yahoo解決英語怎麼說「撤回(文檔)」我還真的沒見過英語是怎麼表達「撤回文檔」的,好在我們有Yahoo工具。我們現在來訓練如何使用Yahoo查找英語是怎麼表示「撤回已經發送的文檔或信息」的。