当前位置: 首页 > 面试题库 >

选择硒的第N个类型

邵诚
2023-03-14
问题内容

我正在尝试使用By.cssSelector来捕获类c3的第n个dom元素,其结构如下:

<div class="c1">
    <div class="c2">
        <div class="c3">...</div>
    </div>
</div>
<div class="c1">
    <div class="c2">
        <div class="c3">...</div>
    </div>
</div>
<div class="c1">
    <div class="c2">
        <div class="c3">...</div>
    </div>
</div>

测试我的CSS选择器时,我变得越来越困惑。此选择器正确选择c2 / c3的第二个实例:

.c1:nth-of-type(2)

而:

.c2:nth-of-type(2)
.c3:nth-of-type(2)

什么都不选。

更糟糕的是,将其转换为硒,我似乎始终没有为所有3个版本找到任何东西。有很多选择这些元素的替代方法(我可能只做XPATH),但是我对nth-of-
type的缺乏了解使我发疯。谁能提供关于第二个为什么不起作用的见解,或者纠正我对这个选择器的基本缺乏理解?

编辑:这已经在Chrome(29/30)和Firefox(24/25)中


问题答案:

我不确定要选择 一个,但是您应该使用:nth-​​ *伪类来做更多的事情。这是一个CSS选择器,它选择使用所有3个c3nth-child()

div.c1 div.c3:nth-child(1)

就像我说的,您尚未真正指定要选择的那个。

但是我对第n种类型的缺乏了解使我发疯。谁能提供关于第二个为什么不起作用的见解,或者纠正我对这个选择器的基本缺乏理解?

要记住的一件事是,所有:nth-*()伪类都依赖于其父级。让我翻译您的选择器:

.c1:nth-of-type(2)

查找属于c1类的第二个孩子。

就您而言,<body>很可能是父母,所以…

<body>
  <div .c1 />
  <div .c1 /> // it highlights this one, because it's the 2nd child of the type ".c1"
  <div .c1 />
</body>

现在,让我解释一下为什么其他选择器不起作用。

两者.c2:nth-of-type(2).c3:nth-of- type(2)也在看父母的。由于您指定的是父项,因此期望<body>作为父项。就您而言,<body>不是父母<div .c1 />。实际上,该选择器正在寻找DOM-

<body>
  <div .c1 />
  <div .c2 /> // this **would** be the second nth-of-type, but it's not really this way. 
  <div .c1 />
</body>

在http://cssdesk.com
上尝试使用不同的CSS选择器和伪类,主动进行自己的实验非常有帮助。您会发现的。



 类似资料:
  • 问题内容: 我正在尝试使用By.cssSelector来捕获类c3的第n个dom元素,其结构如下: 测试我的CSS选择器时,我变得越来越困惑。此选择器正确选择c2 / c3的第二个实例: 而: 什么都不选。 更糟糕的是,将其翻译成selenium,我似乎始终没有为所有3个版本找到任何东西。有很多选择这些元素的替代方法(我可能只做XPATH),但是我对nth-of- type的缺乏了解使我发疯。谁能

  • 问题内容: 以下是我的HTML页面的摘要: 在这里我想选择id =’platinum’的第三个td元素 我试过的是。 和 两者对于如何选择第三个td都不起作用 问题答案: 有一个没有ID 的空值,这会干扰计数。选择器的意思是“第n个元素”,而不是“第n个元素”。因此,具有该ID 的第三个实际上是整个行中的第四个。 使用CSS选择器无法选择具有特定ID 的第三个元素。您应该改用XPath:

  • 问题内容: 如何调整以下CSS选择器: 所以它适用于TD列2-4? 问题答案: 您将无法一次完成此操作-您将需要链接至少一个其他此类伪类。例如,的组合和(该位装置开始从第二子分别计数向前和向后): 或者,不使用公式,只需排除和:

  • 给定:一个简单的彩色高光数组,只在CSS中控制。 有没有办法,缩短下面的巨大的CSS代码块,同时保持相同的结果? 换句话说,当选择多个声明时,是否有一种方法可以消除代码中的重复性,只使用CSS?

  • 问题内容: 使用标准列表,我尝试选择最后2个列表项。我有多种排列方式,但似乎没有什么可以选择最后2种: 我知道类似CSS3的新选择器,但如果可能的话,我更喜欢一些可以在更多浏览器中使用的选择器(不必特别在意IE)。 问题答案: 这将选择列表的最后两个项目:

  • 问题内容: 我正在使用以下SQL语句: 但是每次表获得新行时,查询结果都会不同。 我想念什么吗? 问题答案: 假设这是唯一的,并且新行总是具有更大的(以后)。 经过一番评论: 我 认为 您需要: 请注意 。这样,您就跳过每一秒每一个和附加(后下)行不改变选择为止。 另外,只要您为 _ 单个_ ()选择行,就将谓词拉入子查询,即可达到相同的效果(单个用户的稳定选择)。两者都不需要。 该子查询中的条款