Как получить доступ к HTML DOM Property с помощью Xpath или Css Selector в Selenium

Question

Selenium ver 3.141. Chrome драйвер, Windows 10

Здравствуйте, цель состоит в том, чтобы извлечь значение свойства HTML DOM, в частности, id, href и data-download-file-url для каждого из изображений, отображаемых из этот веб-сайт (Этот сайт предназначен исключительно для образовательных целей). Хотя существует другой подход, который можно применить для извлечения всех этих элементов, но в настоящее время я использую подход find_elements_by_xpath. Тем не менее, я приветствую, если кто-то хотел бы предложить более эффективный подход, о котором я не знаю.

На вышеупомянутом веб-сайте Xpath к целевому элементу равен

/html/body/main/section[2]/div/div/figure[X]/div

с большой буквы X обозначает метку изображения, которая принимает значение от 1 до 50, для вышеупомянутого веб-сайта. Каждая фигура подпадает под класс showcase__content.

Я пробовал следующие строки

titles_element = browser.find_elements_by_xpath("//div[@class='showcase__content']/a")
# List Comprehension to get the actual repo titles and not the selenium objects.
titles = [x.text for x in titles_element]

Однако в titles_element свойства dom не извлекаются. Следовательно, titles производят [].

Я испытываю желание попробовать также следующее, но вместо этого это дает мне ошибку

titles_element = browser.find_elements_by_xpath("//figure[1]/div[@class='showcase__content']//@data-download-file-url")

Я действительно ценю, если кто-то может пролить свет на это problem.

Пример свойства DOM для рисунка 1. Все свойства имеют розовый цвет. https://drive.google.com/open?id=190q615C3uXLZUQNI8K4AJYL3Slii1ktO

Answer 1

Попробуйте (пояснение в комментариях к коду):

from selenium import webdriver
from time import sleep
driver = webdriver.Chrome()

driver.get("https://www.freepik.com/search?dates=any&format=search&page=1&query=Polygonal%20Human&sort=popular")

sleep(1)

# get the all "a" elements by xpath (class name), so you can use find_elements_by_class_name() instead if you want
titles_element = driver.find_elements_by_xpath("//a[@class='showcase__link']")


# loop through the elements and extract the id, href, and data-download-file-url attributes
for element in titles_element:
    id = element.get_attribute('id')
    href =  element.get_attribute('href')
    file_url= element.get_attribute('data-download-file-url')
    print (id, href, file_url)

Вывод:

dtl-7200954 https://www.freepik.com/free-vector/innovative-medicine-abstract-composition-with-polygonal-wireframe-images-human-hand-carefully-holding-heart-vector-illustration_7200954.htm#page=1&query=Polygonal%20Human&position=0 https://www.freepik.com/download-file/7200954
dtl-4228610 https://www.freepik.com/premium-vector/particles-geometric-art-line-dot-engineering_4228610.htm#page=1&query=Polygonal%20Human&position=1 https://www.freepik.com/download-file/4228610
dtl-7379608 https://www.freepik.com/free-vector/polygonal-wireframe-business-strategy-composition-with-glittering-images-human-hand-incandescent-lamp-with-text_7379608.htm#page=1&query=Polygonal%20Human&position=2 https://www.freepik.com/download-file/7379608
dtl-7200952 https://www.freepik.com/free-vector/two-luminescent-polygonal-wireframe-human-hands-stretching-towards-each-other_7200952.htm#page=1&query=Polygonal%20Human&position=3 https://www.freepik.com/download-file/7200952
.
.
.

Answer 2

Теперь я могу получить тег <img> и получить URL-адрес картинки:

from selenium import webdriver

driver = webdriver.Chrome()
driver.get("https://www.freepik.com/search?dates=any&format=search&page=1&query=Polygonal%20Human&sort=popular")
# result = WebDriverWait(driver,5).until(EC.element_located_to_be_selected(driver.find_elements_by_css_selector("[class='lzy landscape lazyload--done']"))) 
result = driver.find_elements_by_css_selector("[class='lzy landscape lazyload--done']") # the class always be "lzy landscape lazyload--done"
for i in result:
    print(i.get_attribute('src'))

Результат:

https://img.freepik.com/free-vector/innovative-medicine-abstract-composition-with-polygonal-wireframe-images-human-hand-carefully-holding-heart-vector-illustration_1284-30757.jpg?size=626&ext=jpg
https://img.freepik.com/free-vector/computer-generated-rendering-hand_41667-189.jpg?size=626&ext=jpg
https://img.freepik.com/free-vector/polygonal-wireframe-business-strategy-composition-with-glittering-images-human-hand-incandescent-lamp-with-text_1284-32265.jpg?size=626&ext=jpg
https://img.freepik.com/free-vector/particles-geometric-art-line-dot-engineering_31941-119.jpg?size=626&ext=jpg
........

Или получить showcase__link:

result = driver.find_elements_by_css_selector("[class='showcase__link']")
for i in result:
    print(i.get_attribute('href'),i.get_attribute('id'),i.get_attribute('data-download-file-url'))