【エクセルVBAでIE操作】name属性を利用して画像タイプの送信ボタンをクリックする

こんにちは！ITライターのもり（@moripro3）です！

前回の記事では、ユーザー名とパスワードを入力してログインする方法をお伝えしました。

【エクセルVBAでIE操作】ユーザー名とパスワードを入力してログインをする

エクセルVBAでInternet Explorerを操作する初心者向けのシリーズ。今回はエクセルVBAでIEを操作してフォームにユーザー名とパスワードを入力してログインをする方法についてお伝えします。

Webシステムにログインする時には「ログインボタン」をクリックしますよね。このログインボタンは、IDやパスワードなどのユーザが入力した情報を、サーバサイドに送信するためのボタンです。

今回の記事では、画像タイプの「送信ボタン」をクリックする方法を紹介していきますよ。

画像タイプの送信ボタンとは
（おさらい）IE起動からID・パスワード入力までの操作
name属性の値からボタンを特定してクリックする
まとめ
連載目次：エクセルVBAでIEを操作してWEBスクレイピング

画像タイプの送信ボタンとは

画像タイプの送信ボタンとは、「画像ファイル」をボタンのような見た目として作られている「送信ボタン」です。

実際のサンプルをみてみましょう。題材はＳＭＢＣ日興証券オンライントレードのログインページです。

「ログインボタン」に注目してみると、このようにカギのマークがついていてオシャレですね。

デザイン方法が気になるこのオシャレなボタンこそが、ボタンの見た目をした画像ファイルなのです。

GoogleChromeの検証機能でボタンのHTMLをみてみましょう。（検証機能の使い方は前回の記事をご覧くださいね。）

inputタグのtype属性の値がimageになっていて、src属性で画像ファイル(.gif)のURLが設定されています。

このような作りにすることで「画像タイプの送信ボタン」が作成できるのです。

（おさらい）IE起動からID・パスワード入力までの操作

これは前回のおさらいです。IEの起動からHTMLドキュメントの読み込み処理です。

URLには、題材の日興証券ログインページを指定しています。

Dim objIE As InternetExplorer 'IEオブジェクトを準備
Set objIE = CreateObject("Internetexplorer.Application") '新しいIEオブジェクトを作成してセット
 
objIE.Visible = True 'IEを表示
 
Dim strUrl As String '次ページのURL
strUrl = "https://trade.smbcnikko.co.jp/Etc/1/webtoppage/"
 
objIE.navigate strUrl 'IEでURLを開く
 
Do While objIE.Busy = True Or objIE.readyState < READYSTATE_COMPLETE '読み込み待ち
    DoEvents
Loop
 
Dim htmlDoc As HTMLDocument 'HTMLドキュメントオブジェクトを準備
Set htmlDoc = objIE.document 'objIEで読み込まれているHTMLドキュメントをセット

ログインするためには支店コード・口座番号・パスワードを入力する必要があるので、それぞれのテキストボックスのid属性を確認します。

このとおり確認できます。

支店コード：id属性=”padInput0″
口座番号：id属性=”padInput1″
パスワード：id属性=”padInput2″

getElementByIdメソッドの引数にid属性を指定してテキストボックスに値を入力するコードがこちらです。

htmlDoc.getElementById("padInput0").Value = "123" '支店コード
htmlDoc.getElementById("padInput1").Value = "123456" '口座番号
htmlDoc.getElementById("padInput2").Value = "password" 'パスワード

name属性の値からボタンを特定してクリックする

さてここからが今回の本題！画像タイプのボタンをクリックする方法を紹介していきます。

流れはこのようになります。

１．name属性が指定値である「要素タグのコレクション」を取得する
２．取得したコレクションの中から、目的のボタンを取り出す
３．目的のボタンをクリックする

要素タグのコレクションを取得する

getElementsByNameメソッドを使用して「要素タグのコレクション」を取得します。

HTMLDocumentオブジェクト.getElementsByName(name属性の値)

ターゲットであるログインボタンのHTMLをもう一度確認します。

name属性の値はlogInですね。getElementsByNameメソッドの引数に文字列型で指定します。

コレクションを格納する変数には、IHTMLElementCollection型のオブジェクト変数を用意します。

Dim loginBtns As IHTMLElementCollection
Set loginBtns = htmlDoc.getElementsByName("logIn")

これで、name属性が”logIn”の「要素タグのコレクション」が変数loginBtnsに格納されました。

【イメージ】

コレクションの中から目的のボタンを取得する

コレクションにインデックスを指定して、目的のオブジェクト（ログインボタン）を取り出します。

IHTMLElementCollection(インデックス)

「インデックス」とは、配列やコレクション全体の中の何番目であるかを示す番号です。要素番号・添え字と呼んだりもします。

今回のターゲットであるログインボタンのname属性=”logIn”が全体の何番目に登場するかHTMLで確認します。

Ctrl+Uで画面の全ソースを表示して、Ctrl+Fで登場する検索ボックスで検索します。

name属性=”logIn”はページ内に１つのみであることが確認できました。

さきほどのコレクションのイメージ図では複数の要素タグを格納する絵を示しましたが、このログインボタンの場合は、コレクションの中身が１つだけということになります。

全体の１番目なので、インデックスには0を指定します。

IHTMLElement型のオブジェクト変数を用意して、コレクションの中から取り出したオブジェクトへの参照を格納します。

Dim loginBtn As IHTMLElement
Set loginBtn = loginBtns(0)

これで、コレクションの中から「ログインボタン」のオブジェクトを取り出し、その参照を格納できました。

【イメージ】

特定したボタンをクリックする

「ボタン」の参照が格納されているオブジェクト変数loginBtnにClickメソッドを実行してクリックします。

IHTMLElementオブジェクト.Click

コードがこちらです。

loginBtn.Click

これで、今回の目的である「画像タイプの送信ボタンをクリック」ができて、無事にログインができました！

クリック処理のコードまとめ

さて、ここまでの処理はこのように１行で記述することもできますが、

htmlDoc.getElementsByName("logIn")(0).Click

今回の記事では、処理の仕組みを詳しく説明するために５行に分けて記述しました。

Dim loginBtns As IHTMLElementCollection
Set loginBtns = htmlDoc.getElementsByName("logIn")

Dim loginBtn As IHTMLElement
Set loginBtn = loginBtns(0) 'コレクションの1番目の要素を取得

loginBtn.Click