通过XPath提取Alt属性

Question

我正在自动提取亚马逊上的产品变化，我有以下HTML标记:

<ul
    class="a-nostyle a-button-list a-horizontal a-spacing-top-micro swatches swatchesSquare imageSwatches">
    <!-- Please note that in className never append a class with prefix as 'swatch'. It would break something in the twister JS -->
    <li id="color_name_0" class="swatchSelect" data-dp-url="" title="Click to select White">
        <span class="a-list-item">
            <div class="tooltip">
                <span class="a-declarative" data-swatchthumb-action="{"dimIndex":1,"dimValueIndex":0}" data-action="swatchthumb-action">
                    <span id="a-autoid-11" class="a-button a-button-thumbnail a-button-toggle">
                        <span class="a-button-inner">
                            <button id="a-autoid-11-announce" class="a-button-text" type="button">
                                <span class="xoverlay" />
                                <div class="">
                                    <div class="">
                                        <img style="height:36px; width:36px" alt="White"
                                            src="http://ecx.images-amazon.com/images/I/41IrdkWxWOL._SS36_.jpg"/>
                                    </div>
                                    <div class="" style=" " />
                                </div>
                            </button>
                        </span>
                    </span>
                </span>
            </div>
        </span>
    </li>
</ul>

我使用下面的XPath来提取所有颜色的XPath。

.//*[@id='variation_color_name']/ul/li/span/div/span/span/span/button

现在我想提取每个项目的alt属性，但当我尝试使用getAttribute("alt")时，它不返回任何东西。在这种情况下，所有文本将是"White"。我正在查看的产品是:http://www.amazon.com/dp/B00J46VVKE。

Answer 1

当您有id属性时，我相信没有必要去xpath，除非您有许多具有相同id的按钮。然而，这里是如何获得img元素的属性-

WebElement btn = driver.findElement(By.id("a-autoid-11-announce"));
String imgColor = btn.findElement(By.tagName("img")).getAttribute("alt");

Answer 2

您可以使用以下代码:

public class Stackoverflow extends Init {
    @Test
    public void testToGetAltAttribute() throws InterruptedException {
        System.out.println("Get Attribute....");
        // this element has alt attribute hence that will be displayed.
        assertAndVerifyElement(By.cssSelector("#landingImage"));
        System.out.println("n#landingImagen=====================");
        System.out.println(getAttributeOfGivenElement(By.cssSelector("#landingImage"), "alt"));
        // this element do not has alt attribute hence that will not be
        // displayed.
        // it will display msg "element do not have altattribute"
        assertAndVerifyElement(By.id("productTitle"));
        System.out.println("n#productTitlen=====================");
        System.out.println(getAttributeOfGivenElement(By.id("productTitle"), "alt"));
    }
    public String getAttributeOfGivenElement(By element, String attributeName) {
        WebElement webElement = getWebDriver().findElement(element);
        if (webElement.getAttribute(attributeName) != null) {
            return webElement.getAttribute("alt");
        } else {
            return "element do not have " + attributeName + "attribute";
        }
    }
    public void assertAndVerifyElement(By element) throws InterruptedException {
        boolean isPresent = false;
        for (int i = 0; i < 5; i++) {
            try {
                if (getWebDriver().findElement(element) != null) {
                    isPresent = true;
                    break;
                }
            } catch (Exception e) {
                // System.out.println(e.getLocalizedMessage());
                Thread.sleep(1000);
            }
        }
        Assert.assertTrue(isPresent, """ + element + "" is not present.");
    }
}

Answer 3

如果你想要所有的颜色，你将需要抓取包含ALT属性的IMG元素。XPath以BUTTON结束。试试下面的代码:

List<WebElement> colors = driver.findElements(By.cssSelector("ul.imageSwatches img"));
for (WebElement color : colors)
{
    System.out.println(color.getAttribute("alt"));
}

CSS选择器读取找到一个UL标签具有类imageSwatches，然后找到所有后代IMG标签。循环遍历IMG标记集合并输出ALT文本。