id属性を指定して特定の文書ドキュメントを抽出

<< エクセルVBAで特定の文書ドキュメントを取得する  ：前の記事

前回は、HTMLドキュメント内の特定の文書ドキュメントを取得についていくつかの方法を解説しました。多くの処理を行うwebスクレイピングの場合、適切な処理を選択しなければかなり時間がかかってしまいます。こちらを理解したい上で臨機応変に対応するようにしましょう。

今回は、前回紹介した処理でid属性を指定して特定の文書ドキュメントを簡単に抽出できるサブルーチンの作成について解説していきます。

目次

DOM(Document Object Model)とは

DOMとは「Document Object Model」の略称で、html・head・body・p・aなどのHTMLドキュメント要素にアクセスして取得や操作ができる仕組みのことです。

以下はHTMLドキュメントをツリー構造に表したものでDOMツリーと呼ばれます。階層状のツリー構造でHTMLドキュメントを表現します。

DOMツリー

HTML(HyperText Markup Language)とは

HTMLとは「HyperText Markup Language」の略称で、Webページを作成するために開発された言語です。世の中に公開されているWebページのほとんどがHTMLで作成されています。こちらのサイトもHTMLで作成されています。

HTMLは基本的に以下のような構成でできており「<タグ名>★テキスト★</タグ名>」が1つの要素(エレメント)になります。この中の特定の要素に対してデータの取得や操作を行っていきます。

<html>

 <head>

  <title>VBAのIE制御</title>

 </head>

 <body>

  <p>こちらはpタグのテキストです。</p>
  <a href="★リンクURL(アドレス)★">リンクのアンカーテキストです。</a>

 </body>

</html>

※ドラッグ(スワイプ)すると全体を確認できます。

タグと要素(エレメント)の違い

HTML言語では、「タグ」と呼ばれる仕組みを利用して構築していきます。以下のイメージを確認すると分かりやすいと思いますが、タグとは「<」と「>」で構成されており、開始タグと終了タグまでの括りで1つの要素を形成します。

タグと要素の違い

具体例で説明するとWebページのURL(アドレス)を表す「titleタグ」を利用して開始タグの「<title>」と終了タグの「</title>」で括り、タグの中の文字列が「要素内容」となります。こちらでは「VBAのIE制御入門」の文字列が要素内容となります。

そして、こちらの「開始タグ+要素内容+終了タグ」の全体を「要素」と呼びます。また、別名では「エレメント」と呼ばれますので、どちらも同じ意味であることを理解してください。

利用するサブルーチン・プロパティ・メソッド・VBA関数について

今回利用するサブルーチン・プロパティ・メソッド・VBA関数は以下になります。利用方法については処理の解説で行いますが、どのような機能を持っているのか簡単に目を通してください。

ieViewサブルーチンとは

ieViewサブルーチンは指定したURL(アドレス)をInternetExplorerで起動させ、Webページが完全に読み込まれるまで待機処理をするマクロです。

ieView("IEオブジェクト","表示させたいURL(アドレス)の文字列","IE表示・非表示の値[省略可]","Y位置の値[省略可]","X位置の値[省略可]","幅の値[省略可]","高さの値[省略可]")
ieView

ieCheckサブルーチンとは

ieCheckサブルーチンは指定したInternetExplorerオブジェクトのWebページが完全に読み込まれるまで待機処理をするマクロです。

ieCheck("IEオブジェクト")
ieCheck

Documentプロパティとは

InternetExplorerオブジェクトのDocumentプロパティはHTMLドキュメントのオブジェクトを返すプロパティです。これによりHTMLドキュメントを操作することができます。

objIE.document.プロパティ/メソッド
Documentプロパティ

GetElementByIdメソッドとは

DocumentオブジェクトのGetElementByIdメソッドはHTMLドキュメント内の指定したid属性の要素オブジェクトを返すメソッドです。

objIE.document.GetElementById("id名").プロパティ/メソッド

outerHTMLプロパティとは

要素オブジェクトのouterHTMLプロパティは指定した要素オブジェクトの要素タグとその中に含まれるHTMLコードを取得するプロパティです。

