Python(+BeautifulSoup)のスクレイピングでCSSセレクタを使う時にスペースは省略出来ない?

公開日:2018-11-19
最終更新:2018-11-23

概要と環境

ほぼタイトル通り。

  • Python3
  • BeautifulSoup4

でスクレイピングやってたら「あっれれ~?」という事があったので..

こういう感じ

Beautiful Soup 4.4.0 documentation - CSS selectors
BeautifulSoupというPythonのライブラリがあるのですが、
その中にページ上の要素を得るために用意されているselect()というメソッドがあります。
要素を得る手法は他にも幾つかあるのですが、ちょっと複雑な所をピンポイントで取りたかったので、
JavaScriptで言う所のquerySelectorAll()と同じ感覚で使えるコレ(selectメソッド)を用いました。

意図が伝わらなかったらごめん野菜(´・ω・`)

import requests //←記事には関係ないけど、このライブラリすき
from bs4 import BeautifulSoup //←今回の主役

'''
このへん中略
'''

# _res.txt には、返ってきたwebページのテキストデータが入っている。
_local_soup = BeautifulSoup(_res.text , "html.parser")
_target_nodes = _local_soup.select("section.statusArea_pmf2>h3+div")
#↑のCSSセレクタで、対象ノードが得られることが期待される
print(_target_nodes)
# ↑でもなぜか [] が出力される(中身からっぽ)

CSSセレクタで半角スペースを用いなかったのが原因

# ×空で返ってきた方。
_local_soup.select("section.statusArea_pmf2>h3+div")
# 〇期待通り要素が得られた方
_local_soup.select("section.statusArea_pmf2 > h3 + div")

半角スペースを用いる事で、無事期待通り要素群の入った配列が得られました (´∀`)b

いつも雰囲気で使っている、この + とか > とかって名前なんていうんだっけ...
と呼び方を調べたら、結合子と呼ぶみたいです。

参考:mozilla.org - CSSセレクター

この書き方はCSS界での作法なのかしら?

「そもそも、CSSセレクタの結合子を半角スペース開けずに書く事自体がナンセンスなのだろうか」
...と思ってちょろっと調べたけど、よくわかりませんでした。

少なくとも、(Chromeの)JavaScriptでアレコレする分には、半角スペース不要だったんですよね。
document.querySelector("section.statusArea_pmf2>h3+div");
みたいに書いても普通に要素取れたので Σ(´ ` )

まぁ、Pythonとjsという異なる言語間で取り扱っているとはいえ、
同じCSSセレクタの書き方でも、OKな物とNGな物が出てくるのはちょっと意外でした

余談

色々調べがてら漁ってたら、自分に馴染みのないセレクタ結合子が...

mozilla.org - CSSセレクター / 一般兄弟結合子(続く兄弟結合子)
mozilla.org - CSSセレクター / 列結合子 ※草案段階

覚えておいた方が良いんでしょうけれども...うごご... orz

記事が少しでもいいなと思ったらクラップを送ってみよう!
57
+1
ひげさんのチラ裏だったりカンニングペーパーだったり学習ノートだったりする所です。

よく一緒に読まれている記事

0件のコメント

ブログ開設 or ログイン してコメントを送ってみよう
目次をみる

技術ブログをはじめよう

Qrunch(クランチ)は、ITエンジニアリングに携わる全ての人のための技術ブログプラットフォームです。

技術ブログを開設する

Qrunchでアウトプットをはじめよう

Qrunch(クランチ)は、ITエンジニアリングに携わる全ての人のための技術ブログプラットフォームです。

Markdownで書ける

ログ機能でアウトプットを加速

デザインのカスタマイズが可能

技術ブログ開設

ここから先はアカウント(ブログ)開設が必要です

英数字4文字以上
.qrunch.io
英数字6文字以上
ログインする