如何使用Selenium的CSS、XPath等选择器按索引提取同类同名元素文本

现有实现的错误 #

1. CSS选择器逻辑错误：你要定位的元素本身就是携带v-align-middle和social-details-social-counts__reactions-count两个类的<span>标签，你写的选择器是查找该类元素的子级<span>，完全匹配不到目标元素，只会返回空列表。
2. 实现冗余且效率低：重复调用20次DOM查询接口、写20段几乎完全相同的循环逻辑，不仅维护成本极高，还可能因为页面动态加载导致多次查询返回的元素列表不一致，出现数据错乱。
3. 索引逻辑冗余：不需要单独查询第N个元素，一次性查询所有符合条件的元素后切片取前20个即可，性能比多次查询高得多。

高效实现方案 #

只需要一次查询+一次循环就能完成需求，代码如下：

# 一次性查询所有符合类条件的元素，切片取前20个
like_elements = driver.find_elements_by_css_selector(".v-align-middle.social-details-social-counts__reactions-count")[:20]
data = []
# 遍历元素直接拼接数据
for index, ele in enumerate(like_elements, start=1):
    data.append({
        f"Likes{index}": ele.text
    })

print(data)
driver.close()

如果你用的是Selenium 4.0+版本，find_elements_by_css_selector方法已废弃，推荐使用官方推荐的写法：

from selenium.webdriver.common.by import By

# 替换查询语句即可
like_elements = driver.find_elements(By.CSS_SELECTOR, ".v-align-middle.social-details-social-counts__reactions-count")[:20]

该方案和你后续要加的滚动加载逻辑适配也很方便：只需要滚动页面后重新查询元素列表，直到列表长度≥20再停止滚动做数据提取即可。

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