変数 = objIE.document.GetElementById("id名").outerHTML

赤文字がpタグのouterHTMLの取得範囲になります。

<p>pタグの<span class="colorRed">outerHTML</span>の取得範囲</p>

innerHTMLプロパティとは

要素オブジェクトのinnerHTMLプロパティは指定した要素オブジェクトの要素タグの間に含まれるHTMLコードを取得するプロパティです。指定した要素オブジェクトの要素タグは含まれません。

変数 = objIE.document.GetElementById("id名").innerHTML

赤文字がpタグのinnerHTMLの取得範囲になります。

<p>pタグの<span class="colorRed">innerHTML</span>の取得範囲</p>

outerTextプロパティとは

要素オブジェクトのouterHTMLプロパティは指定した要素オブジェクトの要素内のテキスト部分のHTMLコードを取得するプロパティです。

変数 = objIE.document.GetElementById("id名").outerText

赤文字がpタグのouterTextの取得範囲になります。

<p>pタグの<span class="colorRed">outerText</span>の取得範囲</p>

innerTextプロパティとは

要素オブジェクトのouterHTMLプロパティは指定した要素オブジェクトの要素内のテキスト部分のHTMLコードを取得するプロパティです。

変数 = objIE.document.GetElementById("id名").innerText

赤文字がpタグのouterTextの取得範囲になります。

<p>pタグの<span class="colorRed">outerText</span>の取得範囲</p>

MsgBox関数とは

MsgBox関数はダイアログボックスにメッセージとボタンを表示し、どのボタンが押されたかを示す整数型の数値を返します。

MsgBox "表示させる文字列"
MsgBox関数

getElementByIdメソッドを利用した特定の文書ドキュメントを抽出するサブルーチン「idValue」の解説

こちらは、getElementByIdメソッドを利用した特定の文書ドキュメントを抽出するサブルーチンになります。

Function idValue(objIE As InternetExplorer, _
                 idName As String, _
                 valueType As String, _
                 Optional pcType As String, _
                 Optional num As Byte) As String

  Dim objDoc As Object

  If pcType = "parent" Then
    
    Set objDoc = objIE.document.getElementById(idName).parentElement
        
  ElseIf pcType = "child" Then
  
    Set objDoc = objIE.document.getElementById(idName).Children(num)
        
  Else

    Set objDoc = objIE.document.getElementById(idName)
    
  End If

  With objDoc

    Select Case valueType

      Case "innerHTML"

        idValue = .innerHTML

      Case "innerText"
             
        idValue = .innerText
      
      Case "outerHTML"

        idValue = .outerHTML

      Case "outerText"

        idValue = .outerText

    End Select

  End With

End Function

※ドラッグ(スワイプ)すると全体を確認できます。

それでは、VBAコードを１つずつ説明していきます。

Function idValue(objIE As InternetExplorer, _
                 idName As String, _
                 valueType As String, _
                 Optional pcType As String, _
                 Optional num As Byte) As String

※ドラッグ(スワイプ)すると全体を確認できます。

こちらは戻り値を返すFunctionステートメントに引数を5つ設定しているidValueサブルーチンになります。こちらの構文と引数の内容は以下になります。尚、引数はすべて参照渡しで渡されます。

