如何使用Python模拟网页上的按钮单击
我正试图抓取一个等待用户点击按钮的网站。我找不到使selenium执行单击的正确按钮。这是点击前的网页。它是一个简单的网页，所以不长。我在正文中看到了以下HTML：如何使用Python模拟网页上的按钮单击,python,selenium,xpath,css-selectors,webdriverwait,Python,Selenium,Xpath,Css Selectors,Webdriverwait,我正试图抓取一个等待用户点击按钮的网站。我找不到使selenium执行单击的正确按钮。这是点击前的网页。它是一个简单的网页，所以不长。我在正文中看到了以下HTML： <div id="startStopBtn" onclick="startStop()" class=""></div> 但我想不出如何启动它。任何帮助都将不胜感激 <html><head> <meta charse
<div id="startStopBtn" onclick="startStop()" class=""></div>
<html><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no">
<title>ITC Speedtest</title>
<style type="text/css">
html,body{
border:none; padding:0; margin:0;
background:#fff;
color:#1e73be;
}
body{
text-align:center;
font-family:"Roboto",sans-serif;
}
h1{
color:#1e73be;
}
#startStopBtn{
display:inline-block;
margin:0 auto;
color:#6060AA;
background-color:rgba(0,0,0,0);
border:0.15em solid #6060FF;
border-radius:0.3em;
transition:all 0.3s;
box-sizing:border-box;
width:8em; height:3em;
line-height:2.7em;
cursor:pointer;
box-shadow: 0 0 0 rgba(0,0,0,0.1), inset 0 0 0 rgba(0,0,0,0.1);
}
#startStopBtn:hover{
box-shadow: 0 0 2em rgba(0,0,0,0.1), inset 0 0 1em rgba(0,0,0,0.1);
}
#startStopBtn.running{
background-color:#FF3030;
border-color:#FF6060;
color:#FFFFFF;
}
#startStopBtn:before{
content:"Start";
}
#startStopBtn.running:before{
content:"Abort";
}
#test{
margin-top:2em;
margin-bottom:12em;
}
div.testArea{
display:inline-block;
width:16em;
height:12.5em;
position:relative;
box-sizing:border-box;
}
div.testName{
position:absolute;
top:0.1em; left:0;
width:100%;
font-size:1.4em;
z-index:9;
}
div.meterText{
position:absolute;
bottom:1.55em; left:0;
width:100%;
font-size:2.5em;
z-index:9;
}
div.meterText:empty:before{
content:"0.00";
}
div.unit{
position:absolute;
bottom:2em; left:0;
width:100%;
z-index:9;
}
div.testArea canvas{
position:absolute;
top:0; left:0; width:100%; height:100%;
z-index:1;
}
div.testGroup{
display:inline-block;
}
@media all and (max-width:65em){
body{
font-size:1.5vw;
}
}
@media all and (max-width:40em){
body{
font-size:0.8em;
}
div.testGroup{
display:block;
margin: 0 auto;
}
}
</style>
<script type="text/javascript">
function I(id){return document.getElementById(id);}
var meterBk="#E0E0E0";
var dlColor="#6060AA",
ulColor="#309030",
pingColor="#AA6060",
jitColor="#AA6060";
var progColor="#EEEEEE";
//CODE FOR GAUGES
function drawMeter(c,amount,bk,fg,progress,prog){
var ctx=c.getContext("2d");
var dp=window.devicePixelRatio||1;
var cw=c.clientWidth*dp, ch=c.clientHeight*dp;
var sizScale=ch*0.0055;
if(c.width==cw&&c.height==ch){
ctx.clearRect(0,0,cw,ch);
}else{
c.width=cw;
c.height=ch;
}
ctx.beginPath();
ctx.strokeStyle=bk;
ctx.lineWidth=16*sizScale;
ctx.arc(c.width/2,c.height-58*sizScale,c.height/1.8-ctx.lineWidth,-Math.PI*1.1,Math.PI*0.1);
ctx.stroke();
ctx.beginPath();
ctx.strokeStyle=fg;
ctx.lineWidth=16*sizScale;
ctx.arc(c.width/2,c.height-58*sizScale,c.height/1.8-ctx.lineWidth,-Math.PI*1.1,amount*Math.PI*1.2-Math.PI*1.1);
ctx.stroke();
if(typeof progress !== "undefined"){
ctx.fillStyle=prog;
ctx.fillRect(c.width*0.3,c.height-16*sizScale,c.width*0.4*progress,4*sizScale);
}
}
function mbpsToAmount(s){
return 1-(1/(Math.pow(1.3,Math.sqrt(s))));
}
function msToAmount(s){
return 1-(1/(Math.pow(1.08,Math.sqrt(s))));
}
//SPEEDTEST AND UI CODE
var w=null; //speedtest worker
var data=null; //data from worker
function startStop(){
if(w!=null){
//speedtest is running, abort
w.postMessage('abort');
w=null;
data=null;
I("startStopBtn").className="";
initUI();
}else{
//test is not running, begin
w=new Worker('speedtest_worker.min.js');
w.postMessage('start'); //Add optional parameters as a JSON object to this command
I("startStopBtn").className="running";
w.onmessage=function(e){
data=e.data.split(';');
var status=Number(data[0]);
if(status>=4){
//test completed
I("startStopBtn").className="";
w=null;
updateUI(true);
}
};
}
}
//this function reads the data sent back by the worker and updates the UI
function updateUI(forced){
if(!forced&&(!data||!w)) return;
var status=Number(data[0]);
// I("ip").textContent=data[4];
I("dlText").textContent=(status==1&&data[1]==0)?"...":data[1];
drawMeter(I("dlMeter"),mbpsToAmount(Number(data[1]*(status==1?oscillate():1))),meterBk,dlColor,Number(data[6]),progColor);
I("ulText").textContent=(status==3&&data[2]==0)?"...":data[2];
drawMeter(I("ulMeter"),mbpsToAmount(Number(data[2]*(status==3?oscillate():1))),meterBk,ulColor,Number(data[7]),progColor);
I("pingText").textContent=data[3];
drawMeter(I("pingMeter"),msToAmount(Number(data[3]*(status==2?oscillate():1))),meterBk,pingColor,Number(data[8]),progColor);
}
function oscillate(){
return 1+0.02*Math.sin(Date.now()/100);
}
//poll the status from the worker (this will call updateUI)
setInterval(function(){
if(w) w.postMessage('status');
},200);
//update the UI every frame
window.requestAnimationFrame=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.msRequestAnimationFrame||(function(callback,element){setTimeout(callback,1000/60);});
function frame(){
requestAnimationFrame(frame);
updateUI();
}
frame(); //start frame loop
//function to (re)initialize UI
function initUI(){
drawMeter(I("dlMeter"),0,meterBk,dlColor,0);
drawMeter(I("ulMeter"),0,meterBk,ulColor,0);
drawMeter(I("pingMeter"),0,meterBk,pingColor,0);
I("dlText").textContent="";
I("ulText").textContent="";
I("pingText").textContent="";
// I("ip").textContent="";
}
</script>
</head>
<body>
<h1>ITC Speedtest</h1>
<div id="startStopBtn" onclick="startStop()" class=""></div>
<div id="test">
<div class="testGroup">
<div class="testArea">
<div class="testName">Download</div>
<canvas id="dlMeter" class="meter" width="223" height="174"></canvas>
<div id="dlText" class="meterText">162.74</div>
<div class="unit">Mbps</div>
</div>
<div class="testArea">
<div class="testName">Upload</div>
<canvas id="ulMeter" class="meter" width="223" height="174"></canvas>
<div id="ulText" class="meterText">9.85</div>
<div class="unit">Mbps</div>
</div>
</div>
<div class="testGroup">
<div class="testArea">
<div class="testName">Ping</div>
<canvas id="pingMeter" class="meter" width="223" height="174"></canvas>
<div id="pingText" class="meterText">23.83</div>
<div class="unit">ms</div>
</div>
</div>
<div id="ipArea">
IP Address: <span id="ip">100.103.124.12</span>
</div>
</div>
<script type="text/javascript">setTimeout(initUI,100);</script>
</body></html>
ITC速度测试
html，正文{
边框：无；填充：0；边距：0；
背景：#fff；
颜色：#1e73be；
}
身体{
文本对齐：居中；
字体系列：“Roboto”，无衬线；
}
h1{
颜色：#1e73be；
}
#startStopBtn{
显示：内联块；
保证金：0自动；
颜色：#6060AA；
背景色：rgba（0,0,0,0）；
边框：0.15em实心#6060FF；
边界半径：0.3em；
过渡：均为0.3秒；
框大小：边框框；
宽度：8em；高度：3em；
线高：2.7em；
光标：指针；
长方体阴影：0.0 rgba（0,0,0,0.1），插入0.0 rgba（0,0,0,0.1）；
}
#startStopBtn：悬停{
方框阴影：0.02米rgba（0,0,0,0.1），插入0.01米rgba（0,0,0,0.1）；
}
#startStopBtn.running{
背景色：#FF3030；
边框颜色：#FF6060；
颜色：#FFFFFF；
}
#startStopBtn:之前{
内容：“开始”；
}
#startStopBtn.正在运行：之前{
内容：“中止”；
}
#试验{
边缘顶部：2米；
边缘底部：12em；
}
特斯特雷亚分区{
显示：内联块；
宽度：16em；
身高：12.5公分；
位置：相对位置；
框大小：边框框；
}
div.testName{
位置：绝对位置；
顶部：0.1米；左侧：0；
宽度：100%；
字号：1.4em；
z指数：9；
}
米特文本分区{
位置：绝对位置；
底部：1.55em；左侧：0；
宽度：100%；
字号：2.5em；
z指数：9；
}
div.meterText:空：之前{
内容：“0.00”；
}
分区单位{
位置：绝对位置；
底部：2米；左侧：0米；
宽度：100%；
z指数：9；
}
测试区帆布分区{
位置：绝对位置；
顶部：0；左侧：0；宽度：100%；高度：100%；
z指数：1；
}
div.testGroup{
显示：内联块；
}
@全部和全部介质（最大宽度：65em）{
身体{
字体大小：1.5vw；
}
}
@全部和全部介质（最大宽度：40em）{
身体{
字号：0.8em；
}
div.testGroup{
显示：块；
保证金：0自动；
}
}
函数I（id）{return document.getElementById（id）；}
var meterBk=“#e0”；
var dlColor=“#6060AA”，
ulColor=“#309030”，
pingColor=“#AA6060”，
jitColor=“#AA6060”；
var progColor=“#EEEEEE”；
//量规代码
功能提取仪（c、金额、bk、fg、进度、进度）{
var ctx=c.getContext（“2d”）；
var dp=窗口设备比例| | 1；
var cw=c.clientWidth*dp，ch=c.clientHeight*dp；
var sizScale=ch*0.0055；
如果（c.width==cw和c.height==ch）{
ctx.clearRect（0,0，cw，ch）；
}否则{
c、 宽度=cw；
c、 高度=ch；
}
ctx.beginPath（）；
ctx.strokeStyle=bk；
ctx.线宽=16*SizeScale；
ctx.弧（c.宽度/2，c.高度-58*sizScale，c.高度/1.8-ctx.线宽，-数学PI*1.1，数学PI*0.1）；
ctx.stroke（）；
ctx.beginPath（）；
ctx.strokeStyle=fg；
ctx.线宽=16*SizeScale；
ctx.弧（c.宽度/2，c.高度-58*sizScale，c.高度/1.8-ctx.线宽，-数学PI*1.1，数量*Math.PI*1.2-Math.PI*1.1）；
ctx.stroke（）；
如果（进度类型！=“未定义”）{
ctx.fillStyle=prog；
ctx.fillRect（c.宽度*0.3，c.高度-16*尺寸刻度，c.宽度*0.4*进度，4*尺寸刻度）；
}
}
功能mbpsToAmount（个）{
返回1-（1/（数学功率（1.3，数学sqrt））；
}
功能msToAmount（s）{
返回1-（1/（数学功率（1.08，数学sqrt））；
}
//SPEEDTEST和UI代码
var w=null//试飞员
var数据=null//来自工人的数据
函数startStop（）{
如果（w！=null）{
//speedtest正在运行，中止
w、 后消息（“中止”）；
w=零；
数据=空；
I（“startStopBtn”）.className=“”；
initUI（）；
}否则{
//测试未运行，请开始
w=新员工（'speedtest_-Worker.min.js'）；
w、 postMessage（'start'）；//将可选参数作为JSON对象添加到此命令
I（“startStopBtn”）.className=“正在运行”；
w、 onmessage=函数（e）{
data=e.data.split（“；”）；
var状态=数量（数据[0]）；
如果（状态>=4）{
//测试完成
I（“startStopBtn”）.className=“”；
w=零；
更新（真）；
}
};
}
}
//此函数读取工作人员发送回的数据并更新UI
函数updateUI（强制）{
如果（！forced&&（！data | |！w））返回；
var状态=数量（数据[0]）；
//I（“ip”）.textContent=数据[4]；
I（“dlText”）.textContent=（状态==1和数据[1]==0）？“…”：数据[1]；
拉力计（I（“dlMeter”）、mbpsToAmount（数字（数据[1]*（状态==1？振荡（）：1））、meterBk、dlColor、数字（数据[6]）、PROGCLOR；
I（“ulText”）.textContent=（状态==3和数据[2]==0）？“…”：数据[2]；
拉力计（I（“ulMeter”）、mbpsToAmount（数字（数据[2]*（状态==3？振荡（）：1））、meterBk、ulColor、数字（数据[7]）、PROGCLOR；
I（“pingText”）.textContent=数据[3]；
拉力计（I（“pingMeter”）、msToAmount（数字（数据[3]*（状态==2？振荡（）：1））、meterBk、pingColor、数字（数据[8]）、progColor；
}
函数振荡（）{
返回1+0.02*Math.sin（Date.now（）/100）；
}
//轮询工作进程的状态（这将调用updateUI）
setInterval（函数（）{
如果（w）w.postMessage（“状态”）；
},200);
//每帧更新一次UI
window.requestAnimationFrame=window.requestAnimationFrame | | window.webkitRequestAnimationFrame | | | window.mozRequestAnimationFrame | | window.msRequestAnimationFrame | | |（回调函数，元素）{setTimeout（回调，1000/60）；}）；
函数框架（）{
请求动画帧（帧）；
updateUI（）；
}
框架（）//开始帧循环
//用于（重新）初始化的函数
<html><head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no, user-scalable=no">
<title>ITC Speedtest</title>
<style type="text/css">
html,body{
border:none; padding:0; margin:0;
background:#fff;
color:#1e73be;
}
body{
text-align:center;
font-family:"Roboto",sans-serif;
}
h1{
color:#1e73be;
}
#startStopBtn{
display:inline-block;
margin:0 auto;
color:#6060AA;
background-color:rgba(0,0,0,0);
border:0.15em solid #6060FF;
border-radius:0.3em;
transition:all 0.3s;
box-sizing:border-box;
width:8em; height:3em;
line-height:2.7em;
cursor:pointer;
box-shadow: 0 0 0 rgba(0,0,0,0.1), inset 0 0 0 rgba(0,0,0,0.1);
}
#startStopBtn:hover{
box-shadow: 0 0 2em rgba(0,0,0,0.1), inset 0 0 1em rgba(0,0,0,0.1);
}
#startStopBtn.running{
background-color:#FF3030;
border-color:#FF6060;
color:#FFFFFF;
}
#startStopBtn:before{
content:"Start";
}
#startStopBtn.running:before{
content:"Abort";
}
#test{
margin-top:2em;
margin-bottom:12em;
}
div.testArea{
display:inline-block;
width:16em;
height:12.5em;
position:relative;
box-sizing:border-box;
}
div.testName{
position:absolute;
top:0.1em; left:0;
width:100%;
font-size:1.4em;
z-index:9;
}
div.meterText{
position:absolute;
bottom:1.55em; left:0;
width:100%;
font-size:2.5em;
z-index:9;
}
div.meterText:empty:before{
content:"0.00";
}
div.unit{
position:absolute;
bottom:2em; left:0;
width:100%;
z-index:9;
}
div.testArea canvas{
position:absolute;
top:0; left:0; width:100%; height:100%;
z-index:1;
}
div.testGroup{
display:inline-block;
}
@media all and (max-width:65em){
body{
font-size:1.5vw;
}
}
@media all and (max-width:40em){
body{
font-size:0.8em;
}
div.testGroup{
display:block;
margin: 0 auto;
}
}
</style>
<script type="text/javascript">
function I(id){return document.getElementById(id);}
var meterBk="#E0E0E0";
var dlColor="#6060AA",
ulColor="#309030",
pingColor="#AA6060",
jitColor="#AA6060";
var progColor="#EEEEEE";
//CODE FOR GAUGES
function drawMeter(c,amount,bk,fg,progress,prog){
var ctx=c.getContext("2d");
var dp=window.devicePixelRatio||1;
var cw=c.clientWidth*dp, ch=c.clientHeight*dp;
var sizScale=ch*0.0055;
if(c.width==cw&&c.height==ch){
ctx.clearRect(0,0,cw,ch);
}else{
c.width=cw;
c.height=ch;
}
ctx.beginPath();
ctx.strokeStyle=bk;
ctx.lineWidth=16*sizScale;
ctx.arc(c.width/2,c.height-58*sizScale,c.height/1.8-ctx.lineWidth,-Math.PI*1.1,Math.PI*0.1);
ctx.stroke();
ctx.beginPath();
ctx.strokeStyle=fg;
ctx.lineWidth=16*sizScale;
ctx.arc(c.width/2,c.height-58*sizScale,c.height/1.8-ctx.lineWidth,-Math.PI*1.1,amount*Math.PI*1.2-Math.PI*1.1);
ctx.stroke();
if(typeof progress !== "undefined"){
ctx.fillStyle=prog;
ctx.fillRect(c.width*0.3,c.height-16*sizScale,c.width*0.4*progress,4*sizScale);
}
}
function mbpsToAmount(s){
return 1-(1/(Math.pow(1.3,Math.sqrt(s))));
}
function msToAmount(s){
return 1-(1/(Math.pow(1.08,Math.sqrt(s))));
}
//SPEEDTEST AND UI CODE
var w=null; //speedtest worker
var data=null; //data from worker
function startStop(){
if(w!=null){
//speedtest is running, abort
w.postMessage('abort');
w=null;
data=null;
I("startStopBtn").className="";
initUI();
}else{
//test is not running, begin
w=new Worker('speedtest_worker.min.js');
w.postMessage('start'); //Add optional parameters as a JSON object to this command
I("startStopBtn").className="running";
w.onmessage=function(e){
data=e.data.split(';');
var status=Number(data[0]);
if(status>=4){
//test completed
I("startStopBtn").className="";
w=null;
updateUI(true);
}
};
}
}
//this function reads the data sent back by the worker and updates the UI
function updateUI(forced){
if(!forced&&(!data||!w)) return;
var status=Number(data[0]);
// I("ip").textContent=data[4];
I("dlText").textContent=(status==1&&data[1]==0)?"...":data[1];
drawMeter(I("dlMeter"),mbpsToAmount(Number(data[1]*(status==1?oscillate():1))),meterBk,dlColor,Number(data[6]),progColor);
I("ulText").textContent=(status==3&&data[2]==0)?"...":data[2];
drawMeter(I("ulMeter"),mbpsToAmount(Number(data[2]*(status==3?oscillate():1))),meterBk,ulColor,Number(data[7]),progColor);
I("pingText").textContent=data[3];
drawMeter(I("pingMeter"),msToAmount(Number(data[3]*(status==2?oscillate():1))),meterBk,pingColor,Number(data[8]),progColor);
}
function oscillate(){
return 1+0.02*Math.sin(Date.now()/100);
}
//poll the status from the worker (this will call updateUI)
setInterval(function(){
if(w) w.postMessage('status');
},200);
//update the UI every frame
window.requestAnimationFrame=window.requestAnimationFrame||window.webkitRequestAnimationFrame||window.mozRequestAnimationFrame||window.msRequestAnimationFrame||(function(callback,element){setTimeout(callback,1000/60);});
function frame(){
requestAnimationFrame(frame);
updateUI();
}
frame(); //start frame loop
//function to (re)initialize UI
function initUI(){
drawMeter(I("dlMeter"),0,meterBk,dlColor,0);
drawMeter(I("ulMeter"),0,meterBk,ulColor,0);
drawMeter(I("pingMeter"),0,meterBk,pingColor,0);
I("dlText").textContent="";
I("ulText").textContent="";
I("pingText").textContent="";
// I("ip").textContent="";
}
</script>
</head>
<body>
<h1>ITC Speedtest</h1>
<div id="startStopBtn" onclick="startStop()" class=""></div>
<div id="test">
<div class="testGroup">
<div class="testArea">
<div class="testName">Download</div>
<canvas id="dlMeter" class="meter" width="223" height="174"></canvas>
<div id="dlText" class="meterText">162.74</div>
<div class="unit">Mbps</div>
</div>
<div class="testArea">
<div class="testName">Upload</div>
<canvas id="ulMeter" class="meter" width="223" height="174"></canvas>
<div id="ulText" class="meterText">9.85</div>
<div class="unit">Mbps</div>
</div>
</div>
<div class="testGroup">
<div class="testArea">
<div class="testName">Ping</div>
<canvas id="pingMeter" class="meter" width="223" height="174"></canvas>
<div id="pingText" class="meterText">23.83</div>
<div class="unit">ms</div>
</div>
</div>
<div id="ipArea">
IP Address: <span id="ip">100.103.124.12</span>
</div>
</div>
<script type="text/javascript">setTimeout(initUI,100);</script>
</body></html>
driver = webdriver.Chrome("/usr/local/bin/chromedriver")
driver.get("URL")
button = driver.find_element_by_xpath("XPATH_BUTTON")
button.click()
driver.find_element(By.CSS_SELECTOR, "div#startStopBtn[onclick^='startStop']").click()
driver.find_element(By.XPATH, "//h1[text()='ITC Speedtest']//following-sibling::div[@id='startStopBtn' and starts-with(@onclick, 'startStop')]").click()
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.CSS_SELECTOR, "div#startStopBtn[onclick^='startStop']"))).click()
WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//h1[text()='ITC Speedtest']//following-sibling::div[@id='startStopBtn' and starts-with(@onclick, 'startStop')]"))).click()
from selenium.webdriver.support.ui import WebDriverWait
from selenium.webdriver.common.by import By
from selenium.webdriver.support import expected_conditions as EC