ターゲット
スクレイピング対象のターゲットHTMLは以下のようなWebページです。あるプロジェクトのメンバー一覧です。
結論
HTML表の行数を求めるには、行を表すアイテムセレクター #content > center > table > tbody > trをブラウザの pageオブジェクトの $$()メソッドに指定します。そうしてメソッドの戻り値の lengthプロパティがHTML表の行数となります。
HTML表の行数を求める
letnumOfAccount=(awaitpage.$$('#content > center > table > tbody > tr')).length求めた行数を変数 numOfAccountに格納して利用します。
HTMLの構造
一覧表はcenterタグ内にtableタグがあり、さらにtableタグ内にtbodyタグがあり、さらにtbodyタグ内にtrタグがあります。このtrタグ内の情報をスクレイピングします。
スクレイピング対象のターゲットHTML
<center><tableborder="1"bgcolor="white"rules="all"class="TableColor"><tbody><trbgcolor="#eeeeff"class="TableHeadingColor"><th>アカウント</th><th>氏名</th><th>メールアドレス</th><th>所属</th><th>ロール</th><th>アクセス表示</th><th>表示順</th><thcolspan="2">状態変更</th></tr><trbgcolor="#ffffff"><td><aname="9999999"><imgsrc="../images/user/invisible.png"></a><ahref="javascript:void(0)"class="userEditAnchor"data-account="9999999"data-role="2">9999999</a></td><td>帆花 風彦</td><td><ahref="mailto:hoge_fuuhiko@baaboo.co.jp">hoge_fuuhiko@baaboo.co.jp</a></td><td>馬場時時開発本部</td><td>開発メンバー</td><tdclass="textCenterTd"><inputtype="checkbox"class="showaccessmode"name="access_9999999"value="1"checked=""></td><td><spanid="oarea_9999999"><inputtype="hidden"name="order_9999999"value="1"id="order_9999999"><inputtype="button"class="disporderbtn"name="order_0272054"value="1"></span><inputtype="hidden"name="dborder_9999999"value="1"></td><td><inputtype="button"id="invalid_9999999"name="label"value="無効"></td><td>削除不可</td></tr> ・・・・・・・・・・以下表の行数分<tr>タグを繰り返し・・・・・・・・・・
</tbody></table></center>アイテムセレクター
スクレイピング対象のターゲットHTMLの trタグのアイテムセレクターはタグの入れ子構造から
- #content > center > table > tbody > tr
となります。
そこで、 TARGETオブジェクトのプロパティ
- TARGET.project.userList.itemSelector.trTagに '#content > center > table > tbody > tr'
と定義して利用することにします。
オブジェクト定義
constTARGET={projectList:[],url:{home:'https://target.hoge.jp/',project:{urlMask:'%ProjectNo%',alllist:'https://target.hoge.jp//manage/list.php',userList:'https://target.hoge.jp/users/list.php?project_id=%ProjectNo%'}},project:{allList:{rowNo:{top:2},colNo:{id:2,name:3,team:4},itemSelector:{rowNoMask:'%rowNo%',colNoMask:'%colNo%',trTag:'#content > form > center > table > tbody > tr',aTag:'> a',template:{row:'#content > form > center > table > tbody > tr:nth-child(%rowNo%)',col:'> td:nth-child(%colNo%)'}}},userList:{topRowNo:2,colNo:{account:1,name:2,mailAddress:3,belongs:4,role:5},itemSelector:{rowNoMask:'%rowNo%',colNoMask:'%colNo%',accountMask:'%account%',trTag:'#content > center > table > tbody > tr',aTag:'> a.userEditAnchor',invalidButton:'input[id=invalid_%account%]',searchButton:'searchbtn',template:{row:'#content > center > table > tbody > tr:nth-child(%rowNo%)',col:'> td:nth-child(%colNo%)'}}}}}HTML表の行数の使い方例
page.$$( TARGET.project.userList.itemSelector.trTag ) ).lengthにより求められたHTML表の行数を格納した変数numOfAccountを最大値にしてforループで繰り返して、HTML表に格納されたデータをスクレイピングします。ここでは、アカウント、氏名、メールアドレス、ロールをスクレイピングしています。この処理を以下のgetAccountList()関数で実装します。
getAccountList()
constgetAccountList=asyncfunction(page,accountList){console.log('..... getAccountList() .....')let[account,name,mailAddress,belongs,role]=['','','','','']letaccountObj={}try{letnumOfAccount=(awaitpage.$$(TARGET.project.userList.itemSelector.trTag)).lengthconsole.log('<------ Project Member List Start ------>')for(letrowNo=TARGET.project.userList.topRowNo;rowNo<=numOfAccount;rowNo++){[account,name,mailAddress,belongs,role]=awaitgetAccountItem(page,rowNo)if(account=='')continueaccountObj={アカウント:account,氏名:name,メールアドレス:mailAddress,ロール:role}accountList.push(accountObj)}}catch(error){console.log('------> Project Member List End Over <------')}finally{if(Object.values(accountObj).length==0){accountObj={アカウント:'',氏名:'',メールアドレス:'',ロール:''}accountList.push(accountObj)}returnaccountList}}
