본문 바로가기

Dev23

[노마드코더] 바닐라 JS로 크롬 앱 만들기 - #3.1 #2.15 HTML in Javascript 들어가며 특정한 무언가를 가져와보자. 우린 HTML에서 항목들을 가지고 와서, JavaScript를 통해 항목들을 변경할 것임. 우리가 JavaScript로 정보를 가지고 올 수 있는 방법은 document 객체와 element를 가져오는 수많은 함수들을 이용하는 것임. 이번 강의에서 전부 알아볼 것임. 개념 Grab me! document.getElementById()를 이용하여 h1의 id로 값을 가져올 수 있음. 여기서 우리는 JavaScript에서 위 HTML을 가져오는 것임. JavaScript는 위 HTML의 element를 가지고 오지만, HTML 자체를 보여주지는 않음. consol.dir() const title = document.getEle.. 2021. 11. 27.
[노마드코더] 바닐라 JS로 크롬 앱 만들기 - #3.0 #3.0 The Document Object 들어가며 이번 강의에서는 이제 JavaScript가 브라우저를 어떻게 움직이게 하는지 배우게 될 것 HTML은 접착제 같은 것. 그래서 HTML이 CSS와 JavaScript 를 가져옴. JavaScript를 사용하는 이유는 HTML과 상호작용하기 위해서임. 즉, HTML의 Element들은 JavaScript를 통해 변경하고 읽을 수 있음. console 창에서 document를 입력해보자. 결과값으로 document가 정의되어있는 걸 볼 수 있음. console에 document를 입력하면, 작성한 HTML을 가져올 수 있음. document는 브라우저에 이미 존재하는 Object이기 때문. document는 많은 것들이 들어있는 Object. docume.. 2021. 11. 26.
[노마드코더] 바닐라 JS로 크롬 앱 만들기 - #2.15 #2.15 Conditionals Part 3 개념 코드를 짜다보면 조건이 하나보다 더 많을 때가 있음. 이전 글에서는 조건이 하나인 경우를 배웠지만, 조건이 둘 이상일 경우를 배워보자. if(condition1){ /// condition1 === true } else if (condition2) { /// condition2 === true } else { /// condition1 and conditon 2 === false } 예제 음주가 가능한 나이인지 아닌지 알려주는 코드를 만들어보자 입력받은 age가 number가 아닐 때 실행되는 조건 입력받은 age가 number일 때 실행되는 조건 const age = parseInt(prompt("How old are you?")); if(isNan(.. 2021. 11. 21.
[노마드코더] 바닐라 JS로 크롬 앱 만들기 - #2.13 ~ #2.14 #2.13 ~ #2.14 Conditionals 개념 조건문(Conditionals)이란 참(True) 혹은 거짓(False)을 알려줌. 그래서 뭔가를 확인해야 할 때 대부분 사용. ex) 사용자가 로그인 되어 있다면, 특정한 무엇인가를 보여줌 사용자가 무엇을 입력하더라도 number로 바꿔보자 value의 타입을 확인하기위해 typeof 함수 사용 String을 Number 타입으로 바꾸기 위해 parseInt 함수 사용 console.log(typeof "15", typeof parseInt("15")); cf. NaN은 parseInt 함수가 작동하지 않음. isNaN이라는 함수를 사용하면 boolean으로 결과가 나옴. 결과 값은 참(true-숫자가 아닐 때) 혹은 거짓(false-숫자일 때). .. 2021. 11. 20.