标签中的CSS选择器错误

Question

我试图通过CSS选择器断言关注

<label class="Label TextStyle08 sg_selected" for="username">Username</label>

代码：

assert $("#loginForm :nth-child(1)").text() == "Username"

虽然

，但仍然错误

org.codehaus.groovy.runtime.InvokerInvocationException：断言失败：

assert $("#loginForm :nth-child(1)").text() == "Username"
       |                             |      |
       []                            null   false

    at org.codehaus.groovy.reflection.CachedMethod.invoke(CachedMethod.java:97)
    at groovy.lang.MetaMethod.doMethodInvoke(MetaMethod.java:233)
    at org.codehaus.groovy.runtime.metaclass.ClosureMetaClass.invokeMethod(ClosureMetaClass.java:272)

可能是什么问题

Answer 1

  

除非必要，否则不应在选择器之间使用空格，并且nth-child（）会影响层次结构级别，而不会影响相同类型和级别的兄弟级别

---

这可以解释您的问题：

#loginform :nth-child(1) - 两个部分之间的空格意味着可以选择#loginform中的任何元素。

:nth-child(1) - 未在任何元素（如p:nth-child(1)）上调用，因此它意味着任何元素 （如果考虑其他情况，那将是'任何p元素'） ，这是任何元素的第一个子元素。 < / p>

$("#loginForm :nth-child(1)")，会在#loginform 中的任何元素内选择任何第一个孩子......

---

因此，考虑#loginform中的所有元素，选择这些元素：

• 第一个是.FormLine，其:nth-child(1)个label。所以文字：'用户名'
• 下一个是label', which has no：nth-​​child（1）。所以文字：''
• 下一个是.InpuWrap，其中:nth-child(1)为p。所以文字：''
• 下一个是.InpuBound，其:nth-child(1)和input。所以文字：''
• 下一个是.ClearItem，没有:nth-child(1)。所以文字：''
• 下一个是第二个.FormLine，其:nth-child(1)个label。所以文字：'密码'
• 然后是span，之后的div ......依此类推......直到#loginform内的每个元素都被扫描:nth-child(1)并且它的text()输出......

---

这里试试这个：

assert $("#loginForm>.FormLine:nth-of-type(1) label").text() == "Username";

OR

assert $("#loginForm>:nth-child(1)>label").text() == "Username";

一切都好吗？