바닐라 자바스크립트5 바닐라 자바스크립트 - Input과 Button 더보기 출처 및 참고 : - https://nomadcoders.co/ 본 포스팅은 노마드 챌린지의 무료 강의를 참고해 포스팅 하였습니다. 본격적인 앱 만들기 강의에 들어갔다. 그래도 기초적인 부분은 다뤄야 하니 input과 button을 이용한 value를 테스트하는 시간을 가져보자 Input과 Button # 설계 - 앱이 사용자에게 질문한다. 너는 누구인가? (이름, ... 등등) - 해당 정보를 어떻게 받아올 것인가 - 받아온 정보를 어떻게 화면에 보여줄 것인가. * 기초원리 user의 이름을 기억하는 것처럼 JavaScript에는 value(값)를 기억하게 하는 아주 쉬운 방법이 있다. 하지만 모든 것은 HTML에서 시작되어야 한다. HTML을 작성한 다음 그 안에 존재하는 element들을 가.. 2021. 9. 24. 바닐라 자바스크립트 - Event listen하기 더보기 출처 및 참고 : - 노마드 코더 챌린지(바닐라 JS로 크롬 앱 만들기) : https://nomadcoders.co/ - # Event Listen event란 "내가 마우스로 웹 내에 무언가를 click한다" "h1 태그 위로 마우스를 올린다." - 인풋박스에 타이핑을 끝내거나, 글을 쓰거나, enter 누르는 것 또한 event에 속한다. - 또 Wifi의 접속이 해제되는 경우도 event가 될 수 있다. 위에 말한 모든 event들을 JavaScript는 listen 할 수 있다, 오늘은 click event를 알아보자 지금까지 배운 내용으로는 HTML Element를 JavaScript로 가져오는 방법을 배웠다. // 실습 기초 js 코드 const title = document.quer.. 2021. 9. 23. 바닐라 자바스크립트 시작(3) 더보기 출처 및 참고 : - 노마드 코더 챌린지 바닐라 자바스크립트로 크롬 앱 만들기 : https://nomadcoders.co/ - HTML Document Reference : https://developer.mozilla.org/ko/ 복습 차원 * 꼭 이해해야 할 거 : 우리가 하고 있는 app.js가 있기 때문에 javascript를 통해 HTML의 내용을 가져올 수 있는 것이다 * 좀더 구체적인 엘리먼트를 선택 : querySelector , querySelectorAll - getElement ~~ 보다 구체적으로 element를 지정 가능하다. * 포인트 : document가 HTML이 app.js를 load하기 때문에 존재하는 것임. 그 다음에 브라우저에서 우리가 document에 접근.. 2021. 9. 23. 바닐라 자바스크립트 시작 (2) 더보기 본 글은 노마드 코더 챌린지 하기 전 기본내용에 대한 자료를 바탕으로 썼습니다. 출처 및 참고 : https://nomadcoders.co/vanillajs-challenge 조건문 (Conditional) 조건문(conditional)은 true인지 false인지 알려주기 때문에 아주 중요하다 무언가를 확인해야할 때 거의 대부분 사용한다. - 사용자가 로그인되어 있으면 무언가를 보여준다던가 - 사용자가 무언가를 할 때 반응하는 것을 보여준다던가 prompt() : 사용자에게 창을 띄울 수 있게 해준다. - 조건문을 사용한 함수라고 보면 된다. * prompt 함수가 실행되면 자바스크립트 전체가 일시적으로 정지된다고 한다. Document에 대해 - console.dir(document) 로 do.. 2021. 9. 8. 이전 1 2 다음
