在上一节我们已经了解到如何定位到元素,那么接下来就可以与元素进行交互了。
下面的例子都是以百度首页作为测试页面
输入文本
FillAsync
方法用于模拟用户选中元素并输入文本,这会触发元素的 input 事件。该方法只适合<input>、<textarea>
等可输入的元素。
例如,下面的代码在搜索框中输入文本:
await page.Locator("id=kw").FillAsync("MyIO Hello Playwright");
点击鼠标
ClickAsync
方法用于模拟用户点击元素,同时会将元素滚动到浏览器当前可视范围内。
例如,点击搜索按钮:
await page.Locator("id=su").ClickAsync();
悬停鼠标
HoverAsync
方法用于模拟用户将鼠标悬停在元素上,同时会将元素滚动到浏览器当前可视范围内。
例如,悬停鼠标在“设置”链接上弹出菜单:
await page.Locator("//*[@id=\"u\"]/a[2]").HoverAsync();
选中单选按钮
CheckAsync
方法用于选中和取消选中复选框或单选按钮。
例如,在“搜索设置”窗口将“搜索历史记录”设为显示
:
await page.Locator("id=sh_1").CheckAsync();
最后整体交互效果如下图:
var playwright = await Playwright.CreateAsync();
var browser = await playwright.Chromium.LaunchAsync(new BrowserTypeLaunchOptions { Headless = false, SlowMo = 1000, Channel="chrome", ChromiumSandbox=true });var page = await browser.NewPageAsync();
await page.GotoAsync("https://www.baidu.com");await page.Locator("id=kw").FillAsync(Guid.NewGuid().ToString());await page.Locator("id=su").ClickAsync();await Task.Delay(2000);await page.Locator("//*[@id=\"u\"]/a[2]").HoverAsync();await page.Locator("//*[@id=\"u\"]/div/a[1]/span").ClickAsync();
await page.Locator("id=sh_1").CheckAsync();
添加微信号【MyIO666】,邀你加入技术交流群