[英]Puppeteer loop table rows - select dropdown option on each row "Option "P" for parameters
我嘗試使用 Puppeteer 來遍歷表元素行。 表格最后一列中的每一行都有一個下拉列表。 我想為參數選擇選項“P”並獲取所有 href 鏈接並創建這些鏈接的數組....然后一一輸入以截取屏幕截圖。
這是我的表格元素...
我希望有人可以幫助我完成循環的步驟並單擊下拉列表以選擇一個選項 - 構建鏈接數組,然后單擊每個鏈接並拍攝快照。
謝謝你的幫助
<table border="0" cellpadding="5" cellspacing="0" width="96%" style="border: 2px solid black; margin-bottom: 10px;">
<tbody><tr class="header1">
<th colspan="8">Workshops</th>
</tr>
<tr class="header2"><th><acronym style="cursor:help;" title="Franchise Code">FC</acronym></th><th><acronym style="cursor:help;" title="Status">S</acronym></th><th>Date</th><th><acronym style="cursor:help;" title="Category">Cat.</acronym></th><th>Name</th><th>Location</th><th>Disc.</th><!--<th>Created</th>--><th></th></tr>
<tr style="background-color: white;">
<td valign="top" style="font-size: 9px;">EC</td>
<td valign="top" style="font-size: 9px;">
<acronym style="cursor: help;" title=" Expired">E
</acronym></td>
<td valign="top" align="left" style="font-size: 9px;">04.04.20</td>
<td valign="top" align="left" style="font-size: 8px;">CS</td>
<td valign="top" style="font-size: 9px;">Intermediate Workshop Derby</td>
<td valign="top" align="left" style="font-size: 9px;">Spondon Village Hall, Sitwell Street, Spondon, Derby, DE21 7FG</td>
<td valign="top" align="left" style="font-size: 9px;">None</td>
<!-- <td valign="top" align="center" style="font-size: 9px;">26.09.19 12.11</td> -->
<td valign="top" align="right" style="font-size: 9px;" nowrap="nowrap">
<form action="" method="get">
<select name="x" size="1" onchange="location=this.options[this.selectedIndex].value;" style="border: 1px solid black; width: 40px;">
<option value="#" title="Select an action"> -- </option>
<option value="/Applications/COS/Administration/Workshops/Parameters/14460?CLEAR" title="Parameters">P</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Parameters/14460?CLEAR" title="Parameters">P</a> -->
<option value="/Applications/COS/Administration/Workshops/Teachers/14460?CLEAR" title="Teachers">T</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Teachers/14460?CLEAR" title="Teachers">T</a> -->
<option value="/Applications/COS/Administration/Workshops/Franchise/14460?CLEAR" title="Franchise">F</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Franchise/14460?CLEAR" title="Franchise">F</a> -->
<option value="/Applications/COS/Administration/Workshop_Profiles?workshopRef=IntDerby04Apr20" title="User Profiles">U</option>
<option value="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=IntDerby04Apr20" title="Wait List">W</option>
<!-- <a href="/Applications/COS/Administration/Workshop_Profiles?workshopRef=IntDerby04Apr20" title="User Profiles">U</a>
<a href="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=IntDerby04Apr20" title="Wait List">W</a>-->
<option value="/Applications/COS/Administration/Workshops/Edit/14460?CLEAR" title="Edit">E</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Edit/14460?CLEAR" title="Edit">E</a> -->
<option value="/Applications/COS/Administration/Workshops/Copy/14460?CLEAR" title="Copy">C</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Copy/14460?CLEAR" title="Copy">C</a> -->
<option value="/Applications/COS/Administration/Workshops/Abort/14460?CLEAR" title="Abort">A</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Abort/14460?CLEAR" title="Abort">A</a> -->
<option value="/Applications/COS/Administration/Workshops/Delete/14460?CLEAR" title="Delete">D</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Delete/14460?CLEAR" title="Delete">D</a> -->
</select>
</form>
</td></tr>
<tr style="background-color: #eeeeee;">
<td valign="top" style="font-size: 9px;">JK</td>
<td valign="top" style="font-size: 9px;">
<acronym style="cursor: help;" title=" Aborted">A
</acronym></td>
<td valign="top" align="left" style="font-size: 9px;">04.04.20</td>
<td valign="top" align="left" style="font-size: 8px;">Workshop</td>
<td valign="top" style="font-size: 9px;">Intermediate Building Blocks 2 (10:30am-1:30pm)</td>
<td valign="top" align="left" style="font-size: 9px;">Colwick Community Centre, Vale Road, Colwick, Nottingham, NG4 2GP</td>
<td valign="top" align="left" style="font-size: 9px;">None</td>
<!-- <td valign="top" align="center" style="font-size: 9px;">05.03.20 13.18</td> -->
<td valign="top" align="right" style="font-size: 9px;" nowrap="nowrap">
<form action="" method="get">
<select name="x" size="1" onchange="location=this.options[this.selectedIndex].value;" style="border: 1px solid black; width: 40px;">
<option value="#" title="Select an action"> -- </option>
<option value="/Applications/COS/Administration/Workshops/Parameters/14560?CLEAR" title="Parameters">P</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Parameters/14560?CLEAR" title="Parameters">P</a> -->
<option value="/Applications/COS/Administration/Workshops/Teachers/14560?CLEAR" title="Teachers">T</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Teachers/14560?CLEAR" title="Teachers">T</a> -->
<option value="/Applications/COS/Administration/Workshops/Franchise/14560?CLEAR" title="Franchise">F</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Franchise/14560?CLEAR" title="Franchise">F</a> -->
<option value="/Applications/COS/Administration/Workshop_Profiles?workshopRef=IBB2Apr20" title="User Profiles">U</option>
<option value="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=IBB2Apr20" title="Wait List">W</option>
<!-- <a href="/Applications/COS/Administration/Workshop_Profiles?workshopRef=IBB2Apr20" title="User Profiles">U</a>
<a href="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=IBB2Apr20" title="Wait List">W</a>-->
<option value="/Applications/COS/Administration/Workshops/Edit/14560?CLEAR" title="Edit">E</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Edit/14560?CLEAR" title="Edit">E</a> -->
<option value="/Applications/COS/Administration/Workshops/Copy/14560?CLEAR" title="Copy">C</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Copy/14560?CLEAR" title="Copy">C</a> -->
<option value="/Applications/COS/Administration/Workshops/Delete/14560?CLEAR" title="Delete">D</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Delete/14560?CLEAR" title="Delete">D</a> -->
</select>
</form>
</td></tr>
<tr style="background-color: white;">
<td valign="top" style="font-size: 9px;">JK</td>
<td valign="top" style="font-size: 9px;">
<acronym style="cursor: help;" title=" Aborted">A
</acronym></td>
<td valign="top" align="left" style="font-size: 9px;">04.04.20</td>
<td valign="top" align="left" style="font-size: 8px;">Workshop</td>
<td valign="top" style="font-size: 9px;">Beginner Improver (2:30pm-5:30pm)</td>
<td valign="top" align="left" style="font-size: 9px;">Colwick Community Centre, Vale Road, Colwick, Nottingham, NG4 2GP</td>
<td valign="top" align="left" style="font-size: 9px;">None</td>
<!-- <td valign="top" align="center" style="font-size: 9px;">05.03.20 13.19</td> -->
<td valign="top" align="right" style="font-size: 9px;" nowrap="nowrap">
<form action="" method="get">
<select name="x" size="1" onchange="location=this.options[this.selectedIndex].value;" style="border: 1px solid black; width: 40px;">
<option value="#" title="Select an action"> -- </option>
<option value="/Applications/COS/Administration/Workshops/Parameters/14561?CLEAR" title="Parameters">P</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Parameters/14561?CLEAR" title="Parameters">P</a> -->
<option value="/Applications/COS/Administration/Workshops/Teachers/14561?CLEAR" title="Teachers">T</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Teachers/14561?CLEAR" title="Teachers">T</a> -->
<option value="/Applications/COS/Administration/Workshops/Franchise/14561?CLEAR" title="Franchise">F</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Franchise/14561?CLEAR" title="Franchise">F</a> -->
<option value="/Applications/COS/Administration/Workshop_Profiles?workshopRef=BegImpApr20" title="User Profiles">U</option>
<option value="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=BegImpApr20" title="Wait List">W</option>
<!-- <a href="/Applications/COS/Administration/Workshop_Profiles?workshopRef=BegImpApr20" title="User Profiles">U</a>
<a href="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=BegImpApr20" title="Wait List">W</a>-->
<option value="/Applications/COS/Administration/Workshops/Edit/14561?CLEAR" title="Edit">E</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Edit/14561?CLEAR" title="Edit">E</a> -->
<option value="/Applications/COS/Administration/Workshops/Copy/14561?CLEAR" title="Copy">C</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Copy/14561?CLEAR" title="Copy">C</a> -->
<option value="/Applications/COS/Administration/Workshops/Delete/14561?CLEAR" title="Delete">D</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Delete/14561?CLEAR" title="Delete">D</a> -->
</select>
</form>
</td></tr>
<tr style="background-color: #eeeeee;">
<td valign="top" style="font-size: 9px;">MJ</td>
<td valign="top" style="font-size: 9px;">
<acronym style="cursor: help;" title=" Expired">E
</acronym></td>
<td valign="top" align="left" style="font-size: 9px;">04.04.20</td>
<td valign="top" align="left" style="font-size: 8px;">Intermediate</td>
<td valign="top" style="font-size: 9px;">Jango Workshop - add beautiful tango moves & techniques to your dancing. 1700-1930</td>
<td valign="top" align="left" style="font-size: 9px;">SHIFNAL VILLAGE HALL, ASTON STREET, SHIFNAL, TF11 8DW</td>
<td valign="top" align="left" style="font-size: 9px;">None</td>
<!-- <td valign="top" align="center" style="font-size: 9px;">04.02.20 00.25</td> -->
<td valign="top" align="right" style="font-size: 9px;" nowrap="nowrap">
<form action="" method="get">
<select name="x" size="1" onchange="location=this.options[this.selectedIndex].value;" style="border: 1px solid black; width: 40px;">
<option value="#" title="Select an action"> -- </option>
<option value="/Applications/COS/Administration/Workshops/Parameters/14554?CLEAR" title="Parameters">P</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Parameters/14554?CLEAR" title="Parameters">P</a> -->
<option value="/Applications/COS/Administration/Workshops/Teachers/14554?CLEAR" title="Teachers">T</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Teachers/14554?CLEAR" title="Teachers">T</a> -->
<option value="/Applications/COS/Administration/Workshops/Franchise/14554?CLEAR" title="Franchise">F</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Franchise/14554?CLEAR" title="Franchise">F</a> -->
<option value="/Applications/COS/Administration/Workshop_Profiles?workshopRef=Shif-APR20" title="User Profiles">U</option>
<option value="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=Shif-APR20" title="Wait List">W</option>
<!-- <a href="/Applications/COS/Administration/Workshop_Profiles?workshopRef=Shif-APR20" title="User Profiles">U</a>
<a href="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=Shif-APR20" title="Wait List">W</a>-->
<option value="/Applications/COS/Administration/Workshops/Edit/14554?CLEAR" title="Edit">E</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Edit/14554?CLEAR" title="Edit">E</a> -->
<option value="/Applications/COS/Administration/Workshops/Copy/14554?CLEAR" title="Copy">C</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Copy/14554?CLEAR" title="Copy">C</a> -->
<option value="/Applications/COS/Administration/Workshops/Abort/14554?CLEAR" title="Abort">A</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Abort/14554?CLEAR" title="Abort">A</a> -->
<option value="/Applications/COS/Administration/Workshops/Delete/14554?CLEAR" title="Delete">D</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Delete/14554?CLEAR" title="Delete">D</a> -->
</select>
</form>
</td></tr>
<tr style="background-color: white;">
<td valign="top" style="font-size: 9px;">LT</td>
<td valign="top" style="font-size: 9px;">
<acronym style="cursor: help;" title=" Current">C
</acronym></td>
<td valign="top" align="left" style="font-size: 9px;">24.02.22</td>
<td valign="top" align="left" style="font-size: 8px;">Workshop</td>
<td valign="top" style="font-size: 9px;">SILC Academy</td>
<td valign="top" align="left" style="font-size: 9px;">Copford Village Hall, 80 School Road, Copford, Colchester, Essex, CO6 1BX</td>
<td valign="top" align="left" style="font-size: 9px;">None</td>
<!-- <td valign="top" align="center" style="font-size: 9px;">08.01.19 18.49</td> -->
<td valign="top" align="right" style="font-size: 9px;" nowrap="nowrap">
<form action="" method="get">
<select name="x" size="1" onchange="location=this.options[this.selectedIndex].value;" style="border: 1px solid black; width: 40px;">
<option value="#" title="Select an action"> -- </option>
<option value="/Applications/COS/Administration/Workshops/Parameters/14280?CLEAR" title="Parameters">P</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Parameters/14280?CLEAR" title="Parameters">P</a> -->
<option value="/Applications/COS/Administration/Workshops/Teachers/14280?CLEAR" title="Teachers">T</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Teachers/14280?CLEAR" title="Teachers">T</a> -->
<option value="/Applications/COS/Administration/Workshops/Franchise/14280?CLEAR" title="Franchise">F</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Franchise/14280?CLEAR" title="Franchise">F</a> -->
<option value="/Applications/COS/Administration/Workshop_Profiles?workshopRef=SA 24/2/19" title="User Profiles">U</option>
<option value="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=SA 24/2/19" title="Wait List">W</option>
<!-- <a href="/Applications/COS/Administration/Workshop_Profiles?workshopRef=SA 24/2/19" title="User Profiles">U</a>
<a href="/Applications/COS/Administration/Workshop_Waitlist?workshopRef=SA 24/2/19" title="Wait List">W</a>-->
<option value="/Applications/COS/Administration/Workshops/Edit/14280?CLEAR" title="Edit">E</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Edit/14280?CLEAR" title="Edit">E</a> -->
<option value="/Applications/COS/Administration/Workshops/Copy/14280?CLEAR" title="Copy">C</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Copy/14280?CLEAR" title="Copy">C</a> -->
<option value="/Applications/COS/Administration/Workshops/Abort/14280?CLEAR" title="Abort">A</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Abort/14280?CLEAR" title="Abort">A</a> -->
<option value="/Applications/COS/Administration/Workshops/Delete/14280?CLEAR" title="Delete">D</option>
<!-- <a href="/Applications/COS/Administration/Workshops/Delete/14280?CLEAR" title="Delete">D</a> -->
</select>
</form>
</td></tr>
</tbody></table>
我為來到這里的其他人找到了自己的問題解決方案。
下面的代碼正在查找名稱以“x”開頭的所有選擇標簽。
然后它獲取對象的長度 - 遍歷所有元素以從每個元素中提取選項 1 值! 那正是我所需要的。
var sel;
const relevantValues = [];
for(var z=0; z<selects.length; z++){
sel = selects[z];
if(sel.name.indexOf('x') === 0){
relevantValues.push(sel.options[1].value);
};
};
聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.