Selenium如何按序提取元素内img的alt值与文本拼接为完整语句

核心思路是不要单独提取img标签或单独提取文本，而是按照DOM原生的节点顺序遍历目标容器下的所有子节点，区分文本节点和img元素节点分别取值，遇到嵌套元素递归遍历，就能完全保留原有位置顺序，不会遗漏穿插的内容。

你之前的实现只单独匹配了img标签，完全跳过了DOM树中的文本节点，自然无法获取穿插的普通文本，也无法保证顺序。

实现代码 #

最稳定的方式是直接通过Selenium执行前端JS遍历DOM，节点顺序100%和页面实际结构一致，不会出现排序错乱问题：

from selenium.webdriver.common.by import By

# 先定位到包含所有内容的父级WebElement，替换成你实际的定位逻辑即可
parent_element = driver.find_element(By.CSS_SELECTOR, "你的目标容器选择器")

# 节点遍历提取脚本
extract_content_script = """
function extract(node) {
    const parts = [];
    for (const child of node.childNodes) {
        // 处理文本节点：取非空的去空白文本
        if (child.nodeType === Node.TEXT_NODE) {
            const text = child.textContent.trim();
            if (text) parts.push(text);
        }
        // 处理元素节点
        else if (child.nodeType === Node.ELEMENT_NODE) {
            // img标签取alt属性
            if (child.tagName.toLowerCase() === 'img') {
                const altVal = child.getAttribute('alt')?.trim();
                if (altVal) parts.push(altVal);
            }
            // 其他标签递归遍历子节点，兼容嵌套结构
            else {
                parts.push(...extract(child));
            }
        }
    }
    return parts;
}
// 拼接为完整语句返回
return extract(arguments[0]).join(' ');
"""

sentence = driver.execute_script(extract_content_script, parent_element)

方案说明 #

• 完全遵循原生DOM节点顺序，无论文本和img标签怎么穿插、中间间隔多少个img，都能按原有位置拼接
• 自动过滤空换行、多余空白字符，不会出现连续无意义空格
• 支持嵌套结构，即使img或文本被span、div等其他标签包裹，也能正常提取内容，不会漏值
• 对你提供的示例HTML执行后，输出结果完全匹配预期：one Bobby gave: two two two and took three four

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