コンテンツにスキップ

XPath でクラスごとに要素を選択する方法: 究極ガイド

Web サイトからデータを抽出しようとしている場合は、クラスに基づいて特定の要素を選択する必要がある可能性があります。クラスは、HTML 内の要素を分類およびスタイル設定するための基本的な方法です。幸いなことに、XPath はクラス属性によって要素を選択する強力な方法を提供します。

この詳細なガイドでは、XPath を使用してクラスごとに要素を選択する方法を正確に説明します。初心者でも経験豊富な Web スクレイパーでも、この記事を読み終える頃には、HTML ドキュメントを巧みにナビゲートし、必要な要素を正確にターゲットできるようになります。始めましょう!

XPath の簡単な要約

クラス セレクターについて説明する前に、XPath とは何か、そしてそれがどのように機能するかを簡単に確認してみましょう。 XPath は、XML または HTML ドキュメント内のノードを移動および選択するために使用されるクエリ言語です。これにより、タグ名、属性、位置などに基づいて特定の要素を正確に指定する式を作成できます。

XPath について知っておくべき重要な点がいくつかあります。

  • XPath は、ドキュメントをルート ノードとそこから分岐する子ノードを含むツリー構造のように扱います。
  • 式は左から右に評価されます
  • スラッシュ (/) はノード間を移動するために使用されます
  • 要素は名前に基づいて選択できます (例: //div すべてを選択 <div> 要素)
  • 角括弧内の述語を使用すると、より正確な選択が可能になります (例: //div[@id=‘main‘] 選択する <div> ID が「main」の要素)

この基礎が整ったので、クラスと、それを XPath 式で活用する方法に注目してみましょう。

HTML クラスを理解する

クラスは、要素に 1 つ以上のクラス名を割り当てることができる HTML 属性です。これらは主に CSS でのスタイル設定に使用されますが、Web スクレイピング時に特定の要素をターゲットにする場合にも非常に役立ちます。

2 つのクラスを持つ段落要素の例を次に示します。

<p class="highlight text-center">This is some text.</p>

この場合、 <p> 要素には、「highlight」と「text-center」という 2 つのクラスが適用されます。要素には任意の数のクラスを含めることができ、class 属性値ではスペースで区切られます。

留意すべき点の 1 つは、クラス名では大文字と小文字が区別されるということです。それで class="highlight" & class="Highlight" 2 つの異なるクラスとみなされます。

HTML クラスが何であるかを理解したところで、XPath を使用してクラスに基づいて要素を選択する方法を見てみましょう。

XPath でのクラスによる要素の選択

XPath には、クラス属性によって要素を選択する主な方法が 2 つあります。

  1. contains() 関数の使用
  2. クラス名の正確な一致

これらのそれぞれのアプローチをさらに詳しく見てみましょう。

アプローチ 1: contains() 関数の使用

  contains() 関数を使用すると、クラス属性を持つ要素を選択できます 含まれています 特定のクラス名。基本的な構文は次のとおりです。

//element[contains(@class,‘classname‘)]

たとえば、すべてを選択するには <div> 「container」クラスを持つ要素の場合は、次のように使用します。

//div[contains(@class,‘container‘)]  

  contains() この関数にはいくつかの重要な特徴があります。

  • 大文字と小文字が区別されます (そのため、「コンテナ」と「コンテナ」は別のものとして扱われます)
  • クラス名はクラス属性値のどこにでも使用できます。
  • 指定されたクラスが含まれている限り、要素には他のクラスも適用できます。

So contains(@class,‘container‘) 次のような要素に一致します:

<div class="container"></div>
<div class="wrapper container card"></div>
<div class="container highlighted"></div>

しかし、そうなるだろう マッチ:

<div class="containery"></div>
<div class="wrapper"></div>

  contains() このアプローチは多用途であり、オブジェクトの一部として特定のクラスを持つ要素を一致させたい場合に良い選択となります。 セッションに クラスの。ただし、より正確にする必要がある場合は、次のアプローチの方が望ましい場合があります。

アプローチ 2: クラス名の正確な一致

クラス属性を持つ要素を選択するには、 正確に 特定の値に一致する場合は、次の構文を使用できます。

//element[@class=‘classname‘]

たとえば、選択するには <p> クラスが正確に「ハイライト」である要素の場合は、次のように使用します。

//p[@class=‘highlight‘]

この式は次のように一致します。

<p class="highlight"></p>  

だがしかし:

<p class="highlight text-center"></p>
<p class="highlights"></p>
<p class="Highlight"></p>

ご覧のとおり、完全一致アプローチはより厳密です。 class 属性には以下を含める必要があります 照合するために指定されたクラス名。他のクラスは存在できず、大文字と小文字が正確に一致する必要があります。

このアプローチは、要素の選択を非常に正確にする必要があり、より大きなセットの一部としてクラスを含む要素が偶然一致することを避けたい場合に便利です。

XPath とクラス – 重要な考慮事項

XPath を使用してクラスごとに要素を選択する場合、留意すべき重要な点がいくつかあります。

  • クラス名では大文字と小文字が区別されます。 前述したように、「ハイライト」と「ハイライト」は別のクラス名として扱われます。 XPath 式の大文字と小文字が正確に一致していることを確認してください。

  • 要素は複数のクラスを持つことができます。 要素に複数のクラスがスペースで区切られて適用されることは非常に一般的です。の contains() このアプローチは、指定されたクラスが含まれている限り要素と一致します。 どこか クラス属性で。

  • 完全一致はより正確ですが、柔軟性が低くなります。 あなたが使用している場合 [@class=‘classname‘]、クラス属性は次のとおりです。 そのクラスが含まれています。他のクラスが適用されている場合、要素は一致しません。対照的に、 contains(@class,‘classname‘) クラスが属性値のどこかに存在する限り、一致します。

  • XPath は、ほとんどの Web スクレイピング ツールとライブラリでサポートされています。 BeautifulSoup または Scrapy で Python を使用している場合でも、Puppeteer または Cheerio で JavaScript を使用している場合でも、または別の言語/フレームワークを使用している場合でも、XPath 式を使用してデータを抽出できる可能性があります。クラス選択の構文は同じままです。

  • 大規模なスクレイピングではパフォーマンスが重要です。 XPath は非常に強力ですが、特により複雑な式の場合、CSS セレクターなどの他のメソッドよりも遅くなる可能性があります。大量のページをスクレイピングしている場合は、さまざまなアプローチをベンチマークして、どれが最高のパフォーマンスをもたらすかを確認する価値があります。

クラスセレクターのベストプラクティスとヒント

XPath クラス セレクターを最大限に活用するには、次のベスト プラクティスとヒントを考慮してください。

  • 目的を達成するための最も単純な表現を使用してください。 時には単純な //element[@class=‘classname‘] は、あなたが必要とすることすべてです。不必要な複雑さは避けてください。

  • 必要に応じて、クラス セレクターを他の基準と組み合わせます。 述語を使用して、複数の属性に基づいて要素を選択できます (例: //button[@class=‘primary‘ and @type=‘submit‘])、またはクラス セレクターと位置セレクターを組み合わせます (例: (//div[@class=‘row‘])[2] をクリックして 2 行目を選択します)。

  • サイトの HTML の変更に注意してください。 クラスはスタイル設定の目的でよく使用されます。つまり、クラスは ID などの他の属性よりも頻繁に変更される可能性があります。スクレイパーが壊れた場合は、対象とするクラスがまだページ上に存在することを再確認してください。

  • 相対 XPath を使用して、長い式の繰り返しを避けます。 すでに親要素を選択している場合は、ドット (.) のように、その要素に関連する子を選択します。 //div[@class=‘container‘]/./p.

  • 特定の使用例については、CSS セレクターや正規表現などの他の方法を検討してください。 XPath は多用途ですが、場合によっては、別のアプローチの方が簡単または高速である場合があります。 CSS セレクターはパフォーマンスが高く、基本的な選択タスクに適しています。正規表現は、パターン マッチングやテキスト コンテンツからのデータの抽出に役立ちます。

クラス選択例

Python を使用して実際にクラスを選択する例をいくつか見てみましょう。 lxml としょうかん。

次の HTML があるとします。

<html>
    <body>
        <div class="container">
            <p class="highlight">Paragraph 1</p>
            <p>Paragraph 2</p>
            <p class="highlight">Paragraph 3</p>
        </div>
    </body>  
</html>

すべてを選択するには <p> 「ハイライト」クラスの要素を使用できます。 contains():

from lxml import html

tree = html.fromstring(html_string)
highlighted_paragraphs = tree.xpath(‘//p[contains(@class,"highlight")]‘)

for paragraph in highlighted_paragraphs:
    print(paragraph.text)

# Output: 
# Paragraph 1
# Paragraph 3

のみを選択したい場合は、 <p> クラスが存在する要素 正確に 「ハイライト」の場合は、次のように使用します。

exact_match_paragraphs = tree.xpath(‘//p[@class="highlight"]‘)

を選択するには <div> 要素を見つけてから <p> 要素内に「highlight」クラスが含まれている場合は、相対 XPath を使用できます。

div = tree.xpath(‘//div[@class="container"]‘)[0]
highlighted_paragraphs = div.xpath(‘./p[contains(@class,"highlight")]‘)

すべてをまとめる

このガイドでは、XPath を使用してクラスごとに要素を選択する方法を詳しく説明しました。 contains() 関数と正確なクラス名の一致を使用する 2 つの主なアプローチと、重要な考慮事項、ベスト プラクティス、および例について説明しました。

要約すると:

  • XPath は、HTML/XML ドキュメント内の要素を選択するための強力なクエリ言語です。
  • クラスは、多くの場合、スタイル設定や選択を目的として、要素にカテゴリを割り当てる方法です。
  •   contains(@class,‘classname‘) このアプローチは、指定されたクラスをクラス属性値の一部として含む要素を選択します。
  •   [@class=‘classname‘] このアプローチは、クラス属性が指定されたクラスと正確に一致する要素を選択します
  • XPath クラス セレクターは大文字と小文字が区別され、他の基準または相対セレクターと組み合わせることができます。
  • 目的を達成する最も単純な表現を選択し、時間の経過によるサイトの HTML の変更に注意することが重要です。

この知識があれば、XPath とクラス セレクターを使用してさまざまな Web スクレイピングの課題に取り組む準備が整います。初心者でも熟練のプロでも、必要な要素を正確にターゲットにする方法を理解することは必須のスキルです。

これらのテクニックを実践するときは、常に Web サイト所有者を尊重し、適用されるサービス利用規約または robots.txt ファイルに従うことを忘れないでください。ハッピースクレイピング!

参加する

あなたのメールアドレスは公開されません。 必須フィールドは、マークされています *