【Python + Selenium】之JS定位总结

最新推荐文章于 2021-02-09 06:16:14 发布

网络毒刘

最新推荐文章于 2021-02-09 06:16:14 发布

阅读量2.1k

点赞数 4

分类专栏： Python Selenium

本文链接：https://blog.csdn.net/qq_41856814/article/details/102844107

版权

Python 同时被 2 个专栏收录

188 篇文章 11 订阅

订阅专栏

Selenium

2 篇文章 1 订阅

订阅专栏

1、滚动条

driver.set_window_size(500,500)
js = "window.scrollTo(0,200)"  #左：距左边横滚、右：距上边竖滚
driver.execute_script(js)

2、获取元素的值

button = driver.find_element_by_css_selector("#su")  #定位按钮
input = driver.find_element_by_css_selector("#kw")  #定位输入框
#return：返回值  arguments[1]对应的是第二个参数，可以理解为python里的%s传参，与之类似
js = "return arguments[1].value;"   #获取第二个属性【button】的值
val = driver.execute_script(js,input,button)
print(val)

#返回结果：百度一下

3、页面加弹出窗口提示

driver.execute_script("alert('hello world!')")

扩展alert：

#接受提示信息 
from selenium.webdriver.common.alert import Alert 

driver.switch_to_alert().accept()
t=driver.switch_to_alert()
print (t.text)
t.accept()

#针对js  非div 元素的 alert 弹出事件 可以用:

from selenium.webdriver import ActionChains

alert = driver.switch_to_alert()
#模拟键盘Enter 键
ActionChains(driver).send_keys(Keys.ENTER).perform()

4、选择日期控件

参考自制一个日期控件：《带时间的日历控件》

js="$('#SystemDate').val('2017-07-21');"  
driver.execute_script(js)

但是还有一种情况，日期控件有readonly属性：

参考文章：《selenium+Python(Js处理日历控件)》

datePlugin.js

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>时间控件</title>
         <meta http-equiv="Content-Type" content="text/html; charset=utf-8">
        <script src="./js/src/datePlugin.js"></script>
    </head>
　　 <body>
     　　 <input onclick="SelectDate(this,'yyyy-MM-dd hh:mm:ss')" readonly="true"  type="text" id="date">
　　 </body>
</html>

#js去掉readonly属性
js01 = "document.getElementById('date').removeAttribute('readonly');"
driver.execute_script(js01)

#再输入值
js02 = "document.getElementById('date').value='2018-09-13';"
driver.execute_script(js02)

5、js对下拉框隐藏属性的选择

参考文章：《Selenium操作隐藏的元素》、《python+selenium select下拉选择框定位处理》

Select.html

<!DOCTYPE html>
<html>
    <head>
        <title>隐藏元素定位</title>
    </head>
    <body>
        <div id="div01">
            <div id="div01_01">
                <div id="div01_01_01">
                    <select name="sel01" style="display: none;">
                        <option value="aa">AA</option>
                        <option value="bb">BB</option>
                        <option value="cc">CC</option>
                        <option value="dd">DD</option>
                    </select>
                </div>
            </div>
        </div>
        <div id="div02" class="select_cls02">
            <div id="div02_01">
                <div id="div01_02_01">
                    <select name="sel02" style="display: none;">
                        <option value="ee">EE</option>
                        <option value="ff">FF</option>
                        <option value="gg">GG</option>
                        <option value="hh">HH</option>
                    </select>
                </div>
            </div>    
        </div>
    </body>
</html>

代码如下：


#把隐藏的属性改为可见，引号一定要加上，'block'
js = "document.querySelectorAll('select')[1].style.display='block';"
driver.execute_script(js)

#定位有以下几种
①#
sel = driver.find_element(By.CSS_SELECTOR,"div#div02 div#div02_01 div select")
②#
sel = driver.find_element(By.CSS_SELECTOR,"div#div02 > div#div02_01 > div > select")
③#
sel = driver.find_element(By.CSS_SELECTOR,"#div02 div div select")
④#div:nth-child(1)意思为div标签下还有一个子div，相当于#div02 div(父) div(子) select
sel = driver.find_element(By.CSS_SELECTOR,"#div02 div:nth-child(1) select")
⑤#*[name=sel02]或[name=sel02]或select[name=sel02]
sel = driver.find_element(By.CSS_SELECTOR,"*[name=sel02]")
⑥#
sel = driver.find_element(By.XPATH,"//div[@id='div02']/div/div/select")
⑦#
sel = driver.find_element(By.XPATH,"//*[@id='div02']/div/div/select")
⑧#引号一定加上，@id='div02' and @class='select_cls02'
sel = driver.find_element(By.XPATH,"//div[@id='div02' and @class='select_cls02']/div/div/select")

#下拉框选择值
Select(sel).select_by_value('hh')

6、js选择复选框或取消、全选

html代码：

参考：《html复选框的全选和全不选》

View Code

Python代码：

driver = webdriver.Chrome()
driver.maximize_window()
driver.get("file:///Users/xxx/Desktop/JavaScript/checkbox.html")

#通过执行js,选中复选框
driver.execute_script('var chk =document.getElementById("checkAll"); chk.checked="checked"')
print (driver.find_element_by_id("checkAll").is_selected())
sleep(3)
#通过执行js,取消选中复选框
driver.execute_script('var chk =document.getElementById("checkAll"); chk.checked=""')
print (driver.find_element_by_id("checkAll").is_selected())
sleep(3)
#通过执行js,全选所有复选框,执行的js可以定义函数，通过调用函数全选
driver.execute_script('var checkboxs=document.getElementsByTagName("input");\
for (var i=0;i<checkboxs.length;i++) \
{    var e=checkboxs[i];\
if(e.type=="checkbox")\
{e.checked="checked"; \
} \
};')
sleep(3)

复选框定位还可以参考：《Selenium2+python自动化65-js定位几种方法总结【转载】》

# 勾选记住密码
js4 = 'document.getElementsByName("remember_me")[0].click();'
driver.execute_script(js4)

7、针对display='none'，但是标签中没有id属性

代码如下：

js = "document.querySelector('#xtgl > div > span').style.display='block';"
driver.execute_script(js)
text = driver.find_element(By.CSS_SELECTOR,"#xtgl > div > span").text

网络毒刘

关注

4
点赞
踩
25

收藏

觉得还不错? 一键收藏
打赏
0
评论
【Python + Selenium】之JS定位总结

1、滚动条driver.set_window_size(500,500)js = "window.scrollTo(0,200)" #左：距左边横滚、右：距上边竖滚driver.execute_script(js)2、获取元素的值button = driver.find_element_by_css_selector("#su") #定位按钮input = driver....
复制链接

扫一扫