Selenium(HTML基础)

news2024/9/20 8:46:44

 一、HTML基础 (在学习自动化时,保证能看懂)

1.1.HTML介绍

  • 英文是HyperText Markup Language,译为:超文本标记语言
  • 是Internet上用于设计网页的主要语言,2008年发布了HTML5.0,是目前互联网的标准,并作为互联网核心技术之一
  • 是一种标记语言,用于告诉浏览器以什么方式或结构显示网页内容。通过浏览器可以对HTML文档进行解析,并通过网页形式显示出来
  • HTML文档以.html或.htm格式存储

1.2 测试人员掌握HTML的理由

  • Selenium是针对于web应用程序的自动化测试工具,测试的对象就是网页,所以要求测试人员对网页基本结构有所了解
  • 测试的第一步就是要识别、定位页面的各种元素,如超级链接、文本框、按钮、复选框、图片、下拉列表等等,只有清楚这些元素的表示方法和相关的一些属性,才能更好的完成元素的定位工作

二、 标记

2.1 什么是标记

  • HTML用于描述功能的符号称为“标记",如<html>、<head>、<body>等
  • 标记在使用时必须用尖括号“<>”括起来
  • 有些标记必须成对出现,以开头无斜杠的标记开始 如:<html>以有斜杠的标记结束 如:</html>
  • 标记不区分大小写
  • 标记可以嵌套,即标记可以包含标记

2.2 双标记

  • 语法: <标记>内容<标记>
  •  标记中的“内容”部分就是要被这对标记施加作用的部分

eg:简单网页构成

 2.3 标记属性

什么是标记属性:
大多数标记可以有自己的相关属性,对标记进行说明,如字体大小背景颜色、对齐方式等
语法:<标记 属性1=值1 属性2=值2 属性3=值3..>内容</标记>
说明:

  • 标记属性均放在始标记的<>内,并且和标记之间有一个空格分隔
  • 多个属性之间使用空格分隔,且一般没有先后顺序
  • 一些属性可以由网页编制者赋一定的值,也有一些属性没有值

eg:标记属性案例

三、 头部概述

  • HTML的头部文件使用<head>和</head>
  • 括起来头部文件内容不直接在网页上显示,但起到重要的设置或说明作用
  • 在头部文件<head>和</head>中常见的内嵌标记:

              <title>:设置页面标题
              <meta>:定义元信息(增加被搜索到的概率)

 四、 主体概述

  • HTML的主体文件使用<body>和</body>括起来
  • 主体文件内容直接在网页上显示
  • 在主体文件<body>和</body>中常见的内嵌标记:

           <a>:超级链接
          <img>:图片
          <ul>:无序列表
          <ol>:有序列表
          <table>:表格
          <div>:图层
          <script>:脚本

4.1 超级链接:<a>

  • 基本用法:href=“URL”target=” blank”>链接内容</a>
  • 链接的内容放在前后标记中间
  • href:指定点击链接后要访问页面的URL
  • target:指定访问的页面是在本窗口(或标签)中打开(默认),还是在一个新的窗口(或标签)中打开(target=_blank)
  • 如:

<a href=“http://www.baidu.com" target=_blank>访问百度</a>
<a href= "demo01.html>"链接到demo01.html</a>

扩展:换行符:<br>(单标记)

4.2 图片:<img>(单标记)

  • 基本用法:<img src=“URL” alt=“替代文字”>
  • 属于单标记
  • src:指定图片的存储地址
  • alt:替代文字,图片由于某种原因无法显示时,此区域将显示的文字
  • 图像和超级链接经常一起使用

<a href=“网页URL”><img src=“图像URL”alt=“替代文字"></a>

4.3 列表

列表在网页中将列表项目有序或无序罗列显示,可以对网页文字进行布局
列表主要标签属性:

4.4 表格

表格能将网页分成多个任意的矩形区域,在网页制作中是常用的一种简单的布局工具
表格设计的标签和属性:

 结构表格:将表格划分为表头行、表格主体部分和表格标注

 4.5 图层:<div>

图层是布局常见的一种技术,它能够将层中的内容摆放在浏览器的任意位置

图层常见属性:

eg:

五、 表单

  • 表单(form)是HTML核心元素,是客户端与服务器端进行交互的主要方式,通过javascript、vbscript的脚本语言实现将客户端数据向服务器传递,也可以获取服务器端数据
  • 表单通过文本框、下拉列表、复选框等页面元素收集客户填写的信息,然后通过脚本语言进行处理,向服务器端发送数据

5.1 文本框

  • 文本框/输入框:<input type=text>(input单标记)
  • 文本框常见属性:

eg: 

 

 5.2 按钮

  • 按钮:<input type=submit>
  • 按钮常见属性:

 eg:

5.3 单选按钮 

  • 单选按钮:<input type=radio>
  • 单选按钮常见属性:

eg:

 

5.4 复选框 

  • 复选框:<input type=checkbox>
  • 复选框常见属性:

eg:

5.5  下拉列表

  • 下拉列表:<select>和<option>
  • 下拉列表常见属性:

eg:

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/2083764.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

数据结构之 “单链表“

&#xff08;1&#xff09;在顺表表中&#xff0c;如果是头插/删的时间复杂度是O(1)&#xff1b;尾插/删的时间复杂度是O(N) &#xff08;2&#xff09;增容一般是呈2倍的增长&#xff0c;势必会有一定的空间浪费。比如&#xff1a;申请了50个空间&#xff0c;只用了两个&#…

【Matlab】SSA-BP麻雀搜索算法优化BP神经网络回归预测 可预测未来(附代码)

资源下载&#xff1a; 资源合集&#xff1a; 目录 一&#xff0c;概述 传统的BP神经网络存在一些问题&#xff0c;比如容易陷入局部最优解、训练速度慢等。为了解决这些问题&#xff0c;我们引入了麻雀算法作为优化方法&#xff0c;将其与BP神经网络相结合&#xff0c;提出了…

精准高效,省时省力——2024年翻译工具新趋势

如果你收到一份外文文档&#xff0c;但是你看不懂急需翻译成中文&#xff0c;将文档内容复制粘贴到翻译的的窗口获得中文内容是不是很麻烦。我了解到了deepl翻译文档之后还认识了不少的翻译神器&#xff0c;这次分享给你一起试试吧。 第一款福晰在线翻译 链接直达>>htt…

3D工艺大师:精准助力医疗设备远程维修

医疗设备是现代医疗体系中不可或缺的重要工具&#xff0c;它们帮助医生更准确地诊断病情&#xff0c;更有效地进行治疗。但随着技术的进步&#xff0c;这些设备变得越来越复杂&#xff0c;维修起来也面临诸多挑战。 首先&#xff0c;医疗设备结构复杂&#xff0c;零件众多&…

【Material-UI】Rating组件中的Rating precision属性

文章目录 一、Rating组件概述1. 组件简介2. precision属性的作用 二、Rating precision的基本用法三、Rating precision属性详解1. 精度选择的意义2. 如何在项目中选择合适的精度 四、Rating precision属性的实际应用场景1. 电商平台中的应用2. 电影评分应用3. 专业评测网站 五…

[Tomcat源码解析]——热部署和热加载原理

热部署 在Tomcat中可以通过Host标签设置热部署,当 autoDeploy为true时,在运行中的Tomcat中丢入一个war包,那么Tomcat不需要重启就可以自动加载该war包。 <Host name="localhost" appBase="webapps"unpackWARs="true" autoDeploy="…

Ubuntu18.04 下安装CUDA

安装步骤 1.查看是否安装了cuda # 法1 cat /usr/local/cuda/version.txt # 法2 nvcc --version 2.若没有安装&#xff0c;则查看是否有N卡驱动&#xff0c;若无N卡驱动&#xff0c;则到软件与更新 -> 附加驱动中安装驱动 3.查看N卡驱动支持的cuda版本 nvidia-smi 如下…

RabbitMQ 集群与高可用性

目录 单节点与集群部署 1.1. 单节点部署 1.2. 集群部署 镜像队列 1.定义与工作原理 2. 配置镜像队列 3.应用场景 4. 优缺点 5. Java 示例 分布式部署 1. 分布式部署的主要目标 2. 典型架构设计 3. RabbitMQ 分布式部署的关键技术 4. 部署策略和实践 5. 分布式部署…

图像变换——等距变换、相似变换、仿射变换、投影变换

