Question

我使用Nightwatch.js来测试一个网站。现在我有这个HTML代码：

<div class="form-group">
    <div class="col-sm-6">
        <input id="inputTireManufacturer">
        </input>
    </div>
</div>

我需要选择input节点。但是还有其他节点id="inputTireManufacturer"。这意味着我需要一个可以选择class="form-group"元素的选择器，其中包含class="col-sm-6"元素，其中包含id="inputTireManufacturer"元素。这样的事情：.form-group:.col-sm-6:#inputTireManufacturer 但这不起作用。我该怎么办？

Answer 1

其中包含语法错误：

.form-group:.col-sm-6:#inputTireManufacturer

修复它们（删除冒号）：

.form-group.col-sm-6#inputTireManufacturer

这means

选择具有包含单词form-group的class属性的任何元素，包含单词col-sm-6的class属性，以及等于inputTireManufacturer的id属性。

您需要descendant combinators：

.form-group .col-sm-6 #inputTireManufacturer

选择id属性等于inputTireManufacturer的任何元素，该属性是任何元素的后代，其class属性包含单词col-sm-6，它是具有包含单词form的class属性的任何元素的后代 - 基。

However：

id属性指定其元素的唯一标识符（ID）。 [DOM]

元素的主子树中的所有ID中的值必须唯一，且必须至少包含一个字符。该值不得包含任何空格字符。

如果你想将一个元素标记为一组相似元素的一部分，那么使用一个类，即类所在的类。

<div class="form-group">
    <div class="col-sm-6">
        <input class="inputTireManufacturer">
        </input>
    </div>
</div>

.form-group .col-sm-6 #inputTireManufacturer

选择具有class属性的任何元素，该属性包含单词inputTireManufacturer，该元素是具有class属性的任何元素的后代，该属性包含单词col-sm-6，该单词是具有包含单词的class属性的任何元素的后代形式的基团。

如何使用css选择器获取子元素？

1 个答案: