本小节我们简单说下如何使用selenium4-获取页面元素相关信息，以及获取页面元素的相关信息后可以做什么。

获取页面元素的主要目的：（1）执行完步骤后进行断言；（2）获取前一步骤的响应结果作为后续步骤的输入或判断条件（关联）

1、获取元素的基本信息：元素的大小、文本内容、标签名

service = Service(r"C:\Users\USER\AppData\Local\Programs\Python\Python37\chromedriver.exe")

driver = webdriver.Chrome(service=service)

driver.get("http://www.baidu.com")

ele = driver.find_element(By.LINK_TEXT, '新闻')

print(ele.tag_name)  # 输出标签名

print(ele.text)  # 输出文本，适用于链接元素

print(ele.size)  # 输出大小

driver.quit()

运行结果：
a
新闻
{'height': 23, 'width': 26}

2、获取元素的属性信息，如id,name,class name,value等

service = Service(r"C:\Users\USER\AppData\Local\Programs\Python\Python37\chromedriver.exe")

driver = webdriver.Chrome(service=service)

driver.get("http://www.baidu.com")

ele = driver.find_element(By.ID, 'kw')  # 定位到百度搜索框

ele1 = driver.find_element(By.ID, 'su')  # 定位到百度搜索按钮

print('------以下是百度搜索框的基本属性信息-------')

print(ele.get_attribute('id'))

print(ele.get_attribute('name'))

print(ele.get_attribute('class name'))

print(ele.get_attribute('value'))

print('------以下是百度搜索按钮的基本属性信息-------')

print(ele1.get_attribute('id'))

print(ele1.get_attribute('name'))

print(ele1.get_attribute('class name'))

print(ele1.get_attribute('value'))  # 输出按钮的文字，也就是value属性值

driver.quit()

运行结果：
kw
wd
None

------以下是百度搜索按钮的基本属性信息-------
  su

None
  百度一下

区别总结：获取链接元素的文本使用ele.text , 获取按钮元素上的文本，使用ele.get_attribute('value')



3、获取CSS属性值：高、宽、字体等


service = Service(r"C:\Users\USER\AppData\Local\Programs\Python\Python37\chromedriver.exe")

driver = webdriver.Chrome(service=service)

driver.get("http://www.baidu.com")

ele = driver.find_element(By.LINK_TEXT, '新闻')

sleep(2)

# 输出元素的宽、高、字体

print(ele.value_of_css_property('height'))

print(ele.value_of_css_property('width'))

print(ele.value_of_css_property('font-family'))

driver.quit()
运行结果：
23px
26px
Arial, sans-serif

　

4、判断页面元素是否可见

通过is_displayed()方法判断页面元素是否可见，可见，返回True;不可见，返回False
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>判断元素是否可见</title>

    <script type="text/javascript">

        function showAndHidden1() {

            var div1 = document.getElementById("div1");

            var div2 = document.getElementById("div2");

            if (div1.style.display == 'block') div1.style.display = 'none';

            else div1.style.display = 'block';

            if (div2.style.display == 'block') div2.style.display = 'none';

            else div2.style.display = 'block';

        }

        function showAndHidden2() {

            var div3 = document.getElementById("div3");

            var div4 = document.getElementById("div4");

            if (div3.style.visibility == 'visible') div3.style.visibility = 'hidden';

            else div3.style.visibility = 'visible';

            if (div4.style.visibility == 'visible') div4.style.visibility = 'hidden';

            else div4.style.visibility = 'visible';

        }

    </script>

</head>

<body>

    <div>display:元素不占用页面位置</div>

    <div id="div1" style="display:block">DIV 1</div>

    <div id="div2" style="display:none">DIV 2</div>

    <input id="button1" type="button" onclick="showAndHidden1();" value="DIV 切换"/>

    <hr>

    <div>display:元素占用页面位置</div>

    <div id="div3" style="visibility:visible">DIV 3</div>

    <div id="div4" style="visibility:hidden">DIV 4</div>

    <input id="button2" type="button" onclick="showAndHidden2();" value="DIV 切换"/>

</body>

</html>
service = Service(r"C:\Users\USER\AppData\Local\Programs\Python\Python37\chromedriver.exe")

driver = webdriver.Chrome(service=service)

html_file = os.getcwd() + os.sep + 'myhtml5_13.html'

driver.get(html_file)

ele1 = driver.find_element(By.ID, 'div1')

ele2 = driver.find_element(By.ID, 'div2')

ele3 = driver.find_element(By.ID, 'div3')

