Selenium CSS选择器-ID/类别和属性
 
 
语法: css = <HTML标记><.或#><Class或ID属性的值><[attribute=属性的值]>  
"#"用于象征ID属性。如果使用ID属性创建CSS选择器,则必须使用哈希符号。 
".用于象征Class属性。如果要使用class属性创建CSS选择器,则必须使用点号。 
 Class或ID属性的值-它是正在访问的ID/Class属性的值。 
我们可以在" <[attribute=属性值]>"部分中使用值,类型和名称作为属性。 
属性的值表示在使用特定属性时正在访问的值。  
我们还可以添加两个以上的属性来定位所需的Web元素。例如,css = input#Passwd [type ='password'] [name ='Passwd']。 
 让我们考虑一个有关如何使用ID/Class和Attribute创建可唯一标识Web元素的CSS选择器的示例。
 
 我们将尝试通过定义来定位Web元素该特定Web元素的CSS选择器。
 
启动Firefox浏览器。 
单击浏览器右上角显示的Selenium图标。 
它将启动Selenium IDE的默认界面。 
单击"测试脚本编辑器"框中显示的命令文本框。 
 
 
 
将第一个命令的属性修改为: 命令: 打开 目标: https://www.testandquiz.com/user-login0  执行后,此命令将在Firefox浏览器中加载"测试和测验"登录页面。  
 
 
 
 现在,使用第二个命令,我们将尝试找到"用户名"文本框。 
 
 首先,我们将检查"用户名"文本框,以获取ID/Class属性的值。随后,我们将确定最适合定位所需元素的属性。
 
 右键单击用户名文本框,然后选择检查元素。  
 
 
 它将启动一个窗口,其中包含开发"用户名"文本框所涉及的所有特定代码。  
 
 
 选择输入标签,ID属性的值,名称属性的值和占位符属性的值。  
 
 
 我们将CSS选择器定义为: css = input#email [name ='email_id'] [placeholder ='Email'] 
 
将第二条命令的属性修改为: 命令: 点击 目标: css = input#email [name ='email_id'] [placeholder ='Email']  执行后,此命令将单击"用户名"文本框。  
 我们将使用相同的CSS选择器再添加一个命令。此命令将在"用户名"文本框中键入用户名文本。 
 
将第三条命令的属性修改为: 命令: 键入 目标: css = input#email [name ='email_id'] [placeholder ='Email']  值: 用户名 执行后,此命令将在"用户名"文本框中键入值。   
 
 
 
 让我们执行测试脚本,看看插入的命令是否有效。
 
单击IDE工具栏菜单上的"运行当前测试"按钮。它将在浏览器上执行所有插入的命令,并为您提供已执行测试脚本的总体摘要。 
 以下屏幕截图显示我们已经成功执行了测试脚本。
 
 
 
 
 (1)-输入标签,ID属性的值,名称属性的值和占位符属性的值都用于我们的CSS选择器的位置以找到"用户名"文本框元素。
 
 (2)-"日志"窗格显示已执行的测试脚本的总体摘要。
 
 (3)-生成的值由于执行了第三条命令。