100. 파이널 프로젝트 (5)html 기본

개인공부/Python

100. 파이널 프로젝트 (5)html 기본

LEE_BOMB 2022. 1. 8. 21:11

html?

태그 이름 / 속성(attribute) 2가지로 구성
* 태그 이름 : 태그를 상징하는 <> 기호 안에 들어가는 정보 ex) p, li, img (html은 항상 열고 닫는 <태그><태그/>로 구성)
* 속성 : 태그가 가진 추가정보. 속성 이름 & 속성 값이 하나의 쌍 ex) name = "value"

1.1 기본 태그 - html, head, body
html 문서인 걸 표시하는 <html></html>
필요한 데이터를 불러오거나, 문서 정보를 표시할 때 쓰는 <head></head>
웹 페이지를 표시할 때 쓰이는 <body></body>로 구성
* <html><head><body> 태그는 항상 있어야 함

1.2 기본 태그 (문자) - p, h1
<p></p> : 문자를 적을 때 쓰는 태그

<h1></h1> : 문자를 적을 때 쓰는 태그. h1은 문자의 크기가 기본적으로 정해져 있다 (h1,h2,h3,h4,h5,h6 같이 점점 작은 크기의 문자를 표시)

1.3 기본 태그 활용해보기 - img, a href, input
<a></a> a 태그 : 다른 사이트에 링크를 걸 때
input 태그 : 입력을 받을 때. (버튼 생성 시 사용 ex. <input></input>)
img 태그 : 이미지를 표시할 때 ex. <img src=""/>

2. css - html 스타일링
html 태그별로 스타일링 가능

2.1 html, css - id와 class의 차이점

id, class 모두 html 속성을 구분할 때 사용

id와 class를 통해 html 속성에 접근하거나, 꾸미거나 변경할 수 있음
* id는 <p id="my-id"> </p> 같은 식으로 작성, class는 <p class="textStyle"></p> 와 같은 형식으로 작성

css에서는 원하는 id와 class만 스타일링 해줄 수 있음
id는 #id로 표기, 클래스는 .class로 표기

2.3 CSS - 자식 태그에 접근하기
p em은 em이 p보다 안쪽에 있는 경우면 다 해당
반면 > 기호가 있으면 바로 안쪽에 있는 경우만 해당

파싱? (Parsing)

어떤 페이지(문서, html 등)에서 내가 원하는 데이터를 특정 패턴이나 순서로 추출해 가공하는 것

사용하기 쉽게 분해하는 것!

선택자 경로 찾기

선택자? HTML의 태그들에 이름을 만들어 스타일시트로 제어하는 역할

html의 구조를 파악해서 직접 경로를 찾는 것 (슷한 구조를 가진 복수의 데이터를 뽑을 때 유용)

copy를 이용해 선택자(selecor) 경로를 복사 (단일 데이터를 뽑을 때 유용)

	클래스	id
선택자	.클래스명	#ID
가능한 개수	여러 개	단 한 개
장점	똑같이 생긴 리스트 여러 개 추출	다른 데이터가 예상치 못하게 수집될 가능성 존재
단점	예상치 못한 다른 요소가 추출될 수 있으므로 검증 필요	여러 요소 함께 가져올 수 없음

관련 Python 라이브러리

1. requests

import requests

HTTP 요청을 보낼 수 있는 기능을 제공하는 라이브러리
서버로부터 응답을 요청하고 HTML 코드를 받음

어떤 방식(method)의 HTTP 요청을 하느냐에 따라서 해당하는 이름의 함수를 사용

GET 방식: requests.get()
POST 방식: requests.post()
PUT 방식: requests.put()
DELETE 방식: requests.delete()

- requests 모듈의 get() 함수는 응답 (Response) 객체를 돌려줌 (status_code, text, url, headers 등)
- response된 객체의 요소들 중 text 요소를 불러오면 html 코드의 텍스트가 불러와진다
- html.select() 함수를 사용하면 html 변수에 담긴 HTML 문서 안에서 입력된 선택자를 갖는 요소를 리스트 타입으로 모두 가져온다

* HTML변수.select('선택자')의 결과는 여러 요소가 존재할 경우를 상정하여 결과를 리스트로 반환

2. Beautiful Soup

from bs4 import BeautifulSoup

웹 페이지의 정보를 알아볼 수 있도록 파이썬 용어로 바꿔줘서 쉽게 스크래핑이 가능
html.parser, lxml과 같은 parser를 통해 파싱함으로서 파이썬 인터프리터가 해석할 수 있는 구조 생성

.prettify() : 문서 계층구조 조회

.select_one : 1개의 태그만 반환
.select : 모든 태그를 반환

.find() : 1개의 태그만 반환
.find_all() : 모든 a 태그를 리스트 형태로 반환

.title : title 태그 반환

.title.name : title 태그의 이름(‘title’)을 반환

.title.string : title 태그의 문자열을 반환
.title.parent.name : title 태그의 부모 태그의 이름을 반환

.p : 첫 p태그 반환
.p[‘class’] : ‘class’ 속성이 있는 첫 p 태그를 반환

.a : a 태그를 반환
.get() : href 속성을 반환
.get_text() : html 문서 안에 있는 텍스트를 반환

참고

https://codetorial.net/beautifulsoup/basics.html

https://beautiful-soup-4.readthedocs.io/en/latest/

https://realpython.com/python-requests/

https://www.daleseo.com/python-requests/
https://book.coalastudy.com/data-crawling/week-1/stage-4