Selenium,选择<span> </span>内的元素

时间:2015-01-05 01:39:13

标签: python xpath selenium-webdriver phantomjs html-select

错误是:

Select only works on <select> elements, not on <span>.  Trying to accomplish this using PhantomJS & Selenium in Python.

最近我可能会找到答案:

How can i select this span element?

尝试学习Selenium自动化,并认为使用Gmail工作将是一个挑战。现在正试图选择出生月份&#39;在帐户创建阶段。

https://accounts.google.com/SignUp?service=mail&continue=https%3A%2F%2Fmail.google.com%2Fmail%2F&ltmpl=default&hl=en

现在,尝试按xpath选择,如下所示(以及导致上述错误的原因)。

select_birthday_month = Select(driver.find_element_by_xpath('//span[@id="BirthMonth"]')

Gmail页面上的代码为:

<div class="form-element multi-field birthday" id="birthday-form-element">
  <fieldset>
  <legend><strong id="BirthdayLabel">Birthday</strong></legend>
  <label id="month-label" class="month">
  <span id="BirthMonthHolder" >
  <select id="BirthMonth" name="BirthMonth">
  <option value="">Month</option>
  <option value="01" >
  January</option>
  <option value="02" >
  February</option>
  <option value="03" >
  March</option>
  <option value="04" >
  April</option>
  <option value="05" >
  May</option>
  <option value="06" >
  June</option>
  <option value="07" >
  July</option>
  <option value="08" >
  August</option>
  <option value="09" >
  September</option>
  <option value="10" >
  October</option>
  <option value="11" >
  November</option>
  <option value="12" >
  December</option>
  </select>
  </span>
  </label>

我试过了:

 select_birthday_month = driver.find_element_by_xpath('//span[@id="BirthMonth"].click() 

(正如其他一些stackoverflow答案在遇到此问题时建议的那样)。然后选择月份值的x路径。但我收到的错误是说x-path无法找到。

任何人都可以提出最佳方法吗?我需要先点击元素吗?是否有一个很好的方法来解决这个问题。 X-路径? Chrome上的右击/检查元素适用于基本的东西,但是当进入下拉列表时 - 它不会削减它。

1 个答案:

答案 0 :(得分:1)

您遇到的问题是因为Google的Select元素并未像普通的Select Option那样实现。因此,从技术上讲,您应该避免使用选择

但是,有一个解决方案,首先我们检查Google如何呈现html选项的元素,它显示如下:

<span aria-invalid="false" class=" " id="BirthMonth">
<div aria-activedescendant=":0" title="Birthday" aria-haspopup="true" tabindex="0" aria-expanded="false" style="-moz-user-select: none;" role="listbox" class="goog-inline-block goog-flat-menu-button jfk-select">
<div aria-posinset="3" aria-setsize="12" role="option" id=":0" class="goog-inline-block goog-flat-menu-button-caption">March</div>
<div aria-hidden="true" class="goog-inline-block goog-flat-menu-button-dropdown">&nbsp;</div></div><div aria-haspopup="true" role="listbox" style="-moz-user-select: none; visibility: visible; left: 0px; top: -204px; display: none;" class="goog-menu goog-menu-vertical"><div id=":1" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">January</div></div><div id=":2" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">February</div></div><div id=":3" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">March</div></div><div id=":4" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">April</div></div><div id=":5" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">May</div></div><div id=":6" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">June</div></div><div id=":7" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">July</div></div><div id=":8" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">August</div></div><div id=":9" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">September</div></div><div id=":a" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">October</div></div><div id=":b" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">November</div></div><div id=":c" style="-moz-user-select: none;" role="option" class="goog-menuitem"><div class="goog-menuitem-content">December</div></div></div><input value="03" id="HiddenBirthMonth" name="BirthMonth" type="hidden"></span>
... and the rest ...

Google已在 span 元素下的不同动态 div 中呈现正常选项,您将无法选择 a <强> div 或 span 所以你必须考虑另一种选择。

幸运的是,动态 div 包含名为goog-inline-block goog-flat-menu-button jfk-select的类,您只需要找到此元素并将密钥发送到模拟 的操作选择&lt; - 我的意思是发送输入键。

好的,这是工作解决方案:

...
# I find the div by class_name, of course you can use xpath
select_birthday_month = driver.find_element_by_class_name('jfk-select')
select_birthday_month.send_keys('January')
...

那就是它!有时你只需要在框外思考以解决类似的问题,我希望这有助于:)

查看结果:

enter image description here