HTML
HyperText Markup Language의 약자로 웹에서 페이지를 표시할 때 사용되는 마크업 언어입니다.
HTML Element
HTML에서는 요소 라는 것이 중요하며, body, head, div, li 등이 있습니다.
이 요소를 꺽새를 이용하여 <body> : 열고 </body> : 닫는다 로의 의미로 사용합니다.
또한, 기능에 따라 열어주기만 하는 요소도 존재합니다. 줄을 추가하거나 하는 기능입니다.
Python with HTML
<ul>
<li>Hi</li>
<li>HTML</li>
<li>!</li>
</ul>
CSS
CSS는 웹 페이지 문서가 어떻게 표현되는지 알려주는 언어로, Cascading Style Sheets의 약자입니다.
한마디로 HTML로 구성된 웹 페이지를 CSS로 꾸며주는 것입니다.
CSS Selector
CSS에서는 여러가지 셀렉터들이 존재하며, 이를 통해 특정요소를 선택할 수 있습니다
기본 셀렉터에는 Type selector, Class selector, Id selector이 있습니다.
CSS 상속
CSS는 상위 요소의 스타일을 상속받도록 되어 있습니다.
CSS 클래스
클래스는 어떤 특정 요소들의 스타일을 정하고 싶을 때 사용 되며, 여러개의 요소들에 대한 스타일을 정할 때 보통 클래스를 지정해서 사용합니다.
# 첫번째 방법
<p class="food">I have a potato chips class</p>
# 두번쨰 방법
.food {
color:"green";
}
CSS ID
클래스와 비슷하게 사용할 수 있는 것으로 ID가 있습니다. HTML에서는 클래스 뿐 아니라 ID도 지정 가능합니다.
# 첫번쨰 방법
<p id="fruit">MY banana is green</p>
# 두번째 방법
#pink {
color:"pink";
}
DOM
Document Objecct Model의 약자로 DOM은 웹 페이지에서 중요한 역할을 하는 문서 객체 모델입니다.
HTML, XML 등 문서의 프로그래밍 인터페이스입니다.
- querySelector: 셀렉터(들)과 일치하는 요소를 리턴합니다.
- querySelectorAll: 셀렉터(들)과 일치하는 모든 요소들을 리턴합니다.
- getElementsbyTagName: 태그 이름으로 문서의 요소들을 리턴합니다.
- getElementById: 'id' 가 일치하는 요소들을 리턴합니다.
- getElementsByClassName: '클래스' 가 일치하는 요소들을 리턴합니다.
python with DOM
# 개발자 콘솔창에서 해당 명령어로 검색
document.querySelector('h1')
<html>
<head>
</head>
<body>
<h1>h1 태그입니다.</h1>
<p> p 태그입니다.</p>
</body>
</html>
# 위와 같은 HTML 웹 페이지가 존재한다고 했을 때 DOM을 사용하면 태그를 조회하여 내용을 확인할 수 있습니다
웹 스크래이핑 / 크롤링
웹스크레이핑 혹은 크롤링은 웹을 돌아 다니면서 정보를 수집하는 행위 입니다.
단지 크롤링은 자동화에 초점이 맞춰져있고, 스크레이핑은 특정 정보를 가져오는 것이 목적입니다.
파이썬에서는 request,와 beautifulsoup 라이브러리를 통해 스크레이핑 혹은 크롤링을 합니다.
Python with scraping and crawling
import requests
url = 'www.naver.com'
test = requests.get(url)
print(test)
# 결과 값이 200이 나온다면 정상적으로 연결 되었다는 의미입니다
import requests
from bs4 import BeautifulSoup
url = 'www.naver.com'
page = requests.get(url)
soup = BeautifulSoup(page.content, 'html.parser')
print(soup)
# 결과 값이 200이 나온다면 정상적으로 연결 되었다는 의미입니다
'파이썬프로그래밍' 카테고리의 다른 글
파이썬 - 싱글언더스코어, 더블언더스코어 (0) | 2021.08.31 |
---|---|
파이썬 - 디버깅편(Pdb, breakpoint( )) (2) | 2021.08.30 |
FLASK 정리_GET_POST (0) | 2021.08.02 |
try, except, raise, finally (0) | 2021.07.29 |
파이썬 @property, getter, setter (0) | 2021.07.15 |