Select 跨度文本的行索引值

Question

我如何制作一个选择器或算法 return 带有跨度文本的行索引值？

Html代码：

<div class="container">
<div row-index="0">
   <div>
      <div>
         <span>
            <div>
               <span>
               Test1234
               </span>
            </div>
         </span>
      </div>
   </div>
</div>
<div row-index="1">
   <div>
      <div>
         <span>
            <div>
               <span>
               1234test
               </span>
            </div>
         </span>
      </div>
   </div>
</div>
</div>

预期结果：getIndex("1234test"); //将 return 1 因为 row-index='1'

我尝试的一切都没有帮助我找到最终的解决方案，你能提出解决方案或给我一些建议吗？我真的不知道从哪里开始

Answer 1

我认为最简单的方法就是使用xpath来解决问题。

让我们为此创建一个函数：

async function getRowIndexBy(text) {
  const element = await $(`.//span[normalize-space()='${text}']/ancestor::div[@row-index]`);

  return element.getAttribute('row-index');
}

用法：

await getRowIndexBy('1234test'); // will return '1'

此函数将找到由文本（在您的情况下为 span）找到的元素的祖父母元素（在您的情况下为 div 和 row-index 属性）并将return row-index 属性的值。

根据提供的 HTML:

进行测试

Select 跨度文本的行索引值

Select row-index value by span text

javascript

css-selectors

webdriver-io