如何解析Nokogiri中的图像href

Question

我正在使用Nokogiri解析一个网页，并想解析出一个图像URL。这是我的设置：

require 'nokogiri'
require 'open-uri'
doc = Nokogiri::HTML(open('https://themeforest.net/search?sort=sales'))

如果我检查chrome上的页面，我可以看到以下代码块：

<div class="_2_3rp " style="padding-top:50.847457627118644%">            
<div style=""> 
<img class="_1xvs1" src="https://themeforest.img.customer.envatousercontent.com/files/274559780/screenshots/00-Preview.jpg?auto=compress%2Cformat&amp;fit=crop&amp;crop=top&amp;w=590&amp;h=300&amp;s=37354d884fd0f3b574238e013b4ea423"                                         
title="Avada | Responsive Multi-Purpose Theme"                    
alt="Avada | Responsive Multi-Purpose Theme" style="left: 0%;">            
</div>                                                                     
</div>

然而，当我运行时：

puts doc.search("//div[@class = '_2_3rp ']")

我得到以下信息：

<div class="_2_3rp " style="padding-top:50.847457627118644%"><div style="height:100%" class="lazyload-placeholder"></div></div>
<div class="_2_3rp " style="padding-top:50.847457627118644%"><div style="height:100%" class="lazyload-placeholder"></div></div>
.....
=> nil

为什么我没有得到img类，而是得到lazyload-placeholder？有没有什么方法可以让我克服这一点，并逃离图像占位符？

Answer 1

以下是我提出的测试断言所需的最小代码：

require 'nokogiri'
doc = Nokogiri::HTML(<<EOT)
<div class="12345">
<div>
<img class="67890" src="https://foo.bar">
</div>
</div>
EOT
doc.search('//div[@class=12345]').map(&:to_html)
# => ["<div class="12345">n" +
#     "    <div>n" +
#     "        <img class="67890" src="https://foo.bar">n" +
#     "    </div>n" +
#     "</div>"]
#     "</div>"]

看起来img标签就在那里。

您正在使用Nokogiri::XML进行解析。不要这样做，因为会发生严格的解析，而HTML不是严格的，如果HTML格式不正确，就会出现问题。