-
자바스크립트의 시작 - 1. 웹과 Javascript공부일기/부스트코스 2020. 9. 25. 18:28
1. 목적
Javascript는 사용자와 상호작용을 하는 것을 목적으로 하는 웹브라우저 언어이다. 웹 브라우저는 한 번 출력되면 바뀔 수 없지만 Javascript 코드에 따라 style 속성이 추가되며 디자인이 바뀐다. 이런 JS의 특성을 이용해 웹페이지를 더 동적으로 만들 수 있다.
2. HTML과 JS의 만남: script 태그
- Script 태그: JS는 HTML 위에서 동작하는 언어다. <script> 태그를 사용함으로써 HTML 안에 Javascript 코드를 쓸 수 있다.
- HTML / Javascript: HTML로 작성된 코드는 정적이나, JS로 작성된 코드는 동적이다.
<body> <script> document.write('hello wolrd'); </script> </body>3. HTML과 JS의 만남: 이벤트
- 이벤트: onclick, onchange 등과 같은 웹 브라우저에서 일어나는 사건. 사용자와 상호작용하는 웹사이트를 만들 수 있게 한다.
- onclick, onchange: 사용자가 클릭하면 이를 실행해주는 것.
<input type="button" value="hi" onclick="alert('hi')">4. HTML과 JS의 만남: 콘솔
- 콘솔(Console): 콘솔을 이용해 파일을 만들지 않고 바로 JS 코드를 실행할 수 있다. 콘솔을 통해 입력된 코드는 현재 페이지에서 즉석으로 실행된다.
5. 데이터타입(문자열과 숫자)
- 문자열
- 숫자
6. 변수와 대입연산자
- 변수
- 대입 연산자
- 상수
7. 웹브라우저 제어
- 제어할 태그 선택하기
- qeurySelector: 선택자를 이용해 원하는 태그를 선택할 수 있다.
documnet.querySelector("body").style.backgroundColor = "black";// 데이터타입 부분, 변수와 대입연산자 부분은 파이썬 등을 통해 이해한 개념이라 가볍게 들으면서 넘어갔다.
'공부일기 > 부스트코스' 카테고리의 다른 글
자바스크립트의 시작 - 3. Javascript 활용 (0) 2020.10.01 자바스크립트의 시작 - 2. Javascript 제어문, 함수, 객체 (0) 2020.09.29 CSS - 5. 미디어쿼리 (0) 2020.09.22 CSS - 4. 레이아웃 (0) 2020.09.21 CSS - 3. 폰트, 텍스트 (0) 2020.09.19