打开标签内的元素

Question

我正在编写一个蜘蛛来使用 scrapy 下载子版块首页上的所有图像。为此，我必须找到图像链接以从中下载图像并使用 CSS 或 XPath 选择器。

经检查，提供了链接，但所有链接的 HTML 如下所示：

<div class="expando expando-uninitialized" style="display: none" data-cachedhtml=" <div class="media-preview" id="media-preview-7lp06p" style="max-width: 861px"> <div class="media-preview-content"> <a href="https://i.redd.it/29moua43so501.jpg" class="may-blank"> <img class="preview" src="https://i.redditmedia.com/Q-LKAeFelFa9wAdrnvuwCMyXLrs0ULUKMsJTXSf3y34.jpg?w=861&amp;s=69085fb507bed30f1e4228e83e24b6b2" width="861" height="638"> </a> </div> </div> " data-pin-condition="function() {return this.style.display != 'none';}"><span class="error">loading...</span></div>

据我所知，似乎所有新元素都在<div> 元素的开始标记内初始化。您能否解释一下这里到底发生了什么，以及如何从中提取图像信息？

*抱歉，我不太清楚如何正确格式化 html 代码，但确实没有太多要格式化的内容，因为它就是一个大标签。

Answer 1

如何读取损坏的属性，data-cachedhtml

HTML 是一团糟。在使用 XPath 之前，请尝试 How to parse invalid (bad / not well-formed) XML? 中列出的技术以获得可行的标记。可能需要三遍：

1. 清理标记混乱。
2. 获取data-cachedhtml的属性值。
3. 使用 XPath 提取图片链接。

XPath 部分

对于以这种形式去除的data-chachedhtml：

<div class="media-preview" id="media-preview-7lp06p" style="max-width: 861px">
  <div class="media-preview-content">
    <a href="https://i.redd.it/29moua43so501.jpg" class="may-blank">
      <img class="preview" src="https://i.redditmedia.com/elided"
           width="861" height="638"/>
    </a>
  </div>
  <span class="error">loading...</span>
</div>

1. 此 XPath 将检索预览图像链接：

   //a/img/@src
   

   （即img元素的所有src属性，a元素的子元素。）

或

1. 此 XPath 将检索点击图像链接：

   //a[img]/@href
   

   （即具有img 子元素的a 元素的所有href 属性。）

---