idValue("IEオブジェクト","id属性の名前","データ取得のプロパティ名","親・子要素の選択",Childrenプロパティの添え字")
構文idValue(objIE,idName,valueType[,pcType,num])
引数名データ型内容値の事例初期値省略
objIEInternetExplorerInternetExplorerオブジェクトを指定します。objIE,
objIE2		×
idNameString抽出するid属性の名前を文字列で指定します。間接的に親要素から抽出する場合には親要素のid属性の名前を、子要素から抽出する場合には子要素のid属性の名前を文字列で指定します。"idparent",
"idchild"		×
valueTypeStringデータ取得のプロパティ名を文字列で指定します。データ取得のプロパティは「innerHTML」「innerText」「outerHTML」「outerText」の4つになります。詳細については、「HTMLコードを取得する」を参照してください。"innerHTML",
"innerText",
"outerHTML",
"outerText"		×
pcTypeString間接的に親要素から抽出する場合には「parent」を、子要素から抽出する場合には「child」を文字列で指定します。「parent」を指定した場合はparentElementプロパティで、「child」を指定した場合はChildrenプロパティで、間接的に抽出する要素オブジェクトを取得します。尚、抽出する要素オブジェクトにid属性が設定されていて直接抽出する場合は、引数pcTYpeは省略します。"idparent",
"idchild"		●
numByte引数pcTypeで「child」を指定した場合のみChildrenプロパティの添え字を引数numで指定します。0,1,2●

引数objIEは必須項目で、文書ドキュメントを抽出するnternetExplorerオブジェクトを指定します。InternetExplorerオブジェクトを引数に設定することで、複数のオブジェクトを処理することができます。

引数idNameは必須項目で、抽出するid属性の名前を文字列で指定します。間接的に親要素から抽出する場合には親要素のid属性の名前を、子要素から抽出する場合には子要素のid属性の名前を文字列で指定します。

以下の事例で言えば、div要素から間接的に指定する場合はid属性「idparent」を、span要素から間接的に指定する場合はid属性「idchild」を指定します。

こちらの詳細については、「文書ドキュメント取得の処理の考え方」を確認してください。

<div id="idparent">
<p>****</p>
<p>抽出したい<span id="idchild">要素</span></p>
<p>****</p>
</div>

引数valueTypeは必須項目で、データ取得のプロパティ名を文字列で指定します。データ取得のプロパティは「innerHTML」「innerText」「outerHTML」「outerText」の4つになります。

詳細については、「HTMLコードを取得する」を確認してください。

引数pcTypeは省略可能な項目で、間接的に親要素から抽出する場合には「parent」を、子要素から抽出する場合には「child」を文字列で指定します。「parent」を指定した場合はparentElementプロパティで、「child」を指定した場合はChildrenプロパティで、間接的に抽出する要素オブジェクトを取得します。

尚、抽出する要素オブジェクトにid属性が設定されている場合は、そのオブジェクトを直接取得するため引数pcTYpeは省略します。

引数numは省略可能な項目で、引数pcTypeで「child」を指定した場合のみChildrenプロパティの添え字を指定します。

Dim objDoc As Object

※ドラッグ(スワイプ)すると全体を確認できます。

こちらは、変数宣言でメモリ領域を割り当てるDimステートメントを利用してオブジェクト変数objDocに「オブジェクト型(Object)」を変数宣言しています。

先に説明すると、データ型はオブジェクト型(Object)を利用せず、より具体的なデータ型を宣言するほうがよいとされています。理由としては、補助入力機能など利便性のよさなどが挙げられます。

こちらについては本来であれば、「HTMLParaElement型」または「HTMLDocument型」などを指定するのがよいのでしょうか処理速度の観点からいうと必ずしもよいというわけではなりません。

他にもいくつか検証したのですが、以下のようにHTML関連のデータ型を選択した場合とオブジェクト型(Object)ではどれもオブジェクト型(Object)を選択した方が処理速度が速い結果となりました。

ですので、こちらで解説している内容のほとんどはオブジェクト型(Object)を選択しています。特に変更してもらっても問題ありませんので、自由に変更してください。

回数・処理オブジェクト型(Object)HTMLParaElement型HTMLDocument型
1回目27.3418秒31.6074秒31.9866秒
2回目28.3105秒34.0234秒33.9478秒
  If pcType = "parent" Then
    
    Set objDoc = objIE.document.getElementById(idName).parentElement
        
  ElseIf pcType = "child" Then
  
    Set objDoc = objIE.document.getElementById(idName).Children(num)
        
  Else

    Set objDoc = objIE.document.getElementById(idName)
    
  End If

※ドラッグ(スワイプ)すると全体を確認できます。

次に条件分岐ができるIf～Then～Elseステートメントを利用して抽出する要素オブジェクトを設定しています。引数pcTypeに「parent」を設定している場合は、getElementByIdメソッドを利用して子要素を取得してからparentElementプロパティで抽出する要素を取得します。

「child」を設定している場合は、getElementByIdメソッドを利用して親要素を取得してからChildrenプロパティで引数numを添え字に設定し、抽出する要素を取得します。

引数pcTypeを設定していない場合、getElementByIdメソッドに抽出する要素のid属性を設定して抽出する要素を取得します。

尚、取得する際はオブジェクトを参照するSetステートメントを利用してオブジェクト変数objDocに代入します。

  With objDoc

    Select Case valueType

      Case "innerHTML"

        idValue = .innerHTML

      Case "innerText"
             
        idValue = .innerText
      
      Case "outerHTML"

        idValue = .outerHTML

      Case "outerText"

        idValue = .outerText

    End Select

  End With

End Function

※ドラッグ(スワイプ)すると全体を確認できます。

こちらでは、1つのオブジェクトに対して処理をまとめるWithステートメントのオブジェクト名にオブジェクト変数objDocを設定しています。次に複数の条件分岐を設定するSelect Caseステートメントを利用して引数valueTypeの設定値で条件分岐させています。

こちらでは、innerHTML・innerText・outerHTML・outerTextプロパティを利用して抽出する要素のどの部分の文書ドキュメントを抽出するかを選択しています。そして、取得した値を戻り値idValueに代入演算子で格納したら処理が完了します。

それでは、次にこちらのサブルーチンを利用してテストページのid属性「idtest」の文書ドキュメント取得してみましょう。

「idValue」を利用して特定の文書ドキュメントを抽出するサンプルコード

こちらのVBAコードは、idValueサブルーチンを利用してid属性「idtest」の文書ドキュメントを取得するマクロです。

Sub sample()

  Dim objIE  As InternetExplorer
  
  'IE(InternetExplorer)でテストページを起動する
  Call ieView(objIE, "http://www.vba-ie.net/code/all.html")
  
  '抽出する要素のid属性を直接指定して文書ドキュメントを抽出する
  MsgBox idValue(objIE, "idtest", "innerText")
  
  '抽出する要素の親要素を指定してから文書ドキュメントを抽出する
  MsgBox idValue(objIE, "idparent", "innerText", "child", 1)
  
  '抽出する要素の子要素を指定してから文書ドキュメントを抽出する
  MsgBox idValue(objIE, "idchild", "innerText", "parent")

End Sub

※ドラッグ(スワイプ)すると全体を確認できます。

取得対象のHTMLコード

<p id="idtest" name="nametest" class="classtest">一番速い処理はどれ？</p>
<div id="idparent">
<p>****</p>
<p>抽出したい<span id="idchild">要素</span></p>
<p>****</p>
</div>

解説

Sub sample()

  Dim objIE  As InternetExplorer

※ドラッグ(スワイプ)すると全体を確認できます。

こちらはSubステートメントに引数の設定がないsampleプロシージャになります。 まずは、変数宣言でメモリ領域を割り当てるDimステートメントを利用してオブジェクト変数objIEに「InternetExplorer型」を変数宣言しています。

  'IE(InternetExplorer)でテストページを起動する
  Call ieView(objIE, "http://www.vba-ie.net/code/all.html")

※ドラッグ(スワイプ)すると全体を確認できます。

次に他のプロシージャを呼び出すCallステートメントを利用してieViewサブルーチンを呼び出しています。第一引数にはオブジェクト変数の「objIE」を第二引数には表示させるURL(アドレス)の「http://www.vba-ie.net/code/all.html」を設定しています。これによりInternetExplorerで本サイトのテストページが表示されます。

  '抽出する要素のid属性を直接指定して文書ドキュメントを抽出する
  MsgBox idValue(objIE, "idtest", "innerText")

※ドラッグ(スワイプ)すると全体を確認できます。

こちらは、idValueサブルーチンの引数idNameと引数valueTypeが設定されています。引数pcTypeが設定されていないため、抽出する要素のid属性「idtest」を直接指定して文書ドキュメントを抽出しています。

<p id="idtest" name="nametest" class="classtest">一番速い処理はどれ？</p>

getElementByIdメソッドを利用した結果1
  '抽出する要素の親要素を指定してから文書ドキュメントを抽出する
  MsgBox idValue(objIE, "idparent", "innerText", "child", 1)

※ドラッグ(スワイプ)すると全体を確認できます。

こちらは、idValueサブルーチンの引数idName・valueType・pcType・numを設定しています。引数pcTypeに「child」を設定していますので、抽出する要素の親要素であるid属性「idparent」の要素を取得してから引数numで設定した「1」つまり2番目の子要素(抽出する要素)の文書ドキュメントを抽出しています。

<div id="idparent">
<p>****</p>
<p>抽出したい<span id="idchild">要素</span></p>
<p>****</p>
</div>

getElementByIdメソッドを利用した結果2
  '抽出する要素の子要素を指定してから文書ドキュメントを抽出する
  MsgBox idValue(objIE, "idchild", "innerText", "parent")

※ドラッグ(スワイプ)すると全体を確認できます。

こちらは、idValueサブルーチンの引数idName・valueType・pcTypeを設定しています。引数pcTypeに「parent」を設定していますので、抽出する要素の子要素であるid属性「idchild」の要素を取得してからparentElementプロパティを利用して親要素である抽出する要素の文書ドキュメントを抽出しています。

<p>****</p>
<p>抽出したい<span id="idchild">要素</span></p>
<p>****</p>

getElementByIdメソッドを利用した結果2

まとめ

今回は、id属性を指定して文書ドキュメントを抽出するサブルーチンの作成について解説しました。こちらはid属性が設定されている要素あるいは抽出する要素の親要素・子要素がid属性を持っている場合に有効な方法です。次回は、name属性とタグ名の組み合わせから文書ドキュメントを抽出するサブルーチンの作成について解説していきます。

次の記事： エクセルVBAでname属性を指定して文書ドキュメントを抽出するサブルーチン >>

Excel VBAでIEを思いのままに操作できるプログラミング術 Excel 2013/2010/2007/2003対応

IEのデータ収集＆自動操作のプログラミング本はこの1冊だけ！IEの起動やポップアップウィンドウ、表示を制御する基本的なコードはもちろん、テキストボックスやラジオボタン、表、ハイパーリンクなどのHTML部品を制御する方法など、自動操作に欠かせないノウハウを丁寧に解説。

VBAのIE制御についてのQ&A掲示板

↑VBAのIE操作で分からない事があればこちらの掲示板よりご質問ください。

ExcelのVBA初心者入門

↑こちらはVBAをマスターできるよう初心者向けのエクセルVBA入門コンテンツになります。

目次

IE制御の準備

IE制御の基本操作

IE制御の基本操作一覧(16)

HTMLエレメント基本操作

HTMLエレメント基本操作一覧(16)

HTMLエレメント実践操作

HTMLフォーム基本操作

HTMLフォーム基本操作一覧(16)

HTMLフレームの基本操作

HTMLフレームの基本操作一覧(8)

IE制御の応用編

IE制御の応用編一覧(7)

IE操作に便利なツール

こちらでは、これまでに紹介したIE(InternetExplorer)操作で便利な機能をツール化しています。無償でダウンロードできますので、目的に合わせたご利用ください。

IEのメソッド・プロパティ

こちらでは、IE(InternetExplorer)オブジェクトのメソッド・プロパティをまとめています。

IE操作のVBA関数

こちらでは、エクセルVBAのIE(InternetExplorer)操作で利用されたVBA関数をまとめています。

IE操作のステートメント

こちらでは、エクセルVBAのIE(InternetExplorer)操作で利用されたステートメントをまとめています。ExcelのVBAで基本的な部分になりますので、しっかり理解しましょう。

IE制御のVBAコード

こちらでは、これまでに作成したIE(InternetExplorer)操作で役立つサブルーチンをまとめています。
全てをコピーする必要はありませんが、目的に合わせたサブルーチンをご利用ください。

役立つVBAコード

役立つVBAコード一覧(23)

▲