在页面上选择具有相同类名的元素

Question

我正在尝试在整个页面中查找分配给它们的相同类的元素。 我尝试使用

browser.find_element(css:first-child,".formProperty.fpMandatory.fpUpdateable .off .collapsedView.Uncompleted .fpColValue .textFieldValueSelector.valueSelector  .integer").send_keys"1000"

但是，它无法说明语法错误 SyntaxError: (irb):87: syntax error, unexpected ')', expecting =>

页面上有 6 个元素分配了相同的类，我需要选择这些元素并将值发送给它们。

<div class="body">
<div class="content">
<div class="view">
<div class="formPropertyBoxDefs">
<div id="tile379" class="formProperty fpCompleted fpMandatory " ktype="formProperty">
<div id="tile381" class="formProperty fpMandatory fpUpdateable " ktype="formProperty">
<div id="tile381_selector" class="on" fbtype="selector">
<div id="collapsedtile381" class="collapsedView Uncompleted" style="display:block; cursor:default;">
<div id="tile381_collapsed_statusFlyer" class="fpColStatus">
<div class="fpColTitle">
<div class="fpColValue">
<!-- CssName applied only on expanded mode -->
<div id="tile382" class="textFieldValueSelector valueSelector">
<div onmousedown="valueSelectorOnEnter('tile381', $('tile382_input'), 'focus')">
<input id="tile382_input" class="integer" type="text" onchange="setValueSelectorDirty('cpe111');" selector="selector" value=""/>
</div>
</div>
</div>
</div>
</div>
</div>
<div id="tile383" class="formProperty fpMandatory fpUpdateable " ktype="formProperty">
<div id="tile385" class="formProperty fpCompleted fpMandatory " ktype="formProperty">

这是我试图通过类选择器选择的上述元素。 因此，我在 IRB 中运行它，不需要等待，它不在 iframe 中，正如我们在上面的代码块中看到的那样。

我们将不胜感激。

谢谢！

阿布舍克尔

Answer 1

:first-child 应该是选择器的一部分：

browser.find_element(:css,".formProperty.fpMandatory.fpUpdateable .off .collapsedView.Uncompleted .fpColValue .textFieldValueSelector.valueSelector  .integer:first-child").send_keys"1000"

要选择每个元素，您可以使用:nth-child(n)，其中n 是您要与之交互的项目的计数：

browser.find_element(:css,".formProperty.fpMandatory.fpUpdateable .off .collapsedView.Uncompleted .fpColValue .textFieldValueSelector.valueSelector  .integer:nth-child(1)").send_keys"1000"
browser.find_element(:css,".formProperty.fpMandatory.fpUpdateable .off .collapsedView.Uncompleted .fpColValue .textFieldValueSelector.valueSelector  .integer:nth-child(2)").send_keys"200"

注意：:nth-child(n) 不适用于 IE 7 或 IE 8。

希望最后一次编辑：

我认为您需要在这种情况下使用 find_elements()。

elements = browser.find_elements(:css,".formProperty.fpMandatory.fpUpdateable .off .collapsedView.Uncompleted .fpColValue .textFieldValueSelector.valueSelector  .integer")

elements[0].send_keys"1000"
elements[1].send_keys"200"

编辑解释:nth-child(n)在这种情况下的失败：

因此，您编辑的原始 HTML 如下所示：

<div id="tile381" class="formProperty fpMandatory fpUpdateable " ktype="formProperty"></div>
<div id="tile383" class="formProperty fpMandatory fpUpdateable " ktype="formProperty"></div>
<div id="tile385" class="formProperty fpCompleted fpMandatory " ktype="formProperty"></div>
<div id="tile387" class="formProperty fpMandatory fpUpdateable " ktype="formProperty"></div>
<div id="tile389" class="formProperty fpMandatory " ktype="formProperty"></div>
<div id="tile391" class="formProperty fpCompleted fpMandatory " ktype="formProperty"></div>
<div id="tile393" class="formProperty fpCompleted fpMandatory " ktype="formProperty"></div>
<div id="tile395" class="formProperty fpMandatory fpUpdateable " ktype="formProperty"></div>
<div id="tile397" class="formProperty fpMandatory " ktype="formProperty"></div>
<div id="tile399" class="formProperty fpMandatory " ktype="formProperty"></div>

当我测试:nth-child(2) 时，它在这个特定的 HTML 上工作。当我尝试nth-child(3) 时，它不起作用。

如果您的 HTML 看起来像这样：

<div id="tile381" class="formProperty fpMandatory fpUpdateable " ktype="formProperty"></div>
<div id="tile383" class="formProperty fpMandatory fpUpdateable " ktype="formProperty"></div>
<div id="tile387" class="formProperty fpMandatory fpUpdateable " ktype="formProperty"></div>
<div id="tile395" class="formProperty fpMandatory fpUpdateable " ktype="formProperty"></div>

那么:nth-child(n) 将适用于它应该匹配的所有四种情况。

鉴于您的 HTML 结构，find_elements 是正确的方法。