본문 바로가기

바닐라 스크립트3

바닐라 자바스크립트 - 유효성 검사 더보기 출처 및 참고 : - https://nomadcoders.co/ 본 포스팅은 노마드 챌린지의 무료 강의를 참고해 포스팅 하였습니다. username 유효성 검사하기 우선적으로 username이 비어서도 안되고 너무 길어서도 안된다. 우리는 if, else문을 활용하여 username이 빈 인풋값인지 확인하고 15글자가 넘는지 확인하는 법을 알아볼 것이다. HTML Log In # JS로의 검사 먼저 자바스크립트로의 검사 코드이다. const loginInput = document.querySelector("#login-form input"); const loginButton = document.querySelector("#login-form button"); function onLoginBtnCl.. 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.