ele4 = driver.find_element(By.ID, 'div4')

# style="display:none" and style="visibility:hidden",页面元素不可见

print('ele1 is display:{}'.format(ele1.is_displayed()))

print('ele2 is display:{}'.format(ele2.is_displayed()))

print('ele3 is display:{}'.format(ele3.is_displayed()))

print('ele4 is display:{}'.format(ele4.is_displayed()))

driver.find_element(By.ID, 'button1').click()

driver.find_element(By.ID, 'button2').click()

print('------点击切换按钮后，再次查看页面元素是否可见-------')

print('ele1 is display:{}'.format(ele1.is_displayed()))

print('ele2 is display:{}'.format(ele2.is_displayed()))

print('ele3 is display:{}'.format(ele3.is_displayed()))

print('ele4 is display:{}'.format(ele4.is_displayed()))

driver.quit()
运行结果：

ele1 is display:True
ele2 is display:False
ele3 is display:True
ele4 is display:False
------点击切换按钮后，再次查看页面元素是否可见-------
ele1 is display:False
ele2 is display:True
ele3 is display:False
ele4 is display:True





5、判断页面元素是否可用


通过is_enable()方法判断页面元素是否可用，可用，返回True；不可用，返回False。如果页面元素有disabled属性的话，则不可用。
<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>判断页面元素是否可操作</title>

</head>

<body>

    <input id="input1" type="text" size="40" value="可操作">

    <input id="input2" type="text" size="40" value="不可用" disabled>

    <input id="input3" type="text" size="40" value="只读" readonly>

</body>

</html>
 
service = Service(r"C:\Users\USER\AppData\Local\Programs\Python\Python37\chromedriver.exe")

driver = webdriver.Chrome(service=service)

html_file = os.getcwd() + os.sep + 'myhtml5_14.html'

driver.get(html_file)

ele1 = driver.find_element(By.ID, 'input1')

ele2 = driver.find_element(By.ID, 'input2')

ele3 = driver.find_element(By.ID, 'input3')

print('ele1 is enabled:{}'.format(ele1.is_enabled()))

print('ele2 is enabled:{}'.format(ele2.is_enabled()))

print('ele3 is enabled:{}'.format(ele3.is_enabled()))

driver.quit()
运行结果：

ele1 is enabled:True
ele2 is enabled:False
ele3 is enabled:True

 注意：当某个元素被其他元素遮挡时，也会出现元素无法操作的情况。



6、判断页面元素的选中状态


通过is_selected()方法判断页面元素是否被选中，被选中，返回True；未被选中，返回False。
service = Service(r"C:\Users\USER\AppData\Local\Programs\Python\Python37\chromedriver.exe")

driver = webdriver.Chrome(service=service)

driver.get('http://sahitest.com/demo/clicks.htm')

sleep(2)

ele = driver.find_element(By.XPATH, "/html/body/ul/li/a/label/input")

print(ele.is_selected())

print('----鼠标点击选中后再判断元素是否被选中-----')

ActionChains(driver).click(ele).perform()

print(ele.is_selected())

driver.quit()
运行结果：

False
----鼠标点击选中后再判断元素是否被选中-----
True

注意：如果选中或者取消选中单选按钮或复选框，页面有加载时间的话，要合理使用等待时间，然后判断选中状态，避免判断错误。

