如何從滑塊/幻燈片中抓取影像？

所以有這個電子商務頁面https://www.jooraccess.com/r/products?token=feba69103f6c9789270a1412954cf250并且有數百種產品，每個產品都有一個帶有影像的滑塊（或幻燈片或任何你稱之為）。我只需要從頁面上抓取所有影像。我了解如何在每個滑塊中抓取第一張影像，但我只是不知道如何在每個滑塊中抓取其余影像。

我檢查了元素并注意到每次更改滑塊中的影像時，這部分

<div data-position="4" class="PhotoBreadcrumb_active__2T6z2 PhotoBreadcrumb_dot__2PbsQ"></div> 

向下移動這些位置（在下面的示例中，選擇了影像#4）

<div class="PhotoBreadcrumb_breadcrumbContainer__2cALf" data-testid="breadcrumbContainer">
    <div data-position="0" class="PhotoBreadcrumb_dot__2PbsQ"></div>
    <div data-position="1" class="PhotoBreadcrumb_dot__2PbsQ"></div>
    <div data-position="2" class="PhotoBreadcrumb_dot__2PbsQ"></div>
    <div data-position="3" class="PhotoBreadcrumb_dot__2PbsQ"></div>
    <div data-position="4" class="PhotoBreadcrumb_active__2T6z2 PhotoBreadcrumb_dot__2PbsQ"></div>
    <div data-position="5" class="PhotoBreadcrumb_dot__2PbsQ"></div>
</div>

uj5u.com熱心網友回復：

要從第一張幻燈片中抓取所有src屬性值，您需要：

• 單擊每張幻燈片，為element_to_be_clickable()誘導WebDriverWait

• 為visibility_of_element_located()收集src誘導WebDriverWait的每個屬性的值

• 您可以使用以下定位器策略：

  driver.get("https://www.jooraccess.com/r/products?token=feba69103f6c9789270a1412954cf250")
  print(WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//img"))).get_attribute("src"))
  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//div[@data-position='1']"))).click()
  print(WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//img"))).get_attribute("src"))
  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//div[@data-position='2']"))).click()
  print(WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//img"))).get_attribute("src"))
  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//div[@data-position='3']"))).click()
  print(WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//img"))).get_attribute("src"))
  WebDriverWait(driver, 20).until(EC.element_to_be_clickable((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//div[@data-position='3']"))).click()
  print(WebDriverWait(driver, 20).until(EC.visibility_of_element_located((By.XPATH, "//div[contains(@class, 'Grid_Row__2R-IV') and contains(@class, 'Grid_left')]/div//img"))).get_attribute("src"))
  

• 控制臺輸出：

  https://cdn.jooraccess.com/img/uploads/accounts/678917/images/Sundays_NYC_3202 (1).jpg
  https://cdn.jooraccess.com/img/uploads/accounts/678917/images/Sundays_NYC_3207.jpg
  https://cdn.jooraccess.com/img/uploads/accounts/678917/images/Maya dress_Floral03.jpg
  https://cdn.jooraccess.com/img/uploads/accounts/678917/images/Maya dress_Floral04.jpg
  https://cdn.jooraccess.com/img/uploads/accounts/678917/images/Maya dress_Floral05.jpg
  

uj5u.com熱心網友回復：

您無法自動收集所有這些影像。
每個產品每次僅顯示 1 個影像并存在于頁面上。
為了更改影像/加載另一個影像，您必須單擊每個產品下方的縮略圖單選按鈕。這會導致一些 JS 為該產品加載另一個影像。
換句話說，其他未顯示的影像在頁面上不存在，直到通過單擊單選按鈕加載它們 - 每個產品下方的縮略圖。

標籤：Python html 硒 网页抓取 美丽的汤

上一篇：Selenium找不到表

下一篇：使用Selenium和Python查找所有帶有href標記且包含特定文本的元素