定位一組對象-checkbox 、radiobutton

時間  2019-11-24
標籤 定位 一組 對象 checkbox radiobutton 欄目 系統網絡 简体版
原文   原文鏈接

webdriver 能夠很方便的使用find_element 方法來定位某個特定的對象，不過有時候咱們卻須要定位一組對象，WebElement 接口一樣提供了定位一組元素的方法find_elements。javascript

定位一組對象通常用於如下場景：css

  •  批量操做對象，好比將頁面上全部的checkbox 都勾上。
  •  先獲取一組對象，再在這組對象中過濾出須要具體定位的一些對象。好比定位出頁面上全部的checkbox，而後選擇最後一個。

checkbox.html   html代碼示例：html

<html>java


<head>
<meta http-equiv="content-type" content="text/html;charset=utf-8" />
<title>Checkbox</title>
<script type="text/javascript" async="" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css"rel="stylesheet" />
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
</head>python


    <body>
        <h3>checkbox</h3>
        <div class="well">
            <form class="form-horizontal">jquery


                 <div class="control-group">
                       <label class="control-label" for="c1">checkbox1</label>
                       <div class="controls">
                               <input type="checkbox" id="c1" />
                       </div>
                 </div>web


                 <div class="control-group">
                       <label class="control-label" for="c2">checkbox2</label>
                       <div class="controls">
                               <input type="checkbox" id="c2" />
                       </div>
                 </div>ajax


                 <div class="control-group">
                       <label class="control-label" for="c3">checkbox3</label>
                       <div class="controls">
                               <input type="checkbox" id="c3" />
                       </div>
                 </div>
          </form>
       </div>
    </body>
</html>bootstrap

 

補充後的HTML代碼api

<html>
    <head>
        <meta http-equiv="content-type" content="text/html;charset=utf-8" />
        <title>Checkbox</title>
        <script type="text/javascript" async="" src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
        <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet" />
        <script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
    </head>
    <body>
        <h3>checkbox</h3>
        <div class="well">
            <form class="form-horizontal">
                <div class="control-group">
                    <label class="control-label" for="c1">checkbox1</label>
                    <div class="controls">
                        <input type="checkbox" id="c1" />
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="c2">checkbox2</label>
                    <div class="controls">
                        <input type="checkbox" id="c2" />
                    </div>
                </div>
                <div class="control-group">
                    <label class="control-label" for="c3">checkbox3</label>
                    <div class="controls">
                        <input type="checkbox" id="c3" />
                    </div>
                </div>    
        
                <div class="control-group">
                    <label class="control-label" for="r">radio</label>
                    <div class="controls">
                        <input type="radio" id="r1" />
                    </div>
                </div>
                
                <div class="control-group">
                    <label class="control-label" for="r">radio</label>
                    <div class="controls">
                        <input type="radio" id="r2" />
                    </div>
                </div>
            </form>
        </div>
    </body>
</html>

將這段代碼保存複製到記事本中，將保存成checkbox.html 文件。（注意，這個頁面須要和咱們的自動化腳本放在同一個目錄下，不然下面的腳本將checkbox.html 的所在目錄）
經過瀏覽器打開checkbox.html，將看到如下頁面：

                                     圖3.5

若是3.5所示：

能夠看到頁面提供了三個複選框和兩個單選按鈕。下面經過腳原本單擊勾選三個複選框。

代碼示例：

# -*- coding: utf-8 -*-
from selenium import webdriver
import os

driver = webdriver.Firefox()
file_path = 'file:///' + os.path.abspath('checkbox.html')
driver.get(file_path)

# 選擇頁面上全部的tag name 爲input 的元素
inputs = driver.find_elements_by_tag_name('input')

#而後從中過濾出tpye 爲checkbox 的元素，單擊勾選

for input in inputs:
if input.get_attribute('type') == 'checkbox':
input.click()

driver.quit()

 

你能夠試着把input.get_attribute('type') == 'checkbox' 中的checkbox 變成radio ，那這個腳本定位的會是兩個單選框

說明：

import os
os.path.abspath()

os 模塊爲python 語言標準庫中的os 模塊包含廣泛的操做系統功能。主要用於操做本地目錄文件。
path.abspath()方法用於獲取當前路徑下的文件。另外腳本中還使用到for 循環，對inputs 獲取的一組元素進行循環，在python 語言中循環變量（input）能夠不用事先聲明直接使用。

find_elements_by_xx(‘xx’)
find_elements 用於獲取一組元素。

 

下面經過css 方式來勾選一組元素，打印當所勾選元素的個數並對最後一個勾選的元素取消勾選。

 代碼示例：

#coding=utf-8
from selenium import webdriver
import os


driveriver = webdriver.Firefox()
file_path = 'file:///' + os.path.abspath('checkbox.html')
driver.get(file_path)


# 選擇全部的type 爲checkbox 的元素並單擊勾選
checkboxes = driver.find_elements_by_css_selector('input[type=checkbox]')


for checkbox in checkboxes:
checkbox.click()

# 打印當前頁面上type 爲checkbox 的個數
print len(driver.find_elements_by_css_selector('input[type=checkbox]'))

# 把頁面上最後1個checkbox 的勾給去掉
driver.find_elements_by_css_selector('input[type=checkbox]').pop().click()

driver.quit()

 

說明：

len()
len 爲python 語言中的方法，用於返回一個對象的長度（或個數）。

pop()
pop 也爲python 語言中提供的方法，用於刪除指定們位置的元素，pop()爲空默認選擇最一個元素。

 

 

嘗試：

 

把find_elements_by_css_selector('input[type=checkbox]').pop().click() 中的checkbox 變成radio 會是什麼效果，本身嘗試一下吧！

 

 

知識擴充：

參考博客地址：http://www.cnblogs.com/yoyoketang/p/6128675.html

相關文章
相關標籤/搜索
每日一句
    每一个你不满意的现在，都有一个你没有努力的曾经。
本站公眾號
   歡迎關注本站公眾號,獲取更多信息
聯繫我們 最近搜索 最新文章 沪ICP备13005482号-10 MyBatis教程 SQL 教程 MySQL教程 Java 教程 Thymeleaf 教程 Hibernate教程 Spring教程 Redis教程