Java结合Selenium如何提取元素style属性中的图片URL与文件名

前置注意点 #

• 你原有代码里driver.findElements(ApplicationLogoElement)返回的是匹配到的所有元素的集合，不能直接调用getAttribute方法，需要先定位到目标单个元素，比如取第一个匹配元素就追加.get(0)。
• 不建议用硬编码下标截取字符串的方式实现，不同浏览器返回的style字符串格式存在差异：url()包裹的链接可能带双引号、单引号，也可能不带引号，括号前后还可能存在空格，硬编码偏移量很容易出现截取错误。

推荐实现方案（正则匹配，兼容性强） #

这个方案可以兼容所有浏览器返回的style格式，既能拿到完整图片链接，也能快速提取末尾文件名：

import java.util.regex.Matcher;
import java.util.regex.Pattern;
import org.openqa.selenium.WebElement;

// 1. 获取目标元素的style属性值
WebElement logoElement = driver.findElements(ApplicationLogoElement).get(0);
String styleContent = logoElement.getAttribute("style");

// 2. 正则匹配提取background-image对应的完整图片链接
// 正则兼容url()内带单引号、双引号、无引号、前后带空格的场景
Pattern urlPattern = Pattern.compile("background-image:\\s*url\\([\"']?([^\"')]+)[\"']?\\)");
Matcher matchResult = urlPattern.matcher(styleContent);
String fullImageUrl = "";
if (matchResult.find()) {
    fullImageUrl = matchResult.group(1);
}
System.out.println("提取到的完整图片链接：" + fullImageUrl);

// 3. 提取链接末尾的文件名
String fileName = "";
if (!fullImageUrl.isEmpty()) {
    fileName = fullImageUrl.substring(fullImageUrl.lastIndexOf("/") + 1);
}
System.out.println("提取到的文件名：" + fileName);

更稳定的实现方式（Selenium直接取CSS属性） #

如果使用Selenium，可以直接调用getCssValue方法获取指定CSS属性值，不需要手动解析完整style字符串，容错率更高：

WebElement logoElement = driver.findElements(ApplicationLogoElement).get(0);
// 直接获取background-image的CSS属性值
String bgImageCssValue = logoElement.getCssValue("background-image");

// 后续正则提取逻辑和上面一致
Pattern urlPattern = Pattern.compile("url\\([\"']?([^\"')]+)[\"']?\\)");
Matcher matchResult = urlPattern.matcher(bgImageCssValue);
String fullImageUrl = "";
if (matchResult.find()) {
    fullImageUrl = matchResult.group(1);
}
String fileName = fullImageUrl.substring(fullImageUrl.lastIndexOf("/") + 1);

原有写法的问题说明 #

• 字符串下标截取法：硬编码+2/-1的偏移量只适配当前你看到的带双引号的格式，一旦浏览器返回的url()不带引号、或者引号前后有空格，截取结果就会多带/少带字符。
• 正则替换法：你用的(.*?/)是非贪婪匹配，会替换所有斜杠前的内容，最终会得到多个斜杠后的片段，无法精准拿到最后一段的文件名，遇到url带查询参数的场景还会把参数一并提取出来。

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