%%图像变换 % I imread(cameraman.tif); I imread(F:\stitching\imagess\or\baiyun2.jpg); figure; imshow(I); title(原始图像); [w,h]size(I); thetapi/4;%旋转角 t[200,80];%平移tx,ty s0.3;%缩放尺度 %% 等距变换平移变换旋转变换 H_eprojective2d([cos(theta) sin(theta…

体育风尚杂志体育风尚杂志社体育风尚编辑部2024年第8期目录

体讯 体育产业“破圈” 3-7 成都大运会获2023年度最佳体育赛事媒体设施奖 8-10 斯巴达勇士赛 2024斯巴达勇士赛深圳站漫威主题赛在深圳光明欢乐田园揭幕 11-15 篮球 CBA季后赛 深圳马可波罗挺进季后赛八强 16-24 游泳 周六福2024年全国游泳冠军赛4月深圳激…

集成电路与电路基础之-二极管

二极管是什么 二极管&#xff0c;又称肖特基二极管或晶体二极管&#xff0c;是一种最基本的半导体器件之一。它由半导体材料&#xff08;如硅、硒、锗等&#xff09;制成&#xff0c;其内部结构是一个PN结&#xff0c;即由一个P型半导体区和一个N型半导体区组成。这种结构赋予…

【freeDiameter】服务端和客户端的连接流程

连接流程详解 进程启动时&#xff0c;先使用main_cmdline解析命令行参数&#xff0c;比如使用-c就会使用指定路径的配置文件&#xff0c;使用-d就会启用后台进程。 之后使用fd_core_initialize初始化核心库。具体会先使用fd_conf_init初始化配置&#xff0c;比如设置各项的默…

Android活动(activity)与服务(service)进行通信

文章目录 Android活动&#xff08;activity&#xff09;与服务&#xff08;service&#xff09;进行通信活动与服务进行通信服务的生命周期 Android活动&#xff08;activity&#xff09;与服务&#xff08;service&#xff09;进行通信 活动与服务进行通信 上一小节中我们学…

国产3A大作《黑神话:悟空》,各类MOD+修改器+皮肤等资源大合集(附安装教程)

《黑色神话&#xff1a;悟空》的引擎让你可以修改角色的伤害、防御和各种物资数量&#xff0c;大大降低了游戏的难度&#xff0c;让动作游戏的玩家更容易享受到体验。但是&#xff0c;请注意&#xff0c;使用作弊引擎会大大降低游戏体验&#xff0c;因此请明智地使用它&#xf…

各种探针卡介绍

探针卡(Probe Card)是一种在半导体测试过程中至关重要的设备,主要用于晶圆测试阶段,通过探针与芯片上的焊垫或凸块直接接触,完成测试信号的传输和反馈。探针卡的种类多样,各有其特点和应用场景。以下是几种常见的探针卡类型详细介绍: 1. 刀片探针卡(Blade Probe Card)…

<Rust>egui学习之小部件(五):如何在窗口中添加图像部件?

前言 本专栏是关于Rust的GUI库egui的部件讲解及应用实例分析&#xff0c;主要讲解egui的源代码、部件属性、如何应用。 环境配置 系统&#xff1a;windows 平台&#xff1a;visual studio code 语言&#xff1a;rust 库&#xff1a;egui、eframe 概述 本文是本专栏的第五篇博…

【Qt】垂直布局管理器QVBoxLayout

垂直布局管理器QVBoxLayout 在之前学习Qt的过程中&#xff0c;将控件放在界面上&#xff0c;都是依靠“手动”的方式来布局的&#xff0c;但是手动调整的方式是不科学的。 手动布局的方式非常复杂&#xff0c;而且不精确无法对窗口大小进行自适应 因此Qt引入布局管理器来解决…

2-79 基于matlab的卷积稀疏的形态成分分析的医学图像融合

基于matlab的卷积稀疏的形态成分分析的医学图像融合&#xff0c;基于卷积稀疏性的形态分量分析 (CS-MCA) 的稀疏表示 (SR) 模型&#xff0c;用于像素级医学图像融合。通过 CS-MCA 模型使用预先学习的字典获得其卡通和纹理组件的 CSR。然后&#xff0c;合并所有源图像的稀疏系数…

13-springcloud gateway集成nacos实现负载均衡

网关作为访问系统的入口&#xff0c;负载均衡是必选项而不是可选项&#xff0c;本文介绍gateway与nacos集成&#xff0c;实现负载均衡的过程。关于springcloud gateway的基本用法&#xff0c;同学可以看看上篇文章: 12-使用gateway作为网关。 0、环境 jdk&#xff1a;1.8spri…

【GIT】idea中实用的git操作,撤回commit,撤回push、暂存区使用

IDEA中最常见的UI操作&#xff1a;【GIT】Idea中的git命令使用-全网最新详细&#xff08;包括现象含义&#xff09; 文章目录 问题一&#xff1a; idea撤回仅commit错误的代码&#xff08;仅本地仓库&#xff0c;因为还没推送到远程&#xff09;问题二&#xff1a; idea撤回Com…