前回、クラスセレクタを紹介しましたが、クラスセレクタだけでは、同名のクラスがあると関係のない要素まで影響を受けてしまうという話をしました。
そこで、今回はセレクタを組み合わせてより精細に正確なスクレイピング範囲を特定する方法を紹介します。
今まで3つのセレクタを紹介してきましたが、セレクタは組み合わせることができます。
これは郵便の住所に似ています。
「鈴木 一郎」さんに郵便を出したい場合、「鈴木 一郎」とだけ書いては郵便は不達となります。
全国に「鈴木 一郎」さんはたくさんいるからです。
○○○県の○○○市○○○町○○○番地 鈴木 一郎のように書く必要があります。
同じ住所に「鈴木 一郎」さんが二人いる可能性は非常に低いので郵便はちゃんと届きます。
「○○○県」は日本に1つしかないので、IDセレクタに相当します。
「○○○市」や「○○○町」は同名の地域が全国に複数ある可能性があるので、都道府県を抜いてしまうと思わぬ場所に届いてしまう可能性があります。
そこで、重複が絶対ないと考えられる「○○○県」を付加するわけです。
セレクタは組み合わせるというのはこういうことです。
Yahoo! Japanの天気のパーソナルデータから温度だけを指定する場合はクラスの「.pbwtemperature」だけでしたが、もし仮に「pbwtemperature」というクラスが他にもあった場合は以下のようにします。
#pbtoday .pbwtemperature {
display: none;
}IDセレクタを追加して半角スペースで区切ってクラスセレクタを指定すればいいわけです。
半角スペースは「そのセレクタの階層下にある」という意味になります。
ただ、指定できるセレクタはそのHTML次第＝作者次第のところがあります。
そして、これはあまり意味がありませんが、このように指定しても大丈夫です。
body #pbtoday .pbwtemperatureただし「body」タグのような必ず存在するタグは指定する必要はなく省略が可能です。
注意点としてIDセレクタやクラスセレクタがまったくないHTMLもあったりします。その場合はIDセレクタもクラスセレクタも使えません。
タグセレクタだけで頑張るしかありません。
タグセレクタは以前紹介したように使用されているタグが複数存在する可能性があるので、漠然と指定しては使えません。
そこで、大事なのが「セレクタの関係性」によってセレクタを指定する方法です。
例えば、IDセレクタやクラスセレクタがまったくない場合は、タグセレクタとセレクタの関係性を使って以下のように指定します。
h1 div span意味は見出し1の「div」タグの下の「span」タグとなります。
かなり面倒ですが、このような形で指定するしかありません。