Webページ上の要素を探すためのCSSセレクタの使い方

1. CSSセレクタを思い出そう

HTMLページの秘密をCSSセレクタで解き明かす世界へようこそ！CSSセレクタがページのスタイリングにだけ使用されると思っているとしたら、大間違い。それはスクレイピングの秘密兵器にもなるんだ。今日は、データを探して抽出するための強力なツールとして、CSSセレクタを見ていこう。

CSSセレクタは、HTMLの要素にアクセスするための便利な方法だ。そのおかげで、ページ上のどの要素を処理するのかを特定できるんだ。HTMLページが迷路だとしたら、CSSセレクタは出口を見つけるための赤い糸なんだ。

CSSセレクタの例

• タグ: p — 全ての <p> 要素（段落）を選択する。
• クラス: .classname — 指定されたクラスを持つ全ての要素を選択する。
• ID: #idname — 特定のIDを持つ要素を選択する。
• 組み合わせ: div > p — 全ての <div> の直接の子である <p> を選択する。

2. BeautifulSoupでセレクタを使う

BeautifulSoupでのCSSセレクタのない退屈な人生にさよならしよう！新しいアプローチを試そう。例えば、ウェブサイトで素晴らしい名言を集めて、それを面接で披露するとしよう。そのために使うのが select() メソッドだ。これがまさにCSSセレクタを使ったメソッドなんだよ。

select() と select_one() メソッド

select() メソッドは、セレクタに一致する全ての要素のリストを返してくれる。一方 select_one() は、セレクタに一致する最初の一つの要素を返す。まるで必要なものだけを届けてくれる検索エンジンみたいなものだね。

以下のような名言を含むHTMLページがあるとする：

<div class="quote">
    <h2 class="author">プーシキン</h2>
    <p class="text">アイ ダ プーシキン.</p>
    <a href="https://example.com" class="link">続きを読む</a>
</div>
<div class="quote">
    <h2 class="author">レーニン</h2>
    <p class="text">学べ、学べ、そしてさらに学べ.</p>
    <a href="https://example.com" class="link">続きを読む</a>
</div>
<div class="quote">
    <h2 class="author">スターリン</h2>
    <p class="text">人がいれば問題がある、人がいなければ問題はない.</p>
    <a href="https://example.com" class="link">続きを読む</a>
</div>

こんな感じでそれらを取得できるよ：

from bs4 import BeautifulSoup
import requests

# ページのHTMLコードを取得
response = requests.get('http://quotes.toscrape.com/')
soup = BeautifulSoup(response.text, 'html.parser')

# CSSセレクタを使用して全ての名言を探す
quotes = soup.select('.quote')

for quote in quotes:
    text = quote.select_one('.text').get_text()
    author = quote.select_one('.author').get_text()
    print(f'名言: {text}\\n著者: {author}\\n')

どう？まるで魔法みたいに便利じゃない？クラス .quote で名言として指定された全ての要素を取得し、 .text と .author を使ってその子要素から名言と著者のテキストを抽出するんだ。

3. CSSセレクタでの検索の例

いくつかの例を試してみて、CSSセレクタを使いこなせるようになろう。セレクタを使うとページ上のデータをより的確に検索することができるんだ。組み合わせて使えば、正確に必要なものを取得できる。

クラスとタグによるセレクタ

# メニュー内の全てのリンクを検索
menu_links = soup.select('nav.menu a')

for link in menu_links:
    print(link['href'])

IDによるセレクタ

# ページのメインヘッディングを取得
main_heading = soup.select_one('#main-heading')
print(main_heading.text)

セレクタの組み合わせ

# 強調されたセクション内の全ての文を検索
highlighted_sentences = soup.select('.highlighted p')

for sentence in highlighted_sentences:
    print(sentence.text)

4. エラーとその回避方法

スクレーパーとしての仕事は、いつも簡単というわけではない。以下のような場合にCSSセレクタが機能しないことがある：

• ページに動的なコンテンツがあり、必要な要素がJavaScriptを通じて読み込まれる場合。
• 存在しないセレクタにアクセスしている場合（例えば、クラスやIDの記述ミス）。
• HTML構造が変更され、必要な要素が見つからなくなる場合。

こうしたエラーを回避するために、最新で静的なHTMLドキュメントを使用し、セレクタの記述が正確であることを確かめよう。

実際の使い方

CSSセレクタを使用してデータ抽出の実際のプロジェクトに取り組む準備ができたね。このスキルは、価格分析ツールの作成やニュース取得、ウェブサイトの変更追跡などに役立つよ。このアプローチの利点は、ウェブサイトがCSSで見た目を変えたとしても、HTML構造に依存しているからコードが機能し続けることさ。

1

Опрос

BeautifulSoupの紹介,  31 уровень,  4 лекция

недоступен

BeautifulSoupの紹介

BeautifulSoupの紹介

Открыть