ruby - Ruby/Nokogiri を検査すると、クラスよりも多くのことが明らかになります。私は余分なアイテムが必要です

Question

次のコードでは:

page = Nokogiri::HTML($browser.html)
page_links = page.css("a").select
page_links.each do |link|
    if not link.nil?
        if not link['href'].nil? and !!link['href']["/about"]
            puts link.class
            puts link.inspect
        end
    end
end

link.class出力は次のとおりです。

Nokogiri::XML::Element
#<Nokogiri::XML::Element:0x..fdb623d3c name="a" attributes=[#<Nokogiri::XML::Attr:0x..fdb623c7e name="action-type" value="8">, #<Nokogiri::XML::Attr:0x..fdb623c74 name="class" value="a-n g-s-n-aa g-s-n-aa I8 EjFvwd VP">, #<Nokogiri::XML::Attr:0x..fdb623c6a name="target" value="_top">, #<Nokogiri::XML::Attr:0x..fdb623c60 name="href" value="./104882190640970316938/about">] children=[#<Nokogiri::XML::Text:0x..fdb623792 "PetSmart Winchester">]>

そしてlink.inspect、以下を出力します。

Nokogiri::XML::Element
#<Nokogiri::XML::Element:0x..fdb623666 name="a" attributes=[#<Nokogiri::XML::Attr:0x..fdb6235a8 name="action-type" value="8">, #<Nokogiri::XML::Attr:0x..fdb62359e name="class" value="a-n g-s-n-aa g-s-n-aa Gbb EjFvwd VP">, #<Nokogiri::XML::Attr:0x..fdb623594 name="target" value="_top">, #<Nokogiri::XML::Attr:0x..fdb62358a name="href" value="./104882190640970316938/about">] children=[#<Nokogiri::XML::Element:0x..fdb6230bc name="div" attributes=[#<Nokogiri::XML::Attr:0x..fdb62304e name="style" value="height:110px; width:110px;">] children=[#<Nokogiri::XML::Element:0x..fdb622e1e name="img" attributes=[#<Nokogiri::XML::Attr:0x..fdb622db0 name="style" value=" height: 110px; width: 110px;">, #<Nokogiri::XML::Attr:0x..fdb622da6 name="class" value="mja">, #<Nokogiri::XML::Attr:0x..fdb622d9c name="src" value="https://mts0.google.com/vt/data=TSwRVVf0DGlwBQqarpBU3wUz-i2gqbuWEbxTilWKINf30Au9l0oLM_ojk4KI0oPUi8kL5fJaJWte45O3abOXMzE3L7xDBg">]>]>]>

Nokogiri では、でリンクテキストにlink.content、でリンク URL にアクセスできますlink['href']。しかし、これらの方法はどちらも、検査結果からの画像ソースには機能しません。

srcこのサンプルコード内でインスペクトが明らかにしているimgを取得するにはどうすればよいですか?

更新: ここに HTML コードがあります

<div class="HWb">
<div class="erb">
    <div class="ubb">
        <div role="button" class="a-f-e c-b c-b-T c-b-Oe c-b-H-ra L0a X9" tabindex="0"
        data-placeid="6817440171144926830" data-source="lo-gp" data-inline="true"
        data-tooltip-delay="600" data-tooltip-align="b,l" data-oid="104882190640970316938"
        data-size="small">
            <span class="TIa c-b-fa"></span>
        </div>
    </div>
    <h3 class="drb">
        <a href="./104882190640970316938/about" target="_top" class="a-n g-s-n-aa g-s-n-aa I8 EjFvwd VP"
        action-type="8">PetSmart Winchester</a>
    </h3>
</div>
<div class="Qbb">
    <span class="vqb SIa">Pet Store</span>
    <span class="lja SIa">
        <a href="//www.google.com/url?sa=D&amp;oi=plus&amp;q=https://maps.google.com/maps?q%3DPetsmart%2Bloc:22601%26numal%3D1%26hl%3Den-US%26gl%3DUS%26mix%3D2%26opth%3Dplatter_request:2%26ie%3DUTF8%26cid%3D6817440171144926830%26iwloc%3DA"
        target="_blank" class="a-n uqb">2310 Legge Boulevard, Winchester, VA</a>
    </span>
    <span class="SIa">(540) 662-5544</span>
</div>
<div class="crb">
    <div class="Pbb a-f-e">
        <div class="Fbb">
            <div class="cca">
                <div class="tob">
                    <div class="xob">“Do not bother with the grooming salon, the staff are unusually stupid.
                        Otherwise the store is a typical petsmart.”&lt;/div>
                </div>
            </div>
        </div>
    </div>
    <div class="dWa">
        <a href="./104882190640970316938/about" target="_top" class="a-n g-s-n-aa g-s-n-aa Gbb EjFvwd VP"
        action-type="8"><div style="height:110px; width:110px;"><img src="https://mts0.google.com/vt/data=TSwRVVf0DGlwBQqarpBU3wUz-i2gqbuWEbxTilWKINf30Au9l0oLM_ojk4KI0oPUi8kL5fJaJWte45O3abOXMzE3L7xDBg" class="mja" style=" height: 110px; width: 110px;"></div></a>
    </div>
