3.5.0 等待元素
我们大家有没有这种经历,点击了一个链接或者按钮。Web界面会经过或长或短的一段时间,才显示出一个新的界面。我们做 web自动化的时候,脚本的执行是非常快的,我们脚本里面的代码,点击一个链接后,立即想去新的界面里面获取某个元素,往往会出现该元素没有找到的错误,因为浏览器的界面还没有更新,让这个元素显示出来。下面我们以以前讲的一个小案例来讲解这个问题。
#从selenium里面导入webdriver
from selenium import webdriver
#指定chrom的驱动
#执行到这里的时候Selenium会到指定的路径将chrome driver程序运行起来
driver = webdriver.Chrome('E:\ChromDriver\chromedriver.exe')
#driver = webdriver.Firefox()#这里是火狐的浏览器运行方法
#get 方法 打开指定网址
driver.get('http://www.baidu.com')
#选择网页元素
element_keyword = driver.find_element_by_id('kw')
#输入字符
element_keyword.send_keys('宋曲')
#找到搜索按钮
element_search_button = driver.find_element_by_id('su')
import time
#注意这里必须要等待时间,因为代码运行过快,代码运行完的时候页面还没加载出来就会找不到元素
time.sleep(2)
ret = driver.find_element_by_id('1')
print(ret.text)
if ret.text.startswith('宋曲'):#是不是已宋曲开头
print('测试通过')
else:
print('不通过')
#最后,driver.quit()让浏览器和驱动进程一起退出,不然桌面会有好多窗口
driver.quit()
我们输入宋曲之后不是要检查搜索结果吗,我们要检查id为1的元素,如果没有import time.sleep()的时候,大家会发现id为1的元素找不到,大家知道原因吗?因为我们输入完“宋曲”点击“百度一下”时候,网页的内容不是一下出来的,他要去百度服务器获取内容,等百度的服务器返回给我们的浏览器,我们才能呈现出来,中间是有一定时间差的,浏览器与服务器之间的交互没有我们代码运行的快,假如没有sleep我们点击click,python解释器立刻执行下一段代码,下一段代码立刻去寻找id为1的元素了,由于我们的程序和浏览器之间是在本地,他们之间的网络是很快的,肯定要比百度服务器速度要快,所以我们的程序请求很快就发给浏览器了,浏览器到页面去查,我们刚点击“百度一下”的时候,我们的浏览器还没来及把结果返回回来,所以他查不到就报错了,我们这里sleep两秒钟就解决了这个问题。
大家在加这个2秒钟的时候时候有没有疑问,这里为什么要写2秒,写2秒好不好?会不会不够用?那我写3秒钟够不够呢,4秒或者5秒会不会更好些?这里就存在一个问题,我到底写多少合适,写短了心里很虚,写长呢又不好比如好20秒,但是20秒大家想想这个地方不管有没有刷出来,他都强行的等待20秒,这只是一个动作假如再点击另外一个按钮,又去服务器上获取信息了还需要再等待20秒吗??这样的话你一个自动化脚本执行下来,比如有七八次操作,就要2分钟才能执行一个自动化脚本,是不是太浪费时间,可能百分之九十九的时间不会花那么多时间,百度请求数据几乎1秒都用不到,但是写短了又怕确实有些操作需要1.5秒,这个问题我们该怎么解决呢?Selenium 早就想到了这个问题,已经贴心的为我们提供了两种方法。如下:
Selenium的解决方案:
选择一个元素的时候代码的设定一个最大的等待时长,周期性(每隔半秒钟)重新寻找该元素,直到该元素找到(返回)或者超出指定最大等待时长(返回空列表或者抛出异常)。
隐式等待
全局的设定后面所有的 选择元素的代码都不需要单独的指定周期性等待了driver.implicitly_wait(10) 这里面参数10的意思是,一但调用隐式等待方法之后,他就会设置一个最大的等待时间10秒,执行了driver.implicitly_wait(10) 这段代码之后,后面任何find开头方法选择元素所有的方法,根据后面的条件去找元素by_id或by_name或by_class或by_tag,如果找不到他不会立刻返回异常,而是每隔半秒钟再去查找一次,如果还没有他再去半秒钟查询一次,这个时候find_element_by_xxx这个函数一值是睡眠状态停在这里不动了,他不会去返回一直等到你找到这个元素,比如这个元素过6秒钟才呈现出来,这个调用等了6秒钟才返回,这是底层实现的,如果超出最大等待时长10秒钟,element就会抛出异常elements就会返回空列表
以后大家 一创建webdriver对象,就条件反射一样,加上implicitly_wait(),就像下面这样:
driver = webdriver.Chrome(r"d:\tools\webdrivers\chromedriver.exe")
driver.implicitly_wait(10)
显示等待
Selenium里面还有一种称之为显式等待的, 可以为一个操作专门指定等待时间,显示等待的方法运用比较少,显示等待当前这次寻找有效:
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.support import expected_conditions as EC
from selenium.webdriver.common.by import By
ele = WebDriverWait(driver, 60).until(EC.presence_of_element_located((By.ID,'username')))
有一个用隐式等待 和它等价的方法,个人觉得更加简单一些,假如我有一个特殊的操作需要等待1分钟,我可以不向示例代码那样写,前面先用临时的隐式等待改为60秒,等操作结束之后再改为10秒。
driver.implicitly_wait(60)
try:
ele = driver.find_element_by_id('1')
print(ele.text)
if ele.text.startswith('宋曲'):
print('pass')
else:
print('fail')
except:
print('exception happened')
finally:
driver.implicitly_wait(10)
3.5.1 在 frame、iframe 里面操作
现在的网页,有很多里面会包含frame或者iframe,要对里面的元素进行操作,就必须要使用Selenium WebDriver的switch_to方法。一个例子获取网易云音乐排行榜信息。
大家打开这个url:https://music.163.com/#/discover/toplist?id=60198
打开之后发现有个Billboard排行榜,假如有个需求要把排行榜里面的歌找出来我们要怎么做呢,按照我们老的套路找到这些歌所在的区域有什么特性,我们可以我们之前介绍的两种方法进行查看。
我们发现这是第一首歌,我们往上找因为我们要找整个歌曲的列表我们不是只找一首歌。
会发现所有的td都是属于tr的,整个tr就是整个第一行代表第一首歌,我们可以看下后面的tr就是第二行第三行。
那我们就可以知道整个tbody就是整个歌如果不放心的话可以把歌拉倒最下面,然后点击tbody
就是页面上显示的所有的歌,tbody就是table里面的表thead就是表头,接下我们把表里面的内容进行处理,接下来我们怎么来找表里面的元素呢?我们可以看表上面,tbody没有id,通长我们就往上找就是找他的上层元素,上层的table没有id上面的div有id。
我们看到table是有class其实我们也可以用calss,但是class有可能跟其他元素相同,通常id是唯一的如果有id就用id,我们把光标放在有id的div元素哪里发现还是表的范围,这里有的同学可能就用id了,但是这里给大家讲个知识点,当我们通过id定位的时候要留个小心眼,看看id的名字是什么意思,看id的名字和这个表是否有种对应关系,如果没有对应关系,就看看名字他是auto-id后面一串乱七八槽的东西,通常这样的id要有警觉性,通常id名字和他的内容不产生对应关系,要怀疑他是不是随机值,那怎么验证他是不是随机值呢,你可以再打开一个网页再去查看他的id信息会发现他的id变了,这是因为有的前端他是通过框架去产生的id,他会去随机生成,这种情况就不能用这个id,这个时候我们就继续往上找,我们再往上找一层,注意有的时候HTML里面好多层包含文本的范围都是差不多的,我们在往上层找,发现上层又有一个auto-id。
他还是不能用,继续往上找:
我们发现找到这层高亮显示的部分还是这个范围,这个id没有乱七八槽的字符串了,这个不是随机产生了,我们先根据id找到这个元素然后把里面所有的文本内容打印出来,对应的代码是:
#从selenium里面导入webdriver
from selenium import webdriver
#指定chrom的驱动
#执行到这里的时候Selenium会到指定的路径将chrome driver程序运行起来
driver = webdriver.Chrome('E:\ChromDriver\chromedriver.exe')
#driver = webdriver.Firefox()#这里是火狐的浏览器运行方法
#隐式等待
driver.implicitly_wait(10)
#get 方法 打开指定网址
driver.get('https://music.163.com/#/discover/toplist?id=60198')
#通过id找到元素,并打印文本
div = driver.find_element_by_id('song-list-pre-cache')
print(div.text)
#退出
driver.quit()
运行上段代码我们会发现pychrom输出结果会停了好久没反应,接着弹出报错:
这里大家应该存在两个疑问:1.为什么停了好久没反应?2.为什么过了一段时间才抛出异常?根据报错信息我们定位报错的代码是div = driver.find_element_by_id('song-list-pre-cache'),意思是根据这个id找不到,但是为什么过了好久才报错呢,是因为隐式等待,那第二问题为什么会失败?为什么没找到呢,如果大家以后碰到这种问题明明很简单根据id没找到,大家有理由去怀疑这个元素是在一个fram里面,我们继续打开网易云,顺着这个元素往上找。
底下这个条子就是当前找的这个元素在整个html树上属于哪个节点,上一个就是他的父节点,这边用“...”三个点缩起来了,因为他的上层节点很多,点一下就可以展开,我们往上层一层层找,会找到一个body节点:
body是整个HTML里面的,我们再网上找发现确实有个html,一般来说html是整个HTML文本的跟节点最上层的那个节点,但是我们再网上找会发现一个iframe的节点:
然后iframe上面又有一个body,body上面又有一个html,所以说iframe在HTML里面是一个很特殊的元素,iframe内部会有另外一个HTML,如果把一个HTML文档的范围比喻成一个国家的话,iframe就像一个国中之国 ,这个地方为什么找不到就是这个原因,我们缺省用Selenium打开一个网页的时候,他的查找范围是当前的根HTML里面,如果说HTML里面有个iframe的话,iframe里面这个HTMl元素他会忽略掉的他不会去找,这就是为什么找不到的原因,假如我们现在就要找iframe里面的这个元素要怎么找呢?这个就需要另外的方法了。
常见的frame有两种:
一种是frameset: 打开http://www.w3school.com.cn/html/html_frames.asp通过使用框架,你可以在同一个浏览器窗口中显示不止一个页面。每个frame 都对应了一个html文档。
另一种是iframe:inner frame的意思。打开 http://www.w3school.com.cn/html/html_iframe.asp
iframe 用于在网页内显示网页。和frameset不同的是,frameset内置好几个子html而 iframe 只内置一个子html,因为 frame 或者iframe 都是一个全新的 html 文档, 是被嵌入的另一份html文档,我们Selenium driver当前打开的是 主 html, 而我们这里要查看的是被嵌入的html,selenium 当前 的 webdriver element 对应的是主 html 不能找到 iframe 里面的 html 的元素。
- 切换到frame里面:
driver.swith_to.frame()
切换frame可以用:index(索引值从0开始)、id(注意那些会变的id)、name 、webelement(driver.find_element_by_tag_name('iframe'))任意种方式切换。
切换回主html里面:
driver.switch_to_default_content()
用这个方法就可以切入到frame里面,注意HTML中他可能不止一个frame有何能有很多,假如有多个要切换到那个frame里面的,我们看一下我们要切入的这个iframe
他有name也有id,我们先通过name,看代码:
from selenium import webdriver
#指定chrom的驱动
#执行到这里的时候Selenium会到指定的路径将chrome driver程序运行起来
driver = webdriver.Chrome('E:\ChromDriver\chromdriver2.43\chromedriver.exe')
driver.implicitly_wait(10)
#get 方法 打开指定网址
driver.get('https://music.163.com/#/discover/toplist?id=60198')
#通过name
driver.switch_to.frame("contentFrame")
#找到表并打印文本
div = driver.find_element_by_id('song-list-pre-cache')
print(div.text)
#退出
driver.quit()
也可以通过id:
driver.switch_to.frame("g_iframe")
如果没有name也没有id没有任何属性该咋办呢,我们可以通过下标:
driver.switch_to.frame(0)
这样也是可以的,如果iframe里面又嵌套了一个iframe该怎么办呢,首先我们要先切换到第一个iframe里面再切换到嵌套的iframe里面,比如我们name等于“contentFrame”iframe里面嵌套了一个id为“abc”的iframe,该怎么写呢?
driver.switch_to.frame("contentFrame")
driver.switch_to.frame("abc")
就可以了,然后在id为‘abc’的iframe里面去找元素。我们进入iframe里面操作完歌曲列表,想退出外层比如我想操作导航栏里面的内容推荐,排行榜怎么找?注意我们不能紧接着上面的代码去找,因为导航栏不在iframe里面,这个iframe就是在最外层的,需要怎么退到最外层呢,看代码:
driver.switch_to.default_content()
这就退出到最外层了。
本章完,喜欢点个赞(* ̄︶ ̄)
下面是小练习
打开百度新歌榜, http://music.baidu.com/top/new
在排名前50的歌曲中,找出其中排名上升的歌曲和演唱者注意: 有的歌曲名里面有 "影视原声" 这样的标签, 要去掉大家打开链接看一下,那些是排行上升的歌曲,就是箭头向上的,经过我们的查找i class=“up”(i就是icon图标的意思)的就是排行上升的歌曲。
那我们就找所有元素里面icon是up的就是上升的,但是这个i class=‘up’不是我们最终要找的,我们要找的是他所属的上层的节点。
他的上层节点是div,div的上层节点是li,最后我们发现每行歌对应一个li
那我们要找的就是所有的li,这个li是属于ul的,li里面所有具有i class=‘up’的就是我们要找的歌,那我们怎么找到所有的li呢?我们能不能用find_elements_by_tag_name(),这个方法呢,这里我们是不建议的,这样找是整个页面去找的可能会找到不属于ul的li那就多找了,通长做web自动化我们先找明确包含你想找的范围里面的li,这里就是ul,你先找到他的上层节点把他的范围限定下,不要在整个范围去找li,方法就是找上层节点,但是这个上层节点没有id我们就再往上层找,这里我们就找到了div。
正好这个div也是包含这20首歌的,代码如下:
#从selenium里面导入webdriver
from selenium import webdriver
#指定chrom的驱动
#执行到这里的时候Selenium会到指定的路径将chrome driver程序运行起来
driver = webdriver.Chrome('E:\ChromDriver\chromdriver2.43\chromedriver.exe')
#driver = webdriver.Firefox()#这里是火狐的浏览器运行方法
driver.implicitly_wait(10)
#get 方法 打开指定网址
driver.get('http://music.taihe.com/top/new')
#层层往下找
#div = driver.find_element_by_id('songListWrapper')
#liList = div.find_elements_by_tag_name('li')
#上面两行可以写成这样
liList = driver.find_elements_by_css_selector('#songListWrapper li')
#这里改成0.5因为find如果找不到就会等待10秒,
# 但是不是所有的歌都是有上升箭头的,改成0.5就不用等了
driver.implicitly_wait(0.5)
for li in liList:
#那些是有up标签的歌曲
upTags = li.find_elements_by_class_name('up')
if upTags:
#由于只要歌曲名和演唱者名
title = li.find_element_by_class_name('song-title')
titlesStr = title.find_element_by_tag_name('a').text
authorsStr = li.find_element_by_class_name('author_list').text
print(f'{titlesStr:10s}:{authorsStr}')
driver.implicitly_wait(10)
driver.quit()
大家可以运行试一下,看看是不是想要的结果,这里我们用了新的知识点,我们没学习CSS、XPath之前为了找到寻找songListWrapper里面的li,我们先找到他的上层songListWrapper再找里面的li,这里面我们用一行语句就搞定了,一步到位。