选择跨度 - css 选择器 - Ruby

Question

我正在尝试选择并点击这个<span>

<span class="el-icon 28-0"></span>

在下面的层次结构中，但无法这样做。

<div class="list-wrap ng-scope" ng-repeat="d in cols">
            <div class="list-element selected" ng-click="a.cb(d.name, member.name)" ng-class="{selected: (selectValue === d.name || selectValue === member.name + ' ' + d.name)}">
                <span class="el-icon 28-0"></span>
                <!-- ngIf: !d.displayName --><span ng-if="!d.displayName" class="el-text ng-binding ng-scope">
                     28.0 
                </span><!-- end ngIf: !d.displayName -->
                <!-- ngIf: d.displayName -->
            </div>
        </div>
 <div class="list-wrap ng-scope" ng-repeat="d in cols">
            <div class="list-element" ng-click="a.cb(d.name, member.name)" ng-class="{selected: (selectValue === d.name || selectValue === member.name + ' ' + d.name)}">
                <span class="el-icon 27-0"></span>
                <!-- ngIf: !d.displayName --><span ng-if="!d.displayName" class="el-text ng-binding ng-scope">


                     27.0 
                </span><!-- end ngIf: !d.displayName -->
                <!-- ngIf: d.displayName -->
            </div>
        </div>

这是页面，我正在引用

https://docs.saucelabs.com/reference/platforms-configurator/?_ga=1.5883444.608313.1428365147#/

在“浏览器”部分，我尝试选择 FF 28.0

我试过了

@driver.find_element(:css,"span.el-icon.28-0")

但它给了

The given selector span.el-icon.28-0 is either invalid or does not result in a WebElement.

也试过了

@driver.find_element(:css,"span.el-text.ng-binding.ng-scope").click

给了

 Element is not currently visible and so may not be interacted with

Answer 1

Valid CSS classes cannot start with a number.

如果更改类名不适合您，请尝试将选择器更改为 span.el-icon[class*="28-0"]

注意：'contains' 选择器[class*=...] 匹配给定属性包含给定值的任何元素。在这种情况下，任何具有包含“28-0”的类属性的元素都将被匹配。您也可以使用alt、src 或href 之类的东西来匹配外部图像或链接。 Read more here.