如何使用Puppeteer获取选中<option>的文本（而非value值）

以下是几种可靠的方式获取选中<option>的文本内容：

方法1：通过page.evaluate在浏览器上下文直接获取 #

直接在页面DOM环境中操作，是最直观的实现方式：

const selectedText = await page.evaluate(() => {
  const select = document.getElementById('choose1');
  return select.options[select.selectedIndex].text;
});
console.log(selectedText); // 输出 "Value 2"

方法2：使用page.$eval简化操作 #

通过选择器定位select元素，在回调中直接获取选中项文本：

const selectedText = await page.$eval('#choose1', el => el.options[el.selectedIndex].text);
console.log(selectedText);

方法3：修正选择器获取选中<option> #

如果想用option:selected选择器，配合page.$eval执行即可规避无效选择器的问题：

const selectedText = await page.$eval('#choose1 option:selected', el => el.textContent);
console.log(selectedText);

方法4：通过已知选中值反向匹配<option> #

既然已经知道选中的value是val2，可以直接定位对应option取文本：

const selectedText = await page.$eval('#choose1 option[value="val2"]', el => el.textContent);
console.log(selectedText);

内容的提问来源于stack exchange，提问作者thiagofred