selenium4-获取页面元素相关信息的更多相关文章

  1. 示例 - 10行代码在C#中获取页面元素布局信息

    最近研究一个如何在网页定位验证码并截图的问题时, 用SS写了一段C#小脚本可以轻松获取页面任意元素的布局信息 (top, left, width, height). 10行功能代码, 觉得有点用, 现 ...

  2. Js之Dom学习-三种获取页面元素的方式、事件、innerText和innerHTML的异同

    一.三种获取页面元素的方式: getElementById:通过id来获取 <body> <input type="text" value="请输入一个 ...

  3. js获取页面元素距离浏览器工作区顶端的距离

    先介绍几个属性:(暂时只测了IE和firefox,实际上我工作中用到的最多的是chrome)  网页被卷起来的高度/宽度(即浏览器滚动条滚动后隐藏的页面内容高度) (javascript)       ...

  4. getBoundingClientRect()来获取页面元素的位置”

    getBoundingClientRect()来获取页面元素的位置” 获取的是一个对象; 延伸阅读; https://mp.weixin.qq.com/s?__biz=MzAxODE2MjM1MA== ...

  5. webAPI(DOM) 2.1 获取页面元素 | 事件1 | 属性操作 | 节点 | 创建元素 | 事件2

    js分三个部分: ECMAScript标准:js的基本语法 DOM:Ducument Object Model--->文档对象模型--->操作页面的元素 BOM:Browser Objec ...

  6. DOM——获取页面元素

    获取页面元素 为什么要获取页面元素 例如:我们想要操作页面上的某部分(显示/隐藏,动画),需要先获取到该部分对应的元素,才进行后续操作 根据id获取元素 var div = document.getE ...

  7. 获取Java系统相关信息

    package com.test; import java.util.Properties; import java.util.Map.Entry; import org.junit.Test; pu ...

  8. getBoundingClientRect() 来获取页面元素的位置

    getBoundingClientRect() 来获取页面元素的位置   document.documentElement.getBoundingClientRect 下面这是MSDN的解释: Syn ...

  9. JavaScript DOM编程基础精华01（DOM入门，DOM模型和获取页面元素,事件，window对象的方法）

    DOM入门 DOM就是Html页面的模型,将每个标签都做为一个对象,JavaScript通过调用DOM中的属性.方法就可以对网页中的文本框.层等元素进行编程控制.比如通过操作文本框的DOM对象,就可以 ...

  10. .Net中获取打印机的相关信息

    原文:.Net中获取打印机的相关信息 新项目中牵涉到对打印机的一些操作,最重要的莫过于获取打印机的状态,IP等信息,代码量不大,但是也是自己花了一点时间总结出来的,希望能帮助需要的朋友. Printe ...

随机推荐

  1. 企业信息化-3.6 IT资源管理2-系统及应用

    笔者从业的主要是App Dev&Ops,对操作系统有些了解,对应用软件了解的更多.以下是总结了以前跟Host&Server Service.Cloud Service.IT Solut ...

  2. Rancher 系列文章-RHEL7.8 离线有代理条件下安装单节点 Rancher

    一 基础信息 1.1 前提 本次安装的为 20220129 最新版:Rancher v2.6.3 VM 版本为 RHEL 7.8, 7.9 或 8.2, 8.3, 8.4(Rancher 官网要求) ...

  3. [Git/SVN] Gitee使用教程

    1 Gitee Gitee 提供免费的 Git 仓库,还集成了代码质量检测.项目演示等功能. 对于团队协作开发,Gitee 还提供了项目管理.代码托管.文档管理的服务,5 人以下小团队免费. CASE ...

  4. 【LeetCode回溯算法#extra01】集合划分问题【火柴拼正方形、划分k个相等子集、公平发饼干】

    火柴拼正方形 https://leetcode.cn/problems/matchsticks-to-square/ 你将得到一个整数数组 matchsticks ,其中 matchsticks[i] ...

  5. TiDB Lightning导入超大型txt文件实践

    背景 TiDB 提供了很多种数据迁移的方式,但这些工具/方案普遍对MySQL比较友好,一旦涉及到异构数据迁移,就不得不另寻出路,借助各种开源或商业的数据同步工具.其实数据在不同系统的流转当中,有一种格 ...

  6. 人工智能AI图像风格迁移(StyleTransfer),基于双层ControlNet(Python3.10)

    图像风格迁移(Style Transfer)是一种计算机视觉技术,旨在将一幅图像的风格应用到另一幅图像上,从而生成一幅新图像,该新图像结合了两幅原始图像的特点,目的是达到一种风格化叠加的效果,本次我们 ...

  7. 基于kubeasz部署高可用k8s集群

    在部署高可用k8s之前,我们先来说一说单master架构和多master架构,以及多master架构中各组件工作逻辑 k8s单master架构 提示:这种单master节点的架构,通常只用于测试环境, ...

  8. C# 组合键判断

    e.KeyboardDevice.Modifiers 同时按下了Ctrl + H键(H要最后按,因为判断了此次事件的e.Key)修饰键只能按下Ctrl,如果还同时按下了其他修饰键,则不会进入 1 pr ...

  9. [C++基础入门] 5、 数组

    文章目录 5 数组 5.1 概述 5.2 一维数组 5.2.1 一维数组定义方式 5.2.2 一维数组数组名 5.2.3 冒泡排序 5.3 二维数组 5.3.1 二维数组定义方式 5.3.2 二维数组 ...

  10. Prism Sample 9 ChangeConvention

    上个例子跳过了ViewModelLocator,因是采用约定的方式最为方便. 如果有人要修改约定,自定义view和viewModel的默认自动定位方式,怎么办呢? 在app.xaml.cs重写以下方法 ...