在 Web 自动化测试中,使用 JavaScript 定位元素的方法主要有以下几种:
一、通过 ID 定位
可以使用 document.getElementById()方法通过元素的 ID 来定位元素。
示例代码:
const element = document.getElementById('elementId');
二、通过 Name 属性定位
使用 document.getElementsByName()方法可以通过元素的 name 属性来定位元素,该方法返回一个 HTMLCollection 对象,包含所有具有指定 name 属性的元素。
示例代码:
const elements = document.getElementsByName('elementName');
三、通过 Class Name 定位
document.getElementsByClassName()方法通过元素的 class 属性来定位元素,同样返回一个 HTMLCollection 对象。
示例代码:
const elements = document.getElementsByClassName('className');
四、通过 Tag Name 定位
使用 document.getElementsByTagName()方法可以通过元素的标签名来定位元素,返回一个 HTMLCollection 对象。
示例代码:
const elements = document.getElementsByTagName('tagName');
五、通过 CSS 选择器定位
1. document.querySelector():返回匹配指定 CSS 选择器的第一个元素。
• 示例代码:
const element = document.querySelector('.className');
2. document.querySelectorAll():返回匹配指定 CSS 选择器的所有元素,是一个 NodeList 对象。
• 示例代码:
const elements = document.querySelectorAll('p');
六、通过 XPath 定位
可以使用浏览器内置的 document.evaluate()方法来执行 XPath 表达式以定位元素。
示例代码:
const xpath = "//div[@class='className']";
const element = document.evaluate(xpath, document, null, XPathResult.FIRST_ORDERED_NODE_TYPE, null).singleNodeValue;