空白行を削除し、指定する値を取得したい

前提・実現したいこと

空白行を削除し、指定するidの子要素であるpタグをすべて取得したいです。

発生している問題・エラーメッセージ

スクレイピングしたいサイトのHTMLが下記のようになっています。

html
1  ...省略...  
2  <div id="hogehoge">
3    <p>hoge1</p>
4    <p>hoge2</p>
5    <p>hoge3</p>
6    <!--comment-->
7    <!--comment-->
8    <p>hoge4</p>
9    <p>hoge5</p>
10  </div>

id="hogehoge"のpタグをすべて取得したいのですが、コメントがあるためhoge1～hoge3までのpタグしか取れませんでした。

そこで、コメントを削除するプログラムを追加したところ、コメントはなくなったのですが下記のように空白行ができてしまいました。
空白行があるため、取得できるタグはhoge1~hoge3までと上記と変わりませんでした。

html
1  ...省略...  
2  <div id="hogehoge">
3    <p>hoge1</p>
4    <p>hoge2</p>
5    <p>hoge3</p>
6    
7    
8    <p>hoge4</p>
9    <p>hoge5</p>
10  </div>

error
1AttributeError: 'str' object has no attribute 'select'

該当のソースコード

Python3
1import requests
2from bs4 import BeautifulSoup, Comment
3
4
5response = requests.get('https://hogehoge.com/index.html')
6response.encoding = response.apparent_encoding # 日本語の文字化けを解消
7soup = BeautifulSoup(response.content, 'html.parser') # BeautifulSoupの初期化
8
9print(soup.title.text) #タイトルを表示
10
11#コメントの除去
12comments = soup.findAll(text=lambda text:isinstance(text, Comment))
13[comment.extract() for comment in comments]
14
15# scriptタグとstyleタグを取り除く
16for script in soup(["script", "style"]):
17    script.decompose()
18
19# 空白行を取り除いて、値を取得する
20test = soup.prettify().select('hogehoge')　#ここがダメっぽい。

当方、プログラム初心者のため優しくご教示いただきたく存じます。

jun68ykt

2020/02/09 05:46

質問の回答ではないのでこちらに書きますが、ご質問の発端である > コメントがあるためhoge1～hoge3までのpタグしか取れませんでした。というのが疑問です。コメントがあっても取れると思います。以下はその確認のためのサンプルです。 https://repl.it/@jun68ykt/Q240331 画面上部の [run]ボタンをクリックすると実行されます。

退会済みユーザー

2020/02/09 07:03

試していただきありがとうございます。本当ですね... 似たようなサイトでスクレイピングしてみたら、普通に取得できました。質問は修正せずに、もう少し回答を待ってみようと思います。

行動規範の内容に同意します

回答2件

こんにちは

質問への追記、修正依頼からも確認させて頂きましたが、基本的には

python
1soup.select("#hogehoge > p")

で、コメント行の下の  も取得できるはずですが、取ってこれない理由として考えられるケースがあるので、それを回答します。
どういう状況を推測できるかというと、

html
1 <div id="hogehoge">
2    <p>hoge1</p>
3    <p>hoge2</p>
4    <p>hoge3</p>
5    <!--comment-->
6    <!--comment-->
7    <p>hoge4</p>
8    <p>hoge5</p>
9  </div>

の例でいえば、5つのの  のうち、はじめの3つはサーバーサイドで作られており、コメント行の下にある2つは、フロントエンド側からAJAXなどで取得しているのでは？ということです。

もしそういうことになっていると、そのサイトをブラウザで見た限りでは、確かに5つのに囲まれている5個の各テキストが表示されているのを目視で確認でき、ブラウザの開発ツールで確認しても、5つの が存在しているものと思います。しかし、BeautifulSoup　でスクレイピングする対象のＨＴＭＬには、ブラウザで表示させたときのＡＪＡＸで追加された2個は含まれておらず、そのため、ブラウザに展開されたＨＴＭＬと比較して、コメントより下の  が取得できないという解釈になるものと思います。

もし、上記のようにフロントエンドのJavaScriptによって、追加の要素が付加されている可能性があり、かつフロントエンドのＪＳの実行結果も含めてブラウザに展開されるＨＴＭＬをスクレイピングの対象にしたいのであれば、Selenium を使ってみることを検討するとよいかもしれません。

Qiitaにもいくつか、「Seleniumでスクレイピングしてみました」という趣旨の記事がいくつか投稿されています。

以上、参考になれば幸いです。

投稿2020/02/09 09:02

jun68ykt

総合スコア9058

退会済みユーザー

2020/02/09 09:42

回答ありがとうございます。なるほど、そういう場合もあるのですね... 今後、スクレイピングをする際に参考にさせていただきます。

jun68ykt

2020/02/09 09:50

どういたしまして。参考になれば幸いです。

行動規範の内容に同意します

ベストアンサー

id が hogehoge である要素の子要素の p タグを取得する CSS セレクタは、#hogehoge > p ではないでしょうか。
子孫要素も含む場合は #hogehoge p です。

コメントやスクリプトタグを削除するコードがありますが、CSS セレクタでほしい要素だけ選択すればいいので、その処理はなくていいと思います。

スタイルシートリファレンス（目的別）

python
1html = """
2<div id="hogehoge">
3    <p>hoge1</p>
4    <p>hoge2</p>
5    <p>hoge3</p>
6
7
8    <p>hoge4</p>
9    <p>hoge5</p>
10  </div>
11"""
12
13import requests
14from bs4 import BeautifulSoup
15
16soup = BeautifulSoup(html)
17p_tags = soup.select("#hogehoge > p")
18print(p_tags)

[<p>hoge1</p>, <p>hoge2</p>, <p>hoge3</p>, <p>hoge4</p>, <p>hoge5</p>]

追記

python
1from pprint import pprint
2
3import requests
4from bs4 import BeautifulSoup
5
6url = "https://www.itmedia.co.jp/keywords/security.html"
7
8res = requests.get(url)
9soup = BeautifulSoup(res.content)
10
11data = []
12for tag in soup.select("#kwdArticleBox p"):
13    a_tag = tag.select_one("a:has(> strong)")
14
15    if not a_tag.text:
16        # PR 記事の場合、構造が違うので場合分け
17        a_tag = tag.select("a")[2]
18
19    data.append({"title": a_tag.text, "url": a_tag["href"]})
20
21pprint(data)