1. Podstawowe pojęcia CSS dla web-scrapingu
Aby skutecznie wykonywać web-scraping, zrozumienie struktury HTML i klas CSS na stronie to kluczowy element. Rozumiejąc, jak elementy stron są stylizowane i zorganizowane za pomocą CSS, można dokładniej wybrać potrzebne dane i je wyodrębnić. Omówimy, jak podłączenie CSS do HTML, użycie selektorów, a także atrybuty style, class, id i name pomagają w pracy ze strukturą stron internetowych dla scrapingu.
CSS jest odpowiedzialny za stylizację stron internetowych, jednak dla celów web-scrapingu, możemy traktować CSS jako narzędzie do zrozumienia struktury i wyboru elementów. Omówmy kluczowe pojęcia CSS, które są ważne dla scrapingu:
- Selektory — to reguły, które wskazują na konkretne elementy HTML. Ich użycie pomaga dokładnie zidentyfikować potrzebne dane.
- Atrybuty
class,id, iname— są to unikalne identyfikatory, pomagające wyróżnić i odróżnić elementy. Dla scrapingu są szczególnie przydatne, ponieważ pomagają izolować potrzebne elementy, co upraszcza ekstrakcję danych.
2. Podłączanie CSS do dokumentu HTML
CSS może być podłączone do HTML na różne sposoby. Ważne jest, aby zrozumieć te sposoby, by nawigować po elementach i określać ich style oraz klasy, ponieważ to pomoże izolować docelowe dane.
Zewnętrzny plik
CSS często jest podłączone jako zewnętrzny plik, co można zauważyć w dokumencie HTML za pomocą tagu <link> w sekcji <head>. Zewnętrzne pliki CSS definiują style dla całej strony, w tym identyfikatory i klasy, co ułatwia nawigację przy scrapingu.
<head>
<link rel="stylesheet" href="styles.css">
</head>
Style wewnętrzne
Czasami style mogą być zdefiniowane wewnątrz strony za pomocą tagu <style>. Style wewnętrzne można znaleźć w sekcji <head> strony jako podpowiedź do zrozumienia klas i identyfikatorów, według których można wybrać potrzebne elementy.
<head>
<style>
.price {
color: red;
}
</style>
</head>
Style wbudowane (atrybut style)
Style wbudowane znajdują się bezpośrednio w tagach HTML i wpływają tylko na konkretny element. Atrybut style często zawiera unikalne właściwości, które mogą być użyteczne do identyfikacji docelowych danych.
<p style="color: red; font-size: 18px;">Tekst ze stylem wbudowanym</p>
<p style="color: red; font-size: 18px;">Tekst ze stylem wbudowanym</p>
3. Selektory w CSS
Selektory w CSS są używane do stosowania stylów do elementów, jednak dla web-scrapingu ich główne zastosowanie to dokładny wybór elementów, które zawierają potrzebne dane. Omówmy główne rodzaje selektorów, które można używać przy web-scrapingu.
Podstawowe typy selektorów
Selektor po tagu: Ten selektor wybiera wszystkie elementy określonego tagu (na przykład <p> lub <div>). W web-scrapingu selektory po tagu są przydatne do wyodrębniania informacji z tagów, które mogą zawierać tekst, obrazy i inne informacje.
p {
color: blue;
}
Selektor po klasie: Ten selektor wybiera elementy z określoną wartością atrybutu class. Klasa oznaczana jest kropką (.) przed nazwą. W web-scrapingu klasy są szczególnie przydatne, ponieważ mogą identyfikować elementy o takich samych stylach, na przykład lista produktów.
.price {
color: red;
}
.price {
color: red;
}
<p class="price">Cena: $99</p>
Selektor po identyfikatorze (ID): Ten selektor wybiera element z unikalnym atrybutem id, oznaczanym symbolem #. W web-scrapingu id jest szczególnie przydatny do wyboru unikalnych elementów, takich jak nagłówek lub przycisk na stronie.
#product-title {
font-size: 24px;
}
#product-title {
font-size: 24px;
}
<h1 id="product-title">Nazwa produktu</h1>
GO TO FULL VERSION