标签中的 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

You shouldn't use space in between selectors unless necessary, and nth-child() affects the hierarchy level rather than siblings of the same type and level

---

这将是对您的问题的解释:

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

:nth-child(1) - 未在任何元素上调用(如 p:nth-child(1) )，因此它意味着任何元素 (本来是 '任何 p 元素'，如果考虑了其他情况) 是任何元素的第一个子元素。

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

---

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

• 第一个是.FormLine , 它有一个 :nth-child(1)一个label .所以文本:'用户名'
• 下一个是label', which has no :第n个 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";

或

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

还好吗？