如何用Playwright点击无ID/空name下拉框的All选项并爬取内容

• 需爬取NBA球员数据页面，点击下拉框中的「All」选项加载全部内容，但目标select元素无id、label属性，name属性为空，定位困难
• 目标页面：https://www.nba.com/stats/players/traditional?Season=1998-99&SeasonType=Regular+Season

目标元素HTML结构 #

<div class="Pagination_pageDropdown__KgjBU">
 <div class="DropDown_content__Bsm3h">
  <label class="DropDown_label__lttfI">
   <p data-no-label="true"></p>
  <div class="DropDown_dropdown__TMlAR">
   <select name="" class="DropDown_select__4pIg9">
     <option value="-1">All</option>
     <option value="0">1</option>
     <option value="1">2</option>
     <option value="2">3</option>
     <option value="3">4</option>
     <option value="4">5</option>
     <option value="5">6</option>
     <option value="6">7</option>
     <option value="7">8</option>
     <option value="8">9</option>
   </select>

当前代码 #

import asyncio
from playwright.async_api import async_playwright
from NBA.spiders.nba import NbaScraping

async def main():
    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=False)
        page = await browser.new_page()
        spider = NbaScraping()
        spider.start_requests()
        for url in spider.start_urls:
            await page.goto(url)
            selector =  page.locator('.Pagination_pageDropdown__KgjBU.DropDown_select__4pIg9')
            await selector.wait_for()
            page.select_option(value='-1')
            page.wait_for_timeout(5999)
        await browser.close()

asyncio.run(main())

问题分析与修正方案 #

原代码核心问题 #

1. 选择器错误：.Pagination_pageDropdown__KgjBU.DropDown_select__4pIg9要求同一个元素同时拥有两个类，但实际Pagination_pageDropdown__KgjBU是父容器类，DropDown_select__4pIg9是子select元素类，需用空格分隔表示后代关系。
2. 未通过定位器执行选择操作：直接调用page.select_option会全局匹配，容易误选其他select元素，应通过定位器精准操作目标元素。
3. 异步方法缺失await：page.select_option和page.wait_for_timeout是异步方法，必须加await才能正确执行。
4. 页面加载等待不充分：默认page.goto仅等待DOM加载，动态页面需等待网络空闲确保元素渲染完成。

修正后的代码 #

import asyncio
from playwright.async_api import async_playwright
from NBA.spiders.nba import NbaScraping

async def main():
    async with async_playwright() as p:
        browser = await p.chromium.launch(headless=False)
        page = await browser.new_page()
        spider = NbaScraping()
        spider.start_requests()
        for url in spider.start_urls:
            # 等待页面网络空闲，确保动态元素加载完成
            await page.goto(url, wait_until="networkidle")
            
            # 正确定位select元素：父容器后代的目标类元素
            select_locator = page.locator('.Pagination_pageDropdown__KgjBU .DropDown_select__4pIg9')
            await select_locator.wait_for(state="visible")
            
            # 通过定位器选择value为-1的「All」选项
            await select_locator.select_option(value="-1")
            
            # 等待页面加载全部数据，可根据实际情况调整超时时间
            await page.wait_for_timeout(6000)
            
            # 此处添加爬取页面内容的逻辑，比如获取表格数据
            # 示例：table_content = await page.locator('.Crom_table__p1iZz').inner_html()
            
        await browser.close()

asyncio.run(main())

额外提示 #

• 若页面有反爬机制，可添加自定义用户代理（page.set_extra_http_headers）提升兼容性。
• 优先使用元素状态等待（如等待表格行数变化）替代固定超时，提升代码稳定性。

内容的提问来源于stack exchange，提问作者Anh Tu Pham