- 前言
我们在做WEB自动化，就是要操作页面上的元素。所以我们要找到页面上的这些元素，然后才能操作元素。
一、 查看页面元素的工具
因为页面上的HTML代码非常多，我们需要很快的找到元素，使用工具能加快我们的效率。
1、火狐插件-->搜索 selenium--添加Katalon Recorder (Selenium IDE alternative)插件
image.png
image.png
2、安装好后可以在菜单栏里面了
image.png
二、 元素定位
下面都是以百度首页举例子
image.png
1、id定位：driver.findElement(By.id(""))
定位搜索框的id属性
/驱动文件路径
System.setProperty("webdriver.gecko.driver", "lib\\geckodriver.exe");
//启动火狐浏览器
WebDriver driver= new FirefoxDriver();
//打开百度首页
driver.get("https://www.baidu.com/");
//通过id定位搜索框，并输入关键字“八戒”
driver.findElement(By.id("kw")).sendKeys("八戒");
2、name定位：driver.findElement(By.name(""))
定位搜索框的name属性
/驱动文件路径
System.setProperty("webdriver.gecko.driver", "lib\\geckodriver.exe");
//启动火狐浏览器
WebDriver driver= new FirefoxDriver();
//打开百度首页
driver.get("https://www.baidu.com/");
//通过name定位搜索框，并输入关键字“八戒”
driver.findElement(By.name("kw")).sendKeys("八戒");
3、class定位：driver.findElement(By.className(""))
定位搜索框的class属性
/驱动文件路径
System.setProperty("webdriver.gecko.driver", "lib\\geckodriver.exe");
//启动火狐浏览器
WebDriver driver= new FirefoxDriver();
//打开百度首页
driver.get("https://www.baidu.com/");
//通过class定位搜索框，并输入关键字“八戒”
driver.findElement(By.className("s_ipt")).sendKeys("八戒");
4、css定位：driver.findElement(By.cssSelector(""))
定位搜索框的css属性
/驱动文件路径
System.setProperty("webdriver.gecko.driver", "lib\\geckodriver.exe");
//启动火狐浏览器
WebDriver driver= new FirefoxDriver();
//打开百度首页
driver.get("https://www.baidu.com/");
//通过css定位搜索框，并输入关键字“八戒”
driver.findElement(By.className("#kw")).sendKeys("八戒");
5、link定位：driver.findElement(By.linkText(""))
定位搜索框的link属性,这个方法时专门用来定位文本连接的，也就是a标签<a>
/驱动文件路径
System.setProperty("webdriver.gecko.driver", "lib\\geckodriver.exe");
//启动火狐浏览器
WebDriver driver= new FirefoxDriver();
//打开百度首页
driver.get("https://www.baidu.com/");
//通过link定位搜索框，定位“新闻”这个超文本，并且点击
driver.findElement(By.linkText("新闻"))).click();
6、partialLinke定位：driver.findElement(By.partialLinkText(""))
可能有时候一个超链接的文本很长，如果全部输入，就会很冗余，这时候，我们就只需要截取一部分就可以了
/驱动文件路径
System.setProperty("webdriver.gecko.driver", "lib\\geckodriver.exe");
//启动火狐浏览器
WebDriver driver= new FirefoxDriver();
//打开百度首页
driver.get("https://www.baidu.com/");
//通过partialLinkText定位搜索框，定位“新闻”这个超文本，并且点击
driver.findElement(By.partialLinkText("新"))).click();
7、tag定位：driver.findElement(By.tagName(""))
所谓的tag定位，简单粗暴的说就是标签，比如<input><table><div>等都是tag。
/驱动文件路径
System.setProperty("webdriver.gecko.driver", "lib\\geckodriver.exe");
//启动火狐浏览器
WebDriver driver= new FirefoxDriver();
//打开百度首页
driver.get("https://www.baidu.com/");
//通过tag定位搜索框，并输入关键字“八戒”
driver.findElement(By.tagName("//input[@id="kw"]").sendKeys("八戒");//通过id，搜索到input这个tag
8、xpath定位：driver.findElement(By.xpath(""))
xpath是一种语法，它的定位功能是非常强大的，感觉任何的元素都可以定位到，强烈推荐使用这种方法
/驱动文件路径
System.setProperty("webdriver.gecko.driver", "lib\\geckodriver.exe");
//启动火狐浏览器
WebDriver driver= new FirefoxDriver();
//打开百度首页
driver.get("https://www.baidu.com/");
//通过xpath定位搜索框，并输入关键字“八戒”
driver.findElement(By.xpath("//*[@id='kw']").sendKeys("八戒");
