【selenium】八大元素定位
8大元素定位方法
| 序号 | 定位元素方法 | 定位代码 | 备注 |
| 1 | id | findElement(By.id()) | 通过id定位元素 |
| findElements(By.id()) | 通过id定位一组元素 | ||
| 2 | name | findElement(By.name()) | 通过name定位元素 |
| findElements(By.name()) | 通过name定位一组元素 | ||
| 3 | className | findElement(By.className()) | 通过className定位元素 |
| findElements(By.className()) | 通过className定位一组元素 | ||
| 4 | tagName | findElement(By.tagName()) | 通过tagName定位元素 |
| findElements(By.tagName()) | 通过tagName定位一组元素 | ||
| 5 | linkText | findElement(By.linkText()) | 通过超链接文本定位元素 |
| findElements(By.linkText()) | 通过超链接文本定位一组元素 | ||
| 6 | partialLinkText | findElement(By.partialLinkText()) | 通过部分超链接文本定位元素 |
| findElements(By.partialLinkText()) | 通过部分超链接文本定位一组元素 | ||
| 7 | xpath | findEleMent(By.xpath()) | 通过xpath路径定位元素 |
| findElements(By.xpath()) | 通过xpath路径定位一组元素 | ||
| 8 | cssSelector | findElement(By.cssSelector()) | 通过css属性定位元素 |
| findElements(By.cssSelector()) | 通过css属性定位一组元素 |
0.Google查找元素的方法
鼠标右键--检查，调出控制台，根据选择器定位对应功能的前端实现代码
接下来我们就可以通过操作该功能对应的属性定位到功能元素位置并对其进行相关操作
1.id定位
id具有唯一性，只要元素有id属性，就可以直接根据id来定位到对应的功能进行操作
// 前端代码
<input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">
通过selenium定位定位元素
package com.test.selenium; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; /** * 通过id定位 * */ public class App { public static void main( String[] args ) throws InterruptedException { System.out.println( "执行开始" ); System.setProperty("webdriver.chrome.bin", "G:/chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.get("http://www.baidu.com/"); //通过id定位元素,并且输入：博客园 driver.findElement(By.id("kw")).sendKeys("博客园"); Thread.sleep(3000); //通过id的定位元素：百度一下，并点击 driver.findElement(By.id("su")).click(); Thread.sleep(4000); driver.close(); System.out.println( "执行结束" ); } }
2.name定位
通过name属性定位，name需要是唯一的，不然会报错
// 前端代码
<input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">
通过selenium代码实现name属性定位
/** * 通过name定位 * */ public class App { public static void main( String[] args ) throws InterruptedException { System.out.println( "执行开始" ); System.setProperty("webdriver.chrome.bin", "G:/chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.get("http://www.baidu.com/"); //通过name定位元素,并且输入：博客园 driver.findElement(By.name("wd")).sendKeys("博客园"); Thread.sleep(3000); //通过id的定位元素：百度一下，并点击 driver.findElement(By.id("su")).click(); Thread.sleep(4000); driver.close(); System.out.println( "执行结束" ); } }
3.className定位
通过className来实现元素定位，需要注意:1.属性具有唯一性；2.同一个className对应多个属性值的时候，无法实现className定位（如果有你能实现定位，欢迎在评论区指正），这种情况可以使用其他方式实现定位
// 前端代码
<input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">
通过className属性实现元素的精确定位
package com.test.selenium; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; /** * 通过className定位 * */ public class App { public static void main( String[] args ) throws InterruptedException { System.out.println( "执行开始" ); System.setProperty("webdriver.chrome.bin", "G:/chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.get("http://www.baidu.com/"); //通过className定位元素,并且输入：博客园 driver.findElement(By.className("s_ipt")).sendKeys("博客园"); Thread.sleep(3000); //通过id的定位元素：百度一下，并点击 driver.findElement(By.id("su")).click(); Thread.sleep(4000); driver.close(); System.out.println( "执行结束" ); } }
4.tagName定位
通过tagName定位的方法一般要求在同一个页面下，标签具有唯一性才能够准确的定位，然而在很多的页面，标签都不会唯一，所以通过这种方式定位用得相对较少；但是这种方式我们还是需要掌握下：
// 前端代码
<input type="text" class="s_ipt" name="wd" id="kw" maxlength="100" autocomplete="off">
例如上面用到得是input标签，所以我们就可以通过tagName来对其进行定位，但在真实情况中，是要考虑标签的唯一性的。
driver.findElement(By.tagName("input"));
5.linkText定位
这是一种通过文本链接来定位的方式，一般都是由一对<a></a>标签包裹的文本，hao123就是一个文本链接
//前端代码
<a href="https://www.hao123.com?src=from_pc_logon" target="_blank" class="mnav c-font-normal c-color-t">hao123</a>
通过代码实现linkText定位
package com.test.selenium; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; /** * 通过linkText定位 * */ public class App { public static void main( String[] args ) throws InterruptedException { System.out.println( "执行开始" ); System.setProperty("webdriver.chrome.bin", "G:/chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.get("http://www.baidu.com/"); //通过linkText定位元素,并且点击 driver.findElement(By.linkText("hao123")).click(); Thread.sleep(3000); driver.close(); System.out.println( "执行结束" ); } }
6.partialLinkText定位
对于partialLinkText定位，其实就是对linkText的一个补充，因为linkText定位是需要把一整个文本都加入才能定位到，但是有的时候，超链接文本过长，所以就加了通过部分文本来定位元素的方式。
//前端代码
<a href="https://www.hao123.com?src=from_pc_logon" target="_blank" class="mnav c-font-normal c-color-t">hao123</a>
接下来，上代码
package com.test.selenium; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; /** * 通过partialLinkText定位 * */ public class App { public static void main( String[] args ) throws InterruptedException { System.out.println( "执行开始" ); System.setProperty("webdriver.chrome.bin", "G:/chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.get("http://www.baidu.com/"); //通过partialLinkText定位元素,并且点击 //driver.findElement(By.partialLinkText("hao")).click(); driver.findElement(By.partialLinkText("123")).click(); Thread.sleep(3000); driver.quit(); System.out.println( "执行结束" ); } }
7.xPath定位
通过xPath定位的方式定位用得比较多，因为通过这种方式定位元素，80%左右的元素都可以被找到；接下来就说一下xPath定位得方式：绝对定位和相对定位。
绝对定位：从根节点开始一级一级往内，直到找到想要得元素；
driver.findElement(By.xpath("/html/body/div[1]/div[2]/div[5]/div[1]/div/form/span[1]/input")).sendKeys("博客园");
绝对定位的表达式很长，一般改动某一个标签或者属性，该表达式就会失效；且因为表达式很长，加载也很容易失败。
相对定位：相对于某一个元素或者属性来实现定位的方式
相对定位比较灵活，使用也比较准确，也比较推荐这种定位方式
driver.findElement(By.xpath("//*[@id='kw']")).sendKeys("博客园");
driver.findElement(By.xpath("//form[@id='form']/span/input")).sendKeys("博客园");
package com.test.selenium; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; /** * 通过xpath定位 * */ public class App { public static void main( String[] args ) throws InterruptedException { System.out.println( "执行开始" ); System.setProperty("webdriver.chrome.bin", "G:/chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.get("http://www.baidu.com/"); //通过xpath定位元素,并且点击 Thread.sleep(5000); driver.findElement(By.xpath("//form[@id='form']/span/input")).sendKeys("博客园"); Thread.sleep(3000); driver.quit(); System.out.println( "执行结束" ); } }
可以通过下面这种方式获取xpath的表达式，不过自己需要检查下，有些表达式也不一定准确。
8.cssSelector定位
CSS(Cascading Style Sheets)是层叠样式表，主要作用是描述 HTML 和 XML 文档的外观展示样式。CSS 可以比较灵活选择控件的任意属性，一般情况下定位速度要比 XPath 快，不容易掌握。
|
选择器 |
实例 |
描述 |
| .class | .s_ipt | class 选择器，选择 class="s_ipt"的所有元素 |
| #id | #kw | id 选择器，选择所有 id= "kw" 所有元素 |
| * | * | 选择所有元素 |
| element | input | 元素所有<input>元素 |
| element > element | div > input | 选择父元素为 <div> 元素的所有 <input> 元素 |
| element + element | div + input | 选择紧接在 <div> 元素之后的所有 <input > 元素。 |
| [attribute=value] | [autocomplete=off] | 选择 autocomplete="off"的所有元素。 |
部分代码实现
package com.test.selenium; import org.openqa.selenium.By; import org.openqa.selenium.WebDriver; import org.openqa.selenium.chrome.ChromeDriver; /** * 通过cssSelector定位 * */ public class App { public static void main( String[] args ) throws InterruptedException { System.out.println( "执行开始" ); System.setProperty("webdriver.chrome.bin", "G:/chromedriver.exe"); WebDriver driver = new ChromeDriver(); driver.get("http://www.baidu.com/"); //通过cssSelector定位元素,并且点击 Thread.sleep(5000); //通过 id 属性定位 //driver.findElement(By.cssSelector("#kw")).sendKeys("博客园"); //通过 class属性定位 //driver.findElement(By.cssSelector(".s_ipt")).sendKeys("博客园"); //通过标签名定位 // driver.findElement(By.cssSelector("input")); //通过父子关系定位 //driver.findElement(By.cssSelector("span > input")); //通过属性定位 driver.findElement(By.cssSelector("input[autocomplete='off']")).sendKeys("博客园"); //组合定位 //driver.findElement(By.cssSelector("xpan.bg s_ipt_wr > input.s_ipt")); Thread.sleep(3000); driver.quit(); System.out.println( "执行结束" ); } }
也可以通过下面的方式获取到cssSelector的相关表达式
9.xpath和css对比
| 定位方式 | XPath | CSS |
| 标签 | //div | div |
| By id | //div[@id='eleid'] | div#eleid |
| By class | //div[@class='eleclass'] | div#eleid |
| By 属性 | //div[@title='Move mouse here'] |
div[title=Move mouse here] |
| 定位子元素 |
//div[@id='eleid']/* |
div#eleid>* |
定位元素报错：可参考https://baijiahao.baidu.com/s?id=1722477304050724016&wfr=spider&for=pc
