Finding Xpath of element within angular table
希望有人能够帮助我
我正在尝试在下表中找到Xpath
因此，我希望忽略表中的第一行，但返回第二行和第三行的权利转移框，依此类推。
下面是表格的HTML代码
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 34 35 36 37 38 39 40 41 42 43 44 45 46 47 48 49 50 51 52 53 54 55 56 57 58 59 60 61 62 63 64 65 66 67 68 69 70 71 72 73 74 75 76 77 78 79 80 81 82 83 84 85 86 87 88 89 90 91 92 93 94 95 96 97 98 99 100 101 102 103 104 105 106 107 108 109 | <thead> <tr> <th class="text-right col-md-1">Transferor Business ID</th> <th class="text-right col-md-1">Transferee Business ID</th> <th class="text-right">Transfer Type</th> <th class="text-right">Date of Transfer</th> <th class="text-right">Effective Date</th> <th class="text-right">Entitlements Transferred</th> <th class="text-right col-md-1">Group ID</th> <th class="text-right col-md-1">Year of Transfer</th> <th class="text-right col-md-1">Leased Until</th> <th class="text-right">Hide Externally</th> <th class="text-right"></th> </tr> </thead> <tbody> <!-- ngRepeat: transfer in completedTransfersSummary track by $id(transfer) --><tr ng-repeat="transfer in completedTransfersSummary track by $id(transfer)"> <td style="vertical-align: middle; color: rgb(166, 166, 166);" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" ng-class="{'highlight' : transfer.transferorBusinessId == CisBusinessID }" class="highlight">622402</td> <td style="vertical-align: middle; color: rgb(166, 166, 166);" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" ng-class="{'highlight' : transfer.transfereeBusinessId == CisBusinessID }">661017</td> <td style="vertical-align: middle; color: rgb(166, 166, 166);" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">Lease</td> <td style="vertical-align: middle; color: rgb(166, 166, 166);" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">22/06/2016</td> <td style="vertical-align: middle; color: rgb(166, 166, 166);" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">13/04/2016</td> <td style="vertical-align: middle; color: rgb(166, 166, 166);" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">3.00 entitlements @ a??242.55</td> <td style="vertical-align: middle; color: rgb(166, 166, 166);" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">513453</td> <td style="vertical-align: middle; color: rgb(166, 166, 166);" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">2016</td> <td style="vertical-align: middle; color: rgb(166, 166, 166);" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">2017</td> <td style="vertical-align: middle; text-align: center;"> <input type="checkbox" ng-model="transfer.isTransferHiddenForExternal" ng-show="false" ng-click="changeVisisbilityOfTransferOnExternalScreen(transfer)" class="ng-pristine ng-untouched ng-valid ng-hide"> </td> <td style="vertical-align: middle;"> <label style="vertical-align: middle; color: rgb(166, 166, 166);" ng-show="true" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">Withdrawn</label> <label style="vertical-align: middle; color: rgb(166, 166, 166);" ng-show="false" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" class="ng-hide"></label> Undo Undo Withdraw Withdraw </td> </tr><!-- end ngRepeat: transfer in completedTransfersSummary track by $id(transfer) --><tr ng-repeat="transfer in completedTransfersSummary track by $id(transfer)"> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" ng-class="{'highlight' : transfer.transferorBusinessId == CisBusinessID }" class="highlight">622402</td> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" ng-class="{'highlight' : transfer.transfereeBusinessId == CisBusinessID }">602024</td> <td style="vertical-align: middle" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">Lease</td> <td style="vertical-align: middle" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">18/04/2016</td> <td style="vertical-align: middle" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">18/04/2016</td> <td style="vertical-align: middle" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">11.00 entitlements @ a??242.55</td> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">513453</td> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">2016</td> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">2017</td> <td style="vertical-align: middle; text-align: center;"> <input type="checkbox" ng-model="transfer.isTransferHiddenForExternal" ng-show="true" ng-click="changeVisisbilityOfTransferOnExternalScreen(transfer)" class="ng-pristine ng-untouched ng-valid"> </td> <td style="vertical-align: middle;"> <label style="vertical-align: middle" ng-show="false" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" class="ng-hide"></label> <label style="vertical-align: middle" ng-show="false" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" class="ng-hide"></label> Undo Undo Withdraw Withdraw </td> </tr><!-- end ngRepeat: transfer in completedTransfersSummary track by $id(transfer) --><tr ng-repeat="transfer in completedTransfersSummary track by $id(transfer)"> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" ng-class="{'highlight' : transfer.transferorBusinessId == CisBusinessID }" class="highlight">622402</td> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" ng-class="{'highlight' : transfer.transfereeBusinessId == CisBusinessID }">611485</td> <td style="vertical-align: middle" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">Lease</td> <td style="vertical-align: middle" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">18/04/2016</td> <td style="vertical-align: middle" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">18/04/2016</td> <td style="vertical-align: middle" nowrap="" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">4.00 entitlements @ a??242.55</td> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">513453</td> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">2016</td> <td style="vertical-align: middle" ng-style="transfer.isDisabled && {color:'#A6A6A6'}">2017</td> <td style="vertical-align: middle; text-align: center;"> <input type="checkbox" ng-model="transfer.isTransferHiddenForExternal" ng-show="true" ng-click="changeVisisbilityOfTransferOnExternalScreen(transfer)" class="ng-pristine ng-untouched ng-valid"> </td> <td style="vertical-align: middle;"> <label style="vertical-align: middle" ng-show="false" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" class="ng-hide"></label> <label style="vertical-align: middle" ng-show="false" ng-style="transfer.isDisabled && {color:'#A6A6A6'}" class="ng-hide"></label> Undo Undo Withdraw Withdraw </td> </tr><!-- end ngRepeat: transfer in completedTransfersSummary track by $id(transfer) --> </tbody> </table> |
我尝试创建以下Xpath，但它返回的是转移的每个权利框，而不是仅在同一行中具有外部隐藏复选框的那些框。
1 | ("//td[contains(.,'entitlements @') and //tr[contains(.//@ng-class, 'transfer.transferorBusinessId == CisBusinessID')]//input[@type='checkbox' and @ng-show='true']]") |
您可以尝试以下操作：
1 | .//input[@ng-show='true']/ancestor::tr[1]/td[contains(text(),'entitlements @')] |
取决于复选框是使用ng-show true还是false启用/禁用的，这应该可以。
如果Html中还有其他复选框，则可以使用ng-model进行唯一标识。使用以下xpath：
1 | .//input[@ng-model='transfer.isTransferHiddenForExternal' and @ng-show='true']/ancestor::tr[1]/td[contains(text(),'entitlements @')] |
要仅选择具有
1 | //tr[td[contains(text(),'entitlements @')] and td/div/input[@type='checkbox']/@ng-show='true'] |
要显示一些实际内容，请在末尾添加一些表达式。
使用
1 | //tr[descendant::input[@ng-show='true']]//td[contains(text(),'entitlements @')] |
XPath轴
如果要基于tr位置从"已转让的权利"列中检索数据，可以在xpath下使用。
1 | .//input[@ng-show='true']/ancestor:://tr[position()>1]//td[contains(text(),'entitlements @')] |