Summary  
This chapter covers using browser developer tools to locate and identify HTML elements by their tag, class, or id for subsequent selection in code.

General domain of usage  
Web development

Nyt kun tiedät, että __HTML__-elementit käyttävät erilaisia tageja ja voivat sisältää luokkia sekä id-tunnisteita, kuinka voit selvittää tietyn verkkosivun elementin `tag`/`class`/`id`-tiedot?

Koska tunnet __DevTools__-työkalun, voit helposti siirtyä haluamaasi kohtaan __HTML__:ssä, jossa kyseinen elementti sijaitsee. Esimerkiksi __Chrome-selaimessa__ tulee klikata vasemmassa yläkulmassa olevaa __DevTools__-painiketta ja viedä kursori kiinnostavan verkkosivun alueen päälle.

Kun viet hiiren elementin päälle, saat lyhyen __yleiskatsauksen__. Vasemmanpuoleinen klikkaus elementtiin avaa vastaavan kohdan __HTML__-dokumentissa.

## Tehtävä
Siirry seuraavalle 
<a href="https://codefinity-content-media.s3.eu-west-1.amazonaws.com/18a4e428-1a0f-44c2-a8ad-244cd9c7985e/page.html" target="_blank"><svg width="1em" height="1em" viewBox="0 0 30 32" fill="none" xmlns="http://www.w3.org/2000/svg"><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M17.289 17.305v0c-1.754 1.754-4.597 1.754-6.351 0l-7.76-7.759c-1.755-1.755-1.755-4.601 0-6.356v0c1.753-1.753 4.595-1.756 6.351-0.005l6.208 6.187"></path><path fill="none" stroke="#098f67" style="stroke: var(--color1, #098f67)" stroke-linejoin="miter" stroke-linecap="round" stroke-miterlimit="4" stroke-width="2.4156" d="M12.504 13.97v0c1.754-1.754 4.597-1.754 6.351 0l7.762 7.762c1.754 1.754 1.754 4.597 0 6.351v0c-1.754 1.754-4.597 1.754-6.351 0l-5.953-5.953"></path></svg> sivulle</a>.

Etsi DevToolsin avulla kaikkien kuvien (`class`-tagi) `<img>`-nimi sivulta.

Opi keräämään arvokasta dataa verkkosivuilta automaattisesti. Hallitse tehokkaat tiedonkeruumenetelmät, jotka mahdollistavat syvällisen analyysin, tietoon perustuvan päätöksenteon ja uusien oivallusten löytämisen laajasta verkkotiedon määrästä.

Tutustu HTML-tiedoston rakenteeseen, opi lataamaan se tehokkaasti ja hanki käytännön taitoja sen sisältämän datan käsittelyyn.

Tutustu Beautiful Soupin perusteisiin tiedon poimimiseksi HTML-dokumenteista. Opiskele HTML:n rakenteen navigointia, tiettyihin elementteihin pääsyä sekä lapsielementtien käsittelyä vahvan pohjan rakentamiseksi web-scrapingiin.

Hallitse elementtien attribuuttien ja sisällön käsittely Beautiful Soupin avulla. Kehitä taidot tietyn tiedon poimimiseen, elementtien etsimiseen attribuuttien arvojen perusteella sekä edistyneiden tekniikoiden hyödyntämiseen HTML-datan tehokkaassa jäsentämisessä ja analysoinnissa.

Elementin Käsitteleminen

Tehtävä