使用xpath提取图像

Question

我一直试图从这个网站获取信息https://www.leadhome.co.za/property/poortview-ah/roodepoort/lh-95810/magnificent-masterpiece-in-poortview-，但我在获取该房产的所有图像方面遇到了问题；更具体地说是URL

这是该类的外观：

<div class="lazy-image listing-slider-carousel-item lazy-image-loaded">
   <div class="lazy-image-background" style="background-image: url(&quot;https://s3-eu-west-1.amazonaws.com/leadhome-listing-photos/025c90ab-9c87-47d5-b11c-1cfbce3f67f2-md.jpg&quot;);"></div>
</div>

到目前为止，我所拥有的：

        for item in response.xpath('//div[@class="lazy-image-background"]/*[starts-with(@style,"background-image")]/@style').getall():
            yield {"image_link":item}

但不幸的是，这是空的。有关于我做错了什么的提示吗？ 谢谢大家!

Answer 1

/*要查找子元素，请尝试不使用它

response.xpath('//div[@class="lazy-image-background"][starts-with(@style,"background-image")]')

Answer 2

如果您检查此网页的原始html源代码（google Chrome webbrowser上的CTRL+U，！！！不是来自Crhome developer tools/elements部分的html代码）
您将看到两件重要的事情：

1. 像<div class="lazy-image listing-slider-carousel-item lazy-image-loaded">这样的标记中的图像以及其他数据不存在于这些html标记中
2. 存储在script标记和window.REDUX_INITIAL_STATEjavascript变量内的所有数据：
   
   

在这种情况下，我们可以使用python的内置json模块将javascript变量中的数据转换为基本python dict格式。
此任务最复杂的部分是将script标记的内容正确地适配到json.loads函数中。严格来说，它应该是在window.REDUX_INITIAL_STATE =之后和下一个javascript操作之前的文本（在本例中是在最新的;符号之前）。 因此，我们将获得以下代码：

def parse(self, response):
    script_tag = [script for script in response.css("script::text").extract() if "window.REDUX_INITIAL_STATE = {" in script]
    script_data = json.loads(script_tag[0].split("window.REDUX_INITIAL_STATE = ")[-1][:-1], encoding="utf-8")

如以下调试器屏幕截图所示，所有数据均已成功转换： 作为字典列表存储在script_data['app']['listing']['listing']['entity']['lh-95810']['images']中的图像： lh-95810是实体id，因此在更新的代码中，将单独选择此实体id，以便能够在其他页面中使用它：

def parse(self, response):
    script_tag = [script for script in response.css("script::text").extract() if "window.REDUX_INITIAL_STATE = {" in script]
    script_data = json.loads(script_tag[0].split("window.REDUX_INITIAL_STATE = ")[-1][:-1], encoding="utf-8")
    entity_key = [k for k in script_data['app']['listing']['listing']['entity'].keys()]
    images = [image["medium"] for image in script_data['app']['listing']['listing']['entity'][entity_key[0]]['images']]

本网站使用javascript在网页上呈现数据。任何javascript格式的内容都源于原始html代码。 这种方法只使用内置的json模块，不需要css或Xpath选择器

Answer 3

您可以将xpath用作：

//div[@class="lazy-image-background" and contains(@style, "background-image: url")]

这将获得页面上包含带有url的图像的所有div元素。然后，您可以添加一些代码来从每个元素提取图像url