Javascript 如何在量角器中处理具有相同指令的两个表

Javascript 如何在量角器中处理具有相同指令的两个表,javascript,html,xpath,css-selectors,protractor,Javascript,Html,Xpath,Css Selectors,Protractor,我在同一页中有两个具有相同指令的表,我只想对第二个表中的列执行一些操作 请参阅下面的html以供参考 <table role="presentation" id="gridview-1204-table" class="x-gridview-1204-table x-grid-table x-grid-with-col-lines x-grid-with-row-lines x-grid-table-selected-first x-grid-table-focused-first" bo

我在同一页中有两个具有相同指令的表,我只想对第二个表中的列执行一些操作

请参阅下面的html以供参考

<table role="presentation" id="gridview-1204-table" class="x-gridview-1204-table x-grid-table x-grid-with-col-lines x-grid-with-row-lines x-grid-table-selected-first x-grid-table-focused-first" border="0" cellspacing="0" cellpadding="0" style="width: 2274px;" tabindex="-1">
<colgroup>
<col class="x-grid-cell-gridcolumn-1124" style="width:24px">
</colgroup>
<colgroup>
<col class="x-grid-cell-gridcolumn-1027" style="width:150px">
</colgroup>
<tbody id="gridview-1204-body">
    <tr role="row" id="gridview-1204-record-1998058-null-null" data-boundview="gridview-1204" data-recordid="1998058-null-null" data-recordindex="0" class="x-grid-row x-grid-data-row x-grid-row-selected x-grid-row-focused" tabindex="-1">
        <td role="gridcell" class="x-grid-cell x-grid-td x-grid-cell-gridcolumn-1124 x-grid-cell-first x-unselectable " id="ext-gen1402">
            <div id="ext-gen1403" unselectable="on" class="x-grid-cell-inner " style="text-align:left;">
            <div class="x-grid-row-checker">&nbsp;</div>
        </div>
        </td>
        <td role="gridcell" class="x-grid-cell x-grid-td x-grid-cell-gridcolumn-1027 x-unselectable " id="ext-gen1404">
            <div id="ext-gen1405" unselectable="on" class="x-grid-cell-inner " style="text-align:left;">&nbsp;</div>
        </td>
    </tr>
</tbody>
</table>
<div>
.
.
.
.
.
<div>
<table role="presentation" id="gridview-1057-table" class="x-gridview-1057-table x-grid-table x-grid-with-col-lines x-grid-with-row-lines x-grid-table-selected-first x-grid-table-focused-first" border="0" cellspacing="0" cellpadding="0" style="width: 2274px;" tabindex="-1">
<colgroup>
<col class="x-grid-cell-gridcolumn-1125" style="width:24px">
</colgroup>
<colgroup>
<col class="x-grid-cell-gridcolumn-1028" style="width:150px">
</colgroup>
<tbody id="gridview-1057-body">
    <tr role="row" id="gridview-1057-record-1998058-null-null" data-boundview="gridview-1057" data-recordid="1998058-null-null" data-recordindex="0" class="x-grid-row x-grid-data-row x-grid-row-selected x-grid-row-focused" tabindex="-1">
        <td role="gridcell" class="x-grid-cell x-grid-td x-grid-cell-gridcolumn-1125 x-grid-cell-first x-unselectable " id="ext-gen1402">
            <div id="ext-gen1403" unselectable="on" class="x-grid-cell-inner " style="text-align:left;">
            <div class="x-grid-row-checker">&nbsp;</div>
        </div>
        </td>
        <td role="gridcell" class="x-grid-cell x-grid-td x-grid-cell-gridcolumn-1028 x-unselectable " id="ext-gen1404">
            <div id="ext-gen1405" unselectable="on" class="x-grid-cell-inner " style="text-align:left;">&nbsp;</div>
        </td>
        <td role="gridcell" class="x-grid-cell x-grid-td x-grid-cell-gridcolumn-1029 x-unselectable " id="ext-gen1406">
            <div id="ext-gen1407" unselectable="on" class="x-grid-cell-inner " style="text-align:left;">&nbsp;</div>
        </td>
    </tr>
</tbody>
</table>
甚至试过

element(by.xpath('(//tr[contains(@role,"row")][contains(@data-boundview,"gridview")])[2]/td[3]/div')).click();
但是运气不好。它总是以错误告终

[14:42:54] E/launcher - Process exited with error code 1
注意:我可以手动单击该元素,并且可以在页面加载后看到DOM中的元素。此外,Id是自动生成的。所以,我不能使用它们


有人能帮助解决这个问题吗?

首先xpath将指向表2,然后您可以使用任何策略移动到选定的行或列。。您可以链接到任意数量的元素,例如。 移至表2.row2.col3

element(by.xpath(("//tbody[@id='gridview-1057-body']")[2])) 
.element(by.something('second table row/col selector'))
.click();

对于在特定表格中选择特定元素,我建议采用以下方法:

此代码选择第二个表并单击第1行的第2列

// get second table
let table = element.all(by.css('table tbody')).get(1);

// get rows
let rows = table.all(by.tagName('tr'));

// get row1
rows.get(0)

  // get column2 of row 1
  .all(by.tagName('td'))
  .get(1)

  // click underlying div.
  .element(by.tagName('div'))
  .click();
您应该使用xpath以外的其他定位器,因为:

  • 这是最慢、最脆弱的定位策略

  • 标记很容易更改,因此
    xpath
    定位器需要大量维护

  • xpath
    表达式不可读且很难调试


reference=>

Try
//表[2]//tr[contains(@role,“row”)和contains(@data boundview,“gridview”)]
browser.sleep(10000);元素(by.css(“div[id^=StatusFilterPageId占位符”))。单击();浏览器。睡眠(6000);可以看到,即使是一个简单的点击事件也无法在相应的页面中使用量角器选择器。知道为什么吗?只有缩小这个问题的范围,我相信我们才能遍历到同一页面中的表内容。问题已经被Andersson确定。特定页面没有角度,我应该包括browser.ignoreSynchronization=true;在page类中,如果我们正在测试一个基于非角度的网站。添加了这个,我现在可以访问页面中的所有元素,并在所需的表上执行所需的操作。谢谢Silvan。我已经改变了现在使用xpath和建议使用CSS的方法。Xpath似乎很容易找到,我可能只编写几行代码来执行该操作。但是,我同意xpath是脆弱的。使用它有一个问题。该页面是用extjs开发的。选择器(by.css(table tbody)).get(4)的数组值根据用户在UI中的操作频繁更改。例如,最初我发现一个表位于数组位置(23),突然我需要单击一个下拉列表。这在DOM中形成了一个新的表结构,从而改变了初始表的数组值。我的运气不好,DOM中生成的所有这些表都没有静态唯一值。表标识必须是通用的,可以用于所有场景。我如何缓解此问题?我无法按照您对表的描述进行操作。您是否可以更新此问题或创建一个新问题来显示复制步骤?我知道您对动态创建的数据有一些问题。为了帮助您,最好描述一个特定的用例。
// get second table
let table = element.all(by.css('table tbody')).get(1);

// get rows
let rows = table.all(by.tagName('tr'));

// get row1
rows.get(0)

  // get column2 of row 1
  .all(by.tagName('td'))
  .get(1)

  // click underlying div.
  .element(by.tagName('div'))
  .click();