如何在Playwright TS/JS中通过Xpath/CSS选择器定位元素？

Playwright完全支持CSS选择器和XPath定位，只是没有单独命名为getByCssSelector或getByXpath的方法，而是通过通用的locator()方法实现：

• CSS选择器定位：直接将CSS选择器字符串传入locator()即可，也可以显式添加css=前缀，效果一致：

  // 定位class为"submit-btn"的元素
  await page.locator('.submit-btn').click();
  // 显式指定CSS前缀
  await page.locator('css=.submit-btn').click();
  

• XPath定位：将XPath表达式传入locator()，Playwright会自动识别，也可以显式添加xpath=前缀：

  // 定位文本为"确认"的按钮
  await page.locator('//button[text()="确认"]').click();
  // 显式指定XPath前缀
  await page.locator('xpath=//button[text()="确认"]').click();
  

需要注意的是，Playwright官方推荐优先使用getByRole、getByText这类语义化定位器，因为它们更稳定，不易受页面结构变动影响，但如果业务场景有特殊需求，CSS和XPath定位可以正常使用。

内容的提问来源于stack exchange，提问作者I.sh.