使用Selenium获取隐藏元素的CSS属性

Question

我正在尝试访问容器div的background-image：url（“....”）属性并获取图像URL。

问题是容器div最初是隐藏的，而图像url是动态添加的，并且容器是可见的。

当我尝试使用PhotoContainer.getCSSValue（“background-image”）；访问元素时，它返回给我none。

html代码为：

<div id="photo_container" style="background-image: url("res/images/840x460/287/28702560.jpg");"></div>

此分区的CSS为：

background-image: url("res/images/840x460/287/28702560.jpg");
display: none;

但是，使用下面的代码可以获得url字符串：

       WebDriverWait wait = new WebDriverWait(driver, 20);
       WebElement element = wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("photo_holding")));
       // Now div is visible so get the attribute
       WebElement photoContainer = driver.findElement(By.id("photo_holding"));
       String imgUrl = photoContainer.getCssValue("background-image");
       System.out.println(imgUrl);

   driver.quit();

 for(int i=0;i<=slideCount;i++){
       WebDriverWait wait = new WebDriverWait(driver, 20);
       WebElement element = wait.until(ExpectedConditions.visibilityOfElementLocated(By.id("photo_holding")));
       // Now div is visible so get the attribute
       WebElement photoContainer = driver.findElement(By.id("photo_holding"));
       String imgUrl = photoContainer.getCssValue("background-image");
       System.out.println(imgUrl);
       Thread.sleep(2000);
   }

使用以下代码动态添加图像容器“photo_holding”

$('<div id="photo_holding"></div>').insertAfter("#photo_container");$("#photo_holding").css("background-image","url("+slideshow_photos[o]+")");
 $("#photo_container").fadeOut(2000,function() {$(this).remove();$("#photo_holding").attr("id","photo_container");

Answer 1

ImageURLs存储在SlideShow_Photos[]中，对吗？如果我们读了它，我们就能得到我们所需要的。

根据使用Selenium WebDriver阅读JavaScript变量的第三个答案，如果需要了解幻灯片的数量，那么我们可以在循环中获得它们String result=(String)js.executescript（“return slideshow_photos[”+i+“]”）；

希望这能对你有所帮助。