이 포스팅은 PC로 작성되었습니다.
모바일로 보시는 분들에게는 가끔
줄 바꿈이 어색하게 보일 수 있습니다.
지난 포스트
지난 포스트에서는 뜻밖에 갑자기 튀어나온 CSS 복습을 했습니다.
이번에는 드디어 오랜만에 직접 코드를 짜며 실습을 하게 됐습니다.
만세~~
document.querySelector('선택할 태그')
위의 소스 코드는 PC에서 드래그 후,
ctrl+x로 잘라내서 다른 곳으로 붙여넣기가 가능합니다.
ctrl+c(복사)는 불가능합니다.
강의 영상를 보면 언젠가부터 이고잉 님이 검색을 하는 모습을 자주 보여주십니다.
여기서 가르쳐주는 소스 코드들이야 우리들은 그대로 따라하고 있을 뿐이지만, 우리가 모르는 것을 찾을 때에는 우리도 저렇게 구글에서 검색을 해보는 습관을 들여야겠습니다.
document.querySelector(' ')는 제어를 할 태그를 선택하는 코드입니다.
태그를 선택할 때는 작은따옴표 안에 그냥 그 태그를 써넣어주시고, id를 선택할 때는 #을 붙이고 id이름을, class를 선택할 때에는 .을 앞에 붙이고 class명을 붙여줍니다.
위의 소스 코드로 완성된 파일도 올려두겠습니다.
버튼을 누르면 백그라운드 컬러와 폰트 컬러가 변경되는 것을 확인할 수 있습니다.
다음 포스트
이 글이 도움이 됐다면 하단의 ♡ 공감 버튼을 꾹 눌러서
빨간 하트♥로 만들어주세요.
지인에게 보여주고 싶은 글이었다면
공감 버튼 옆을 클릭해서 SNS에 공유해주세요.
댓글은 블로그 운영에 큰 힘이 됩니다.
'front-end > JavaScript' 카테고리의 다른 글
자바스크립트, 조건문의 활용 (0) | 2021.01.27 |
---|---|
자바스크립트, 비교 연산자・불리언・조건문 (0) | 2021.01.26 |
자바스크립트, 웹브라우저 제어 (0) | 2021.01.24 |
자바스크립트, 변수와 대입 연산자 (0) | 2021.01.23 |
자바스크립트 데이터 타입, 숫자와 문자열 (0) | 2021.01.22 |
댓글