</div>

score 1 · Accepted Answer

HTML がないとかなり難しくなりますが、inspect出力を掘り下げると、適切な HTML スニペットが得られたと思います。

これは、<img src="...">タグに到達する方法です。

require 'nokogiri'

doc = Nokogiri::HTML(<<EOT)
<a action-type="8" class="a-n g-s-n-aa g-s-n-aa Gbb EjFvwd VP" target="_top" href="./104882190640970316938/about">
    <div style="height:110px; width:110px;">
        <img style=" height: 110px; width: 110px;" class="mja" src="https://mts0.google.com/vt/data=TSwRVVf0DGlwBQqarpBU3wUz-i2gqbuWEbxTilWKINf30Au9l0oLM_ojk4KI0oPUi8kL5fJaJWte45O3abOXMzE3L7xDBg">
    </div>
</a>
EOT

doc.at('img')['src'] # => "https://mts0.google.com/vt/data=TSwRVVf0DGlwBQqarpBU3wUz-i2gqbuWEbxTilWKINf30Au9l0oLM_ojk4KI0oPUi8kL5fJaJWte45O3abOXMzE3L7xDBg"

時間をかけて質問を改善し、それがうまくいかない場合は詳細を提供する必要があります。

タグのインスタンスが 0 個、1 個、または 1 個以上あるかわからない場合はsearch、配列のように機能する NodeSet を返すため、を使用します。

doc.search('img').map{ |img| img['src'] }

<img src="...">ドキュメント内のすべての値を配列で返します。それらを簡単に反復するかempty?、ヒットがないかどうかを確認するために使用できます。

doc.search('img').map{ |img| img['src'] }.each do |src|
  # do something with src if any are found.
end

<img>パラメーターのないタグがある可能性がある場合は、反復する前にそれらをフィルターで除外するためにsrc="..."使用します。compact

doc.search('img').map{ |img| img['src'] }.compact.each do |src|
  # do something with src if any are found.
end

0 または 1 回の発生のみが予想される場合は、次を試してください。

src = doc.at('img') && doc.at('img')['src']

次のように:

doc = Nokogiri::HTML(<<EOT)
<html><body><p>foo</p>
<img src="blah">
<p>bar</p></body></html>
EOT
src = doc.at('img') && doc.at('img')['src']
=> "blah"

または、srcパラメーターなし:

doc = Nokogiri::HTML(<<EOT)
<html><body><p>foo</p>
<img>
<p>bar</p></body></html>
EOT
src = doc.at('img') && doc.at('img')['src']
=> nil

<img>またはタグが完全に欠落している:

doc = Nokogiri::HTML(<<EOT)
<html><body><p>foo</p>
<p>bar</p></body></html>
EOT
src = doc.at('img') && doc.at('img')['src']
=> nil

ifブロックを引き続き使用する場合:

if doc.at('img')
  puts doc.at('img')['src']
end

あなたのことを達成します：

if not doc.at('img').nil?
  puts doc.at('img')['src']
end

可読性を維持しながら、より簡単で簡潔な方法で達成します。

2 つのルックアップを行うことの欠点atは、特にループ内で、大きなドキュメントではコストがかかる可能性があることです。すべての Perlish を取得して使用できます。

if (img = doc.at('img'))
  puts img['src']
end

しかし、それは実際には Ruby のやり方ではありません。明確さと長期的なメンテナンスのために、私はおそらく次のものを使用します：

img = doc.at('img')
if (img)
  puts img['src']
end

しかし、それは変数を公開し、img物事を混乱させます。その時点で、それはプログラマーの選択です。

score 1 · Accepted Answer

2 つの出力は、2 つの異なるリンクのように見えます (つまり、link.classとlink.inspectfor each の両方)。

2 番目の出力で画像ソースを取得することについて話していると仮定すると、HTML は次のようになります。

<a href="href"><div><img src="image_src" /></div></a>

それが正しいと仮定すると、次のことを行う必要があります。

puts link.at_css("img")['src']

score 0 · Accepted Answer

link.inspectから結果を取得すると、文字列であるため、正規表現を使用して画像の URL を取得できることがわかりました。

link.inspect[/http.*com.*"/].chop # Since all other urls are relative ./

これが最善の方法だとは思いません。最初に他の回答を試してみます。

ruby - Ruby/Nokogiri を検査すると、クラスよりも多くのことが明らかになります。私は余分なアイテムが必要です

3 に答える 3

